Accueil
/
Ecommerce
/
Comment personnaliser l'en-tête de mon site web

Comment personnaliser l'en-tête de mon site web

La zone d’en-tête est la barre de navigation de votre site web. C’est une partie importante qui vous permet de mettre en avant les pages ou sections les plus critiques de votre site web auxquelles les visiteurs peuvent facilement accéder.

Dans ce bref tutoriel, vous apprendrez à personnaliser l’en-tête.

Comment personnaliser l’en-tête dans Website Builder

Comment personnaliser le contenu de l’en-tête

  1. Accédez à Site Admin > Website Builder, et appuyez sur le bouton Personnaliser.
    Bouton Personnaliser dans Site Admin de Website Builder
  2. Ouvrez l’onglet Pages.
  3. Accédez à Modèles de site, et cliquez sur En-tête.
    Paramètres d'en-tête pour Website Builder
  4. Personnalisez divers aspects de la zone d’en-tête, tels que la mise en page, le type de menu, l’alignement du menu, le logo, et le favicon.
    Options de personnalisation de l'en-tête dans Website Builder

Comment personnaliser la couleur de l’en-tête

  1. Dans Site Admin, ouvrez le Website Builder.
  2. Cliquez sur Personnaliser.
  3. Ouvrez l’onglet Pages, et sélectionnez En-tête.
  4. Choisissez une des couleurs de la palette prédéfinie dans le menu Couleur de l’en-tête.
    Paramètres de couleur d'en-tête dans Website Builder

REMARQUE ! La couleur du texte changera également pour correspondre à la nouvelle couleur puisque vous avez des combinaisons de couleurs prédéfinies, texte et fond, afin de garantir l’accessibilité et d’autres normes où le contraste des couleurs est respecté. Vous pouvez changer la palette de couleurs par défaut depuis la section Style > Couleurs.

Comment personnaliser le menu de navigation de l’en-tête

  1. Connectez-vous à votreSite Admin.
  2. Ouvrez la section Website Builder.
  3. Cliquez sur le bouton Personnaliser.
  4. Ouvrez l’onglet Menus.
  5. Pour ajouter un nouvel élément de menu, cliquez sur l’onglet Nouveau produit.
    Ajout d'un élément au menu d'en-tête dans Website Builder
  6. Pour ajouter l’élément à l’en-tête, sélectionnez Menu principal dans le menu déroulant Emplacement.
    Sélection de l'en-tête pour l'emplacement d'un élément de menu
  7. Sélectionnez le type d’élément dans le menu Type de lien. Vous pouvez choisir entre Page, Étiquette, et Lien externe. Si le type est Page, sélectionnez une des pages de votre site web dans le menu déroulant ci-dessous.
  8. Attribuez le nom de l’élément qui apparaîtra dans le menu de l’en-tête.
  9. Confirmez l’élément avec le bouton Ajouter l’élément.
    Bouton Ajouter l'article pour confirmer un nouvel élément de menu d'en-tête dans Website Builder
  10. Vous pouvez également supprimer des éléments de la liste des éléments de menu dans Navigation principale. Pour supprimer un élément de menu, survolez-le et appuyez sur l’icône corbeille (Supprimer). Dans la fenêtre pop-up suivante, appuyez sur Confirmer.
    Suppression d'un élément de menu d'en-tête dans Website Builder

  11. Vous pouvez également réorganiser l’ordre des éléments. Il suffit de faire glisser l’élément choisi et de le déposer à la position souhaitée.
    Réorganisation des éléments de menu d'en-tête dans Website Builder

Comment personnaliser l’en-tête dans SiteGround Ecommerce

Comment personnaliser le contenu de l’en-tête

  1. Connectez-vous à votre Site Admin de votre SiteGround Ecommerce.
  2. Ouvrez l’onglet Pages, naviguez jusqu’à Modèles de site, et cliquez sur En-tête.

    Onglet Pages du créateur SiteGround Ecommerce avec la section En-tête mise en évidence

  3. Ici, vous pouvez choisir le type de menu, l’alignement du menu, la mise en page, le logo et le favicon.
    Menu des paramètres de l'en-tête dans SiteGround Ecommerce

Comment personnaliser les couleurs de l’en-tête

  1. Dans le créateur de votre boutique, ouvrez l’onglet Pages, et sélectionnez En-tête dans les Modèles de site.

    Onglet Pages du créateur SiteGround Ecommerce avec la section En-tête mise en évidence où vous pouvez changer la couleur de l'en-tête

  2. Faites défiler jusqu’à la section Couleur de l’en-tête, où vous pouvez sélectionner l’une des couleurs prédéfinies pour l’en-tête.
    Menu de couleur de l'en-tête avec différentes palettes de couleurs

REMARQUE ! Vous pouvez choisir entre des combinaisons de couleurs prédéfinies pour les couleurs de fond et de texte qui sont optimisées pour une meilleure lisibilité. La palette de couleurs choisie prédéfinit les combinaisons de couleurs disponibles. Pour sélectionner d’autres combinaisons, changez la palette de couleurs depuis les paramètres Style > Couleurs.

Comment personnaliser le menu de l’en-tête

  1. Dans le créateur, accédez à l’onglet Menus.
  2. Pour ajouter un nouvel élément, cliquez sur le bouton Nouvel élément.
    Bouton Nouvel Élément dans le menu Navigation de SiteGround Ecommerce
  3. Pour vous assurer que l’élément est ajouté à l’en-tête, sélectionnez Menu principal dans le menu déroulant Ajouter à.
    Emplacement Navigation Principale sélectionné pour ajouter un élément à l'en-tête
  4. Sélectionnez le type d’élément que vous ajoutez dans le menu déroulant Type de lien. Vous pouvez choisir entre Page, Lien externe, Produit unique, Catégorie, Marque, et Étiquette.
    Menu de type de lien pour sélectionner le type du nouvel élément de menu
  5. Si vous avez sélectionné Page, Produit, Catégorie, ou Marque, vous pouvez choisir un des éléments existants dans le type de lien respectif.
  6. Dans Nom de l’élément de menu, tapez le nom qui apparaîtra dans l’en-tête.
  7. Finalement, appuyez sur Ajouter l’élément.
    Bouton Ajouter Élément pour confirmer l'ajout du nouvel élément de menu d'en-tête
  8. Pour supprimer un lien de l’en-tête, revenez à la liste Navigation principale, survolez l’élément choisi, et appuyez sur l’icône corbeille (Supprimer). Une nouvelle fenêtre s’affichera, où vous devez sélectionner Confirmer.
    Icône Supprimer pour supprimer un élément du menu d'en-tête
  9. Vous pouvez également changer l’ordre des liens de l’en-tête. Pour ce faire, faites glisser l’élément choisi et déposez-le à la position préférée.
    Déplacement d'un élément pour changer sa position dans le menu d'en-tête

Partager cet article