Installation du thème Fashion SEO pour PrestaShop
Cela se passe via l’installateur de PrestaShop, dans : Apparence -> Thème et logo -> Ajouter un thème
Si besoin, configurer ensuite les modules nécessaires sur l’accueil (Carrousel, Bannière, Editeur de page d’accueil, etc), dans Apparence -> Positions
Nous vous fournissons 2 thèmes
- 1 thème parent : il doit obligatoirement être installé, c’est le thème principal.
- 1 thème enfant : il peut être installé en complément si vous comptez apporter des modification au thème parent.
Quel est l’intérêt d’un thème enfant ?
Le thème enfant offre la possibilité d’apporter des modifications aux fichiers sources tout en permettant les mises à jour du thème parent sans perdre ces modifications. Cela s’adresse aux personnes qui ont des notions en développement. Utiliser un thème enfant vous permet d’apporter des modifications à votre thème, sans jamais avoir à toucher aux fichiers originaux du thème parent. Si vous ne comptez pas modifier le code du thème, n’utilisez pas le thème enfant.
Par contre, il faut savoir que si vous modifiez directement le thème parent, ces modifications seront perdues à la prochaine mise à jour du thème. En conséquence, toutes les personnes qui auront personnalisé leur thème directement sur le thème parent, ne seront plus en mesure de mettre à jour leur thème ou alors une fois la mise à jour terminée, ils constateront que toutes leurs modifications ont été perdues.
Hébergement recommandés pour notre thème PrestaShop
- Entrée de gamme, pour les petits budgets : O2switch.fr
- Polyvalent et performant : Alwaysdata.com
- Infogéré et très performant, celui que nous recommandons le plus : 772424.com
Attention, nous déconseillons OVH et 1and1 qui ne sont pas assez performants et qui peuvent poser certains soucis.
Utilisation du thème Fashion SEO et de ses modules
Présentation des différentes optimisations SEO du thème
Avant de commencer à configurer le thème, il faut comprendre l’intérêt de tout ce qui a été mis en place en terme d’optimisations SEO.
Module SeoPresta – Thème Editor
Licence
- Clé de licence à renseigner pour le fonctionnement du thème
- Activation / désactivation de la licence
Si par exemple vous migrez une boutique PrestaShop de dev en prod, il faudra désactiver la clé sur la boutique de dev et l’activer sur la boutique de prod à cet endroit.
Options et couleurs générales
- Importation du logo desktop et du logo mobile
- Couleurs personnalisables
- Polices personnalisables
- Apparence du menu (taille, mise en forme…)
- Option pour afficher ou pas les popups de quick view des produits (depuis la mise à jour v1.1.0)
Réglages du header (haut de page)
- Contenu de la baseline dans topbar
Réglages de la page d’accueil
- Titre H1 et texte SEO
- Titres et sous-titres des différents blocs
- Bannières
- Ordres des blocs
Dans le cas ou les articles du blog WordPress ne doivent pas être affichés, retirer le « 7 » et laisser vide dans le champ « seoprestahomeblogpost » dédié aux positions.
Réglages des pages catégories
- Afficher ou pas les sous catégories
- Paramétrage de la longueur des résumés produits
Blog
- Renseigner le blog WordPress associé à la boutique (gestion de la relation multi-langue entre PrestaShop et WordPress via l’extension Polylang depuis la version v1.1.0)
- Nombre d’articles à intégrer sur la page d’accueil de la boutique
Pour ne plus afficher les derniers articles de blog sur la page d’accueil, il faut se rendre dans Menu -> Paramètres -> Positions -> displayHome, puis degreffer SeoPresta Blog.
Réglages du footer (pied de page)
- Obfusquer les liens du footer ou pas (sur toutes les pages ou toutes les pages sauf l’accueil)
- Bannière
- Logo
- Coordonnées (mail, téléphone, fax : masquer ou pas)
- Champ texte sous le logo
- Champ du copyright
- Texte RGPD pour la newsletter
- Réseaux sociaux (Facebook, Youtube, Viméo, Twitter, Instagram, Pinterest, Linkedin)
- 4 éléments de réassurance, pour les icônes : il faut les importer vos visuels ou les choisir ici http://themes-pixeden.com/font-demos/7-stroke/ ou https://fontawesome.com/icons?d=gallery (modifier le code comme ceci, exemple : fas fa-truck -> icon icon-truck)
Code personnalisé
- Intégration de codes personnalisés
Tracking (depuis la mise à jour v1.1.0)
- Intégration du code de tracking Google Analytics
- Intégration du code de tracking Google Search Console
- Intégration du code de tracking Pixel Facebook ID
Sauvegarder / restaurer
- Sauvegarder la configuration du thème
- Importer et exporter des backups
Module Carrousel
- Slides de la page d’accueil
Paramètres et vue des slides
Configuration pour chaque slide
Code source de la description
Pour le SEO, ne pas intégrer de balises H1, H2, H3… seulement des balises P.
Module SeoPresta – Silos
- Gestion des silos : créer les silos tout en les associant aux catégories produits et aux pages CMS.
Création des silos
Association des catégories produits aux silos
Association des pages CMS aux silos
Module SeoPresta – Menu
- Gestion du menu principal
- Association des silos aux entrées des menus
Aperçu du menu en place sur la démonstration
Onglet parent « Homme » de type classique
Onglet parent « Qui sommes-nous ? » de type méga menu
Module Inscription à la newsletter
- Texte de la newsletter présent dans le footer
Fonctionnalités à retrouver dans les réglages natifs à PrestaShop
Liens footer
- Apparence -> Link Widget : les liens présents dans le footer (à associer au point d’accroche « display footer »)
Les deux menus présent sur le footer :
Détail du menu « Produits » :
Textes SEO présents sur les pages catégories produits
- Catalogue -> Catégories : Textes SEO (sous les produits des pages catégories) à intégrer directement sur les pages catégories
Exemple en bas de la catégorie « Homme » :
Coordonnées dans le footer
- Paramètres de la boutique -> Contact -> Magasins : coordonnées dans le footer (présent aussi sur les factures)
Exemple sur notre boutique de démonstration (ce sont aussi les coordonnées reprises sur vos factures) :
Modes SeoPresta présents dans le thème, mais non configurables
Personnalisation du thème Fashion SEO
Voici une liste de ce qu’il vous faudra préparer pour paramétrer et personnaliser ONE SEO. Tout ceci n’est pas obligatoire, c’est en fonction des modules et fonctions que vous utiliserez.
Visuels à préparer pour Fashion SEO pour PrestaShop
- Logo header : 174 x 50 pixels (sur fond transparent pour un meilleur rendu)
- Logo footer : 174 x 50 pixels (blanc et sur fond transparent pour un meilleur rendu)
- Slides accueil : 1920 x 676 pixels
- 3 bannières accueil : 380 x 460 pixels
- Image associée au titre H1 et texte SEO : 940 x 946 pixels
- Bannière derrière le texte : 1920 x 676 pixels
- 4 visuels de réassurance : 111 x 110 pixels, ou à choisir ici : http://themes-pixeden.com/font-demos/7-stroke/ ou https://fontawesome.com/icons?d=gallery (modifier le code comme ceci, exemple : fas fa-truck -> icon icon-truck)
- Bannière derrière les éléments de réassurance : 1920 x 641 pixels
- Produits : 800 x 800 pixels
- Catégorie produits (bandeau principal) : 1920 x 420 pixels
- Catégorie produits (miniature) : 800 x 800 pixels
- Logos des marques : 800 x 800 pixels
Pour éditer et redimensionner les images : https://pixlr.com
Pour alléger les images, principalement celles sur l’accueil : https://compressor.io ou https://www.jpeg.io
Textes à préparer pour Fashion SEO pour PrestaShop
- Baseline du header
- Textes présents sur les slides
- Titre H1 de la page d’accueil
- Texte SEO associé au H1 accueil : 200 à 300 mots en utilisant une sémantique riche
- Texte présent sur la bannière
- 4 textes de réassurance dans le pied de page, à associer aux 4 pictos ou visuels
- Textes SEO en bas des fiches catégories (300 mots minimum)
Éléments à personnaliser pour Fashion SEO pour PrestaShop
- Couleur principale et couleur secondaire
- 2 polices d’écritures à choisir parmi : Roboto sans-serif, Open Sans sans-serif, Lato sans-serif, Montserrat sans-serif, Raleway sans-serif, Oswald sans-serif, Noto Sans sans-serif, Poppins sans-serif, Josefin Sans sans-serif, Crimson Text seri
- Texte intro newsletter footer
- Texte RGPD newsletter footer
- Liste des réseaux sociaux footer
- Champs textes de l’éditeur de thème les différents titres (principalement sur l’accueil)