Design

Design

Ce tutoriel s'applique à la version la plus récente du Phantom Thème. Veillez à mettre votre thème à jour en suivant le tutoriel vidéo disponible sur votre Espace Client.

Chaque paramètre énoncé dans le pack Classique se retrouvera dans le Pack Premium et Master +.

Chaque paramètre énoncé dans le Pack Premium se retrouvera dans le Pack Master +.

Classique

 
  • Image du Logo : Définissez votre logo de site ici-même
  • Afficher les icônes sociales : Les icônes sociales s'afficheront sous réserve que votre disposition du menu soit sur 1 Ligne ou sur 2 Ligne avec l'alignement du logo centré
  • Alignement du Logo : Sur une disposition du menu en 2 Lignes, permet d'afficher le logo à gauche ou au centré de la Barre Supérieure. Sur un menu en 1 Ligne, le logo sera obligatoirement à gauche. Sur mobile, le logo sera centré dans l'entête.
  • Largeur du Logo personnalisée (en pixel) : Permet de définir la largeur du logo en pixel  à votre convenance
  • Largeur du Logo  sur Mobile : Permet de définir la largeur du logo en % par rapport aux dimensions d'origine, l'amplitude s'étend de 50 à 100%.
  • Menu : Définissez le menu dans l'en-tête à afficher sur tout le site (votre menu principal)
  • Afficher le texte à côté de l'icône "Compte" :  Permet d'afficher ou non le texte associé à l'icône du compte client. Si l'utilisateur n'est pas connecté, le texte sera "Mon compte" par défaut. Si l'utilisateur est connecté, 2 icônes apparaissent alors : une icône pour accéder à son Espace Client, une autre pour se déconnecter. Les textes seront alors respectivement "Déconnexion"  et "Nom Prénom" du client. Ces textes sont modifiables depuis les langues du Thème.

Paramètres de Thème > Couleurs

 

  • Arrière-plan En-tête : Couleur de fond de la barre supérieure (C'est également la couleur de l'entête sur mobile)
  • Arrière-plan Menu : Couleur de fond du menu (La couleur de fond sur mobile n'est pas définissable, et sera blanche)
  • Liens : Couleurs des liens présents dans l'entête. Sur le pack classique la couleur des liens au survol n'est pas définissable. Celle-ci dépend la saturation de votre couleur. Une couleur tendant vers le blanc s'assombrira au survol, une couleur tendant vers le noir s'éclaircira au survol.
  • Arrière-plan Mégamenu : Couleur de fond du Megamenu, visible lorsque le Megamenu est en pleine largeur
  • Arrière-plan 1ère Colonne Megamenu : Couleur de fond de la 1ère colonne où se trouve les sous-menu. Cette couleur se prolongera sur les colonnes suivantes si votre nombre de liens déborde de la 1ère colonne pour en crée une deuxième. 
  • Titre Colonne Lien Menu Dépliant :  Couleur du Titre du Menu si l'option de l'afficher est activé (pour les liens avec produits)
  • Couleurs Liens Colonne Lien Menu Dépliant : Couleur des Liens du Megamenu. La couleur des liens au survol n'est pas définissable. Celle-ci dépend la saturation de votre couleur. Une couleur tendant vers le blanc s'assombrira au survol, une couleur tendant vers le noir s'éclaircira au survol. (Remarque : La couleur de fond et des liens d'un sous-sous Menu s'adaptera aux couleurs définies pour la 1ère colonne)

 

Premium

 

  • Disposition des icônes : Permet de modifier l'affichage des icônes "Compte" / "Recherche" / "Panier". Trois options s'offrent à vous :

  • Menu Barre Supérieure : Permet d'afficher un menu au choix dans la barre supérieure
  • Espacement entre les liens : Définir l'espace horizontal entre les liens du menu affiché
  • Texte Barre Supérieure :  Permet d'afficher un texte au choix dans la barre supérieure

 

Paramètres de Thème > Menu

  • Afficher Bordure entre les produits : Permet de séparer les produits affichés dans le Megamenu. La couleur de la bordure est celle de la 1ère Colonne du Megamenu
  • Afficher Bordure autour du Meganav Top : Permet l'affichage d'une bordure épaisse autour du Megamenu. La Couleur sera celle de l'Arrière-Plan du Menu
  • Épaisseur de la Bordure du Meganav : Gérer l'épaisseur de la bordure ci-dessus (en px)
  • Afficher Bordure Ronde Meganav Top : Cette option permet d'afficher un arrondi sur le Megamenu sur les angles du bas (gauche / droite)

  • Espacement entre les liens : Définit la largeur entre les liens du Menu
  • Espacement vertical entre les liens et le menu : Définit la hauteur au-dessus et en dessous des titres de liens du menu
  • Tailles Polices :
    • Lien Menu : Définit la taille de la police des liens du Menu
    • Titre Collection : Définit la taille de la police du Titre des liens du Menu étant des collections
    • Lien Megamenu : Définit la taille de la police des liens du Megamenu
  • Tailles des Polices (Mobile) :
    • Lien Menu : Définit la Taille des Liens du Menu Mobile
    • Lien Megamenu : Définit la taille des liens du Megamenu sur Mobile

 

Master +

En-Tête 

Attention : Cette fonctionnalité ne sera visible que sur la page d'accueil

  • Activer la superposition : Permet de rendre le Menu transparent sur la page d'accueil, et de le faire chevaucher la 1ère section apparente
  • Activer la superposition de la Barre Supérieure : Permet de rendre la Barre supérieure transparente sur la page d'accueil, et de le faire chevaucher la 1ère section apparente (seulement si l'option ci-dessus est activée)
  • Afficher l'ombre des liens : Affiche une ombre sur le texte des liens du Menu afin de les faire ressortir
  • Liens : Couleur des liens du Menu superposé
  • Liens au survol : Couleur des liens au survol du Menu superposé
  • Arrière-Plan de l'overlay (Sticky) : Définir la couleur de fond du menu fixé en haut de l'écran lors du défilement de la page
  • Opacité de l'overlay (Sticky) : Définir l'opacité de la couleur de fond du menu fixé en haut de l'écran lors du défilement de la page