Articles sur : Créateur de site Ex2 (site builder)

Comment créer et personnaliser un en-tête avec Ex2 Site Builder?

L'en-tête représente un élément essentiel de tout site web. Il contribue à mettre de l'avant l'image de marque du site et faciliter la navigation pour les visiteurs. L'éditeur Ex2 Site Builder vous permet de facilement créer et personnaliser tous les éléments de votre entête.

Ex2 Site Builder vous permet de créer votre entête de toute pièce. Toutefois, il est également possible d'utiliser les modèles préconstruits, qui incluent tous un entête complet. Celui-ci comprend généralement tous les éléments devant se trouver dans l'entête. Vous devriez y trouver un logo, le nom du site, un appel à l'action et un menu de navigation.

La section en-tête d'une page web



L'en-tête représente généralement la section supérieure d'une page web. Dans de rares cas, elle peut aussi être située dans une barre latérale situé à gauche ou à droite de l'écran.

L'en-tête est généralement le même sur toutes les pages d'un même site web. Cette section contient habituellement certains éléments liés à l'identité du site (comme le nom, le slogan et le logo), ainsi que le menu de navigation. Il est aussi courant d'y trouver un appel à l'action, comme un bouton de connexion.

Ajouter ou retirer des lignes de l'entête



Si vous utilisez l'un des modèles offerts par Ex2 Site Builder, celui-ci devrait déjà inclure un modèle d'en-tête. En fonction du modèle choisi, les éléments de l'en-tête peuvent être affichés sur une seule ligne, ou encore sur deux lignes superposées.

Il est possible d'ajouter ou retirer des lignes de votre entête pour configurer votre contenu comme vous le désirez. Pour ajouter une ligne, il vous suffit de cliquer sur le bouton + situé en haut ou en bas de votre entête.



Pour supprimer une ligne, survolez-la avec votre curseur. Vous verrez deux icône apparaître à la gauche de celle-ci. Cliquez simplement sur la corbeille pour supprimer la ligne en question. Notez que vous ne pouvez pas supprimer la ligne principale de votre entête.



Il est recommandé de ne pas utiliser plus de 3 lignes de contenu dans l'en-tête. Un nombre plus élevé risque de surcharger le contenu et détourner l'attention des visiteurs des éléments essentiels.

Ajouter un widget à votre entête



Vous pouvez facilement ajouter des éléments à votre entête sous forme de widgets. Pour ce faire, il vous suffit de cliquer sur l'un des boutons +, affichés aux divers emplacements libres de votre entête.



Celui-ci ouvrira un menu de widgets d'en-tête parmi lesquels vous pouvez choisir. Sélectionnez celui que vous désirez et il sera ajouté à l'endroit choisi. Vous pourrez alors le configurer et le personnaliser comme vous le désirez.



Déplacer des éléments dans votre entête



Vous pouvez facilement modifier l'emplacement de n'importe quel élément de votre entête grâce au système glisser-déposer.

Tout d'abord, cliquer sur l'élément que vous souhaitez déplacer.



En gardant le bouton de votre souris enfoncé, déplacer le curseur vers l'emplacement où vous souhaitez placer l'élément. Vous verrez un marqueur vert vous indiquer l'emplacement où sera placé l'élément si vous lâcher le bouton pour le déposer.



Une fois que vous avez trouvé l'emplacement où vous souhaitez déposer l'élément, lâcher le bouton de votre souris. L'éditeur déplacera alors l'élément en question à l'emplacement choisi.



Supprimer un élément de votre en-tête



Vous pouvez facilement supprimer n'importe quel élément de votre entête sur Ex2 Site Builder. Pour ce faire, il vous suffit de survoler l'élément en question avec votre curseur. Cliquez ensuite sur l'icône de corbeille qui apparaît en haut de celui-ci.



Configurer les paramètres de votre en-tête



Ex2 Site Builder vous permet de facilement modifier certains paramètres de votre entête. Pour ce faire, survolez la ligne principale de votre entête avec votre curseur. Cliquez ensuite sur l'icône d'engrenage qui apparaît à la gauche de celle-ci.

Notez que la ligne principale de votre entête peut être identifiée par la couleur verte du bouton engrenage. Celui des autres ligne est de couleur noire.



Vous accéderez alors à une fenêtre de gestion de configuration des paramètres. À partir d'ici, vous pouvez modifier plusieurs aspect de l'affichage. Voici un bref aperçu des options qui vous sont offertes:



Disposition de l'en-tête


Ex2 Site Builder vous offre plusieurs paramètres d'affichage différents pour les entêtes de vos pages. Il vous suffit de cliquer sur la case associée pour ouvrir un menu déroulant présentant les options disponibles.



Vous pouvez choisir la largeur de votre entête. Les 3 choix disponibles sont: pleine largeur, taille normale et compact. Vous avez également le choix d'utiliser un entête verticale, affiché à la gauche ou la droite de l'écran.

Couleur de fond


Vous pouvez choisir la couleur d'arrière-plan de chaque ligne de votre entête. Vous pouvez aussi choisir le degré d'opacité de la couleur. Si vous désirez un arrière-plan entièrement transparent, il vous suffit de fixer l'opacité à zéro.



Bordure Inférieure


Chaque ligne de votre entête peut être dotée d'une bordure inférieure. Vous pouvez déterminer la couleur de cette bordure et son opacité. Sa largeur peut facilement être modifier en cliquant sur le bouton sur lequel elle est affiché. Il vous suffit alors de faire défiler vers le haut ou le bas en gardant le bouton enfoncé pour modifier la largeur de la marge.



Modifier les paramètres des autres lignes de votre en-tête


Vous pouvez également modifier séparément les paramètres des autres lignes de votre entête. Pour ce faire, cliquer sur le bouton d'engrenage à la gauche la ligne en question.



Vous accéderez alors aux options de gestion de la ligne sélectionnée. Celles-ci se limitent généralement à la couleur et aux options de bordure.



Entête par-dessus le contenu


Cette option permet de superposer votre entête devant le contenu de vos pages. Cette solution est mieux adapté à certains design de site web que d'autres. Il vaut mieux vérifier le résultat sur différentes par de votre site si vous choisissez de l'utiliser. Assurez-vous que votre entête ne cache aucun élément important de contenu affiché sur vos pages.

Vous pouvez toutefois facilement utiliser cette option en combinaison avec un arrière-plan transparent. Il est ainsi possible de rendre plus fluide la transition entre votre entête et votre contenu.

En-tête fixe lors du défilement



Cet option vous permet de rendre votre entête "collant", ce qui est communément appelé un sticky header. Votre entête continuera alors de s'afficher en haut de l'écran des visiteurs, même lorsqu'il feront défiler vos pages web vers le bas.

Modifier les paramètres d'un seul élément de votre entête



Ex2 Site Builder vous permet aussi de configurer individuellement les paramètres de chacun des éléments de votre entête. Pour modifier les paramètres d'un élément, il vous suffit de le survoler de votre curseur. Cliquez ensuite sur le bouton d'engrenage qui apparaît au-dessus de celui-ci.



La fenêtre de gestion des paramètres généraux de l'élément s'ouvrira alors. La sélection de paramètres pouvant être configurés varie bien sûr selon la nature de l'élément en question.



Modifier le style d'un seul élément de votre entête



En plus des paramètres généraux, Ex2 Site Builder vous permet aussi de configurer les paramètres de style de chacun des éléments. Pour ce faire, il vous suffit de le survoler de votre curseur. Cliquez ensuite sur le bouton de pinceau qui apparaît au-dessus de celui-ci.



La fenêtre de gestion des paramètres de style de l'élément s'affichera. Tout comme pour les paramètres généraux, les options varieront en fonction de l'élément édité. Vous y trouverez généralement différentes options de couleur, de polices, de marges et d'effets d'animation.



Sauvegarder les modifications apportées à votre entête



Après avoir terminer de concevoir et personnaliser votre entête, cliquez sur le bouton Sauvegarder afin d'enregistrer les modifications.



Les modifications que vous avez apportées à votre entête s'appliqueront désormais à votre site web.

Mis à jour le : 24/08/2023

Cet article a-t-il répondu à vos questions ?

Partagez vos commentaires

Annuler

Merci !