Un constructeur d'en-tête et de pied de page composé de vrais blocs
Les en-têtes, pieds de page, barres supérieures, méga menus, panneaux latéraux, titres de page et héros sont des éléments que vous concevez dans l'éditeur de blocs, puis attribuez à l'ensemble du site ou à une seule page.
Mis à jour le
Des blocs imbriqués comme vous l'attendez
Un enregistrement d'en-tête contient un Header Root. Le Header Root contient un Container, et un Container contient des Zones. Une Zone est une cellule de la ligne d'en-tête : le logo dans la première, le menu dans la suivante, une icône de recherche et un panier dans la dernière.
Les zones gèrent la mise en page
Une zone détermine ce qui se trouve où. Poussez-en une vers la droite, regroupez une recherche et un panier dans un même ensemble, ou laissez une zone sans mise en forme lorsque vous souhaitez alléger le balisage.
- Les zones se réordonnent selon le point de rupture, si bien qu'un seul enregistrement couvre l'ordinateur, la tablette et le téléphone
- Toute zone peut être limitée à une catégorie d'appareil et être absente du balisage des autres.
- Classes supplémentaires sur une zone, si vous souhaitez la cibler depuis votre propre CSS
Les 22 blocs d'en-tête
Header Root
L'en-tête lui-même. Tout le reste s'imbrique à l'intérieur.
Header Container
Un conteneur de largeur qui permet à l'en-tête d'être limité, pleine largeur, ou les deux à différents points de rupture.
Zone d'en-tête
Une cellule de la ligne d'en-tête. Les zones accueillent les éléments et déterminent leur position.
Header Logo
Votre logo, avec des fichiers séparés pour les états fixe (sticky) et sombre.
Navigation de l'en-tête
Le menu principal, avec des menus déroulants et des panneaux de méga menu.
Header Search
Une icône de recherche qui ouvre un champ, ou un champ toujours ouvert.
Header Cart
Le panier WooCommerce avec son nombre d'articles et un récapitulatif déroulant.
Header Social
Une rangée d'icônes de réseaux sociaux tirées des profils que vous renseignez une seule fois.
Header Button
Un bouton d'appel à l'action avec les réglages habituels de taille, de style et de lien.
Header Icon Link
Une icône unique qui renvoie vers n'importe quelle destination, comme un numéro de téléphone ou une page de compte.
Header Info
Un petit bloc regroupant les coordonnées, une adresse ou des horaires d’ouverture.
Header Shop Search
Une recherche de produits pour les boutiques, limitée à votre catalogue.
Header Topbar
Place un enregistrement de barre supérieure au-dessus de la ligne d’en-tête.
Mega Menu Column
Une colonne à l'intérieur d'un panneau de méga menu, pour que ce panneau puisse accueillir une vraie mise en page.
7 préréglages pour démarrer
Un préréglage est un ensemble de réglages de mise en page que vous appliquez en un clic. Choisissez le comportement souhaité, puis modifiez ce que vous voulez dans les réglages du bloc.
Transparence
Aucun arrière-plan : tout ce qui se trouve derrière l'en-tête reste visible.
Semi-transparent
Un arrière-plan translucide, afin que l'image située derrière reste visible et que le texte reste lisible.
Flottant
L'en-tête flotte dans la page, avec un espace tout autour à chaque bord.
Flottant et semi-transparent
Flottant, avec aussi le fond translucide.
Petits éléments flottants
Un en-tête flottant à hauteur réduite.
Pleine largeur, fixe
Occupe toute la largeur de la fenêtre et reste fixe pendant le défilement de la page.
Fixe au défilement vers le haut
Quitte le haut de la page lorsque le visiteur fait défiler la page vers le bas, et y revient lorsqu'il remonte.
Les barres supérieures, méga menus et panneaux latéraux sont eux aussi des enregistrements
Concevez chaque en-tête une seule fois, définissez-le comme en-tête par défaut du site, puis remplacez-le sur les pages qui en veulent un autre.
Barres supérieures
Une barre supérieure est une fiche à part entière, avec ses propres blocs : un numéro de téléphone, des horaires d'ouverture, un sélecteur de langue, une promotion. Le bloc Header Topbar la place au-dessus de la ligne d'en-tête. Attribuez-en une globalement et remplacez-la page par page.
12 démos sur 88 démos proposent une barre supérieure modifiable.
Panneaux latéraux
Un panneau latéral glisse depuis le bord de l’écran pour accueillir un menu secondaire, un panier, un formulaire de contact ou un ensemble de détails qui surchargerait l’en-tête.
6 démos livrent un panneau latéral déjà relié à un déclencheur.
Attribuer une fiche se fait via un champ : choisissez le panneau latéral par défaut, le bord d'où il arrive, s'il pousse la page ou s'affiche par-dessus, et l'apparence du déclencheur. Les barres supérieures, les méga menus et les pieds de page s'attribuent de la même manière.
94 champs, la plus grande section des Options du thème
Options du thème regroupe les réglages d'en-tête communs à tout le site, qu'aucun enregistrement isolé ne devrait gérer seul. Un import de démo les définit tous pour vous, et vous modifiez ceux qui vous intéressent.
- Sur les 533 champs des Options du thème, 94 appartiennent à l'en-tête
- Définissez l'enregistrement d'en-tête par défaut, puis remplacez-le sur n'importe quelle page
- Comportement fixe, hauteur, espacements et points de rupture mobiles
- Chaque champ est documenté dans les articles de référence
40 motifs d'en-tête pour démarrer
Insérez un motif et vous obtenez des blocs ordinaires que vous pouvez réorganiser, renommer et supprimer. Rien n'est verrouillé, et rien n'est une capture d'écran d'une mise en page que vous ne pouvez pas atteindre.
- 40 motifs d'en-tête, plus que toute autre catégorie
- 16 motifs de pied de page pour l'autre extrémité de la page
- 183 motifs au total, classés dans 17 catégories
- Inséré depuis l'onglet Motifs de l'inséreur de blocs que vous utilisez déjà
Les pieds de page et les barres de copyright sont des enregistrements distincts.
Le pied de page fonctionne exactement comme l'en-tête. Un enregistrement Footer contient les colonnes, et un enregistrement Copyrights contient la fine barre en dessous, ce qui vous permet de modifier la mention légale de tout un site sans toucher au design au-dessus.
Six blocs et 17 options
Footer About pour le texte de présentation de l’entreprise, Footer Contacts pour l’adresse et le téléphone, Footer Instagram pour un flux, Footer Widget Area pour tout ce qu’un widget peut faire, Widget Links pour une colonne de liens bien ordonnée, et Copyrights pour la barre du bas.
- Attribuez un pied de page globalement ou page par page, comme pour l'en-tête
- Un enregistrement de droits d'auteur distinct pour la barre ci-dessous
- 16 motifs de pied de page pour démarrer
- Aperçu dans la zone d'édition au fur et à mesure de la création de la page
4 styles, ou créez le vôtre
La bande située sous l'en-tête est une surface de conception à part entière, avec 57 options disponibles et un réglage spécifique à chaque page que vous publiez.
Par défaut, Mini, Modèle ou Personnalisé
Par défaut correspond à la bande standard. Mini est une version compacte pour les pages intérieures. Modèle sélectionne l'une des mises en page spécialisées nommées. Personnalisé affiche un titre de page que vous avez composé vous-même à partir de blocs.
- Blocs Titre de page, Titre, Sous-titre, Fil d'Ariane et Boutons
- Une valeur par défaut pour tout le site, que chaque page peut remplacer
- L'arrière-plan, la hauteur, l'alignement et le fil d'Ariane sont tous des réglages
Inséré dans le modèle par un bloc d'emplacement
Les Hero et les Slider sont des enregistrements à part entière, comme les en-têtes. Un bloc d'emplacement se place dans le modèle de bloc et affiche le Hero ou le Slider attribué à la page consultée.
- Enregistrements Hero et enregistrements Slider, tous deux créés à partir de blocs
- Les blocs Hero Slot et Slider Slot se trouvent dans le modèle, et non dans votre contenu
- Un même modèle sert chaque page, chacune avec sa propre entrée en matière
- 12 démos sur les 88 démos proposent un slider que vous pouvez modifier
Vous construisez l'en-tête là où vous le verrez
Les blocs d'emplacement affichent l'en-tête, la barre supérieure, le titre de page, la bannière d'accueil et le pied de page dans la zone d'édition, pour qu'une page s'ouvre avec l'aspect de la page finale plutôt qu'avec une suite de paragraphes.
Une page dans l’éditeur de blocs, avec l’en-tête et le pied de page dessinés autour du contenu par le même code que celui qui les affiche pour un visiteur.
Un seul moteur de rendu
L'en-tête que vous voyez dans l'espace d'édition est généré par le même code que pour un visiteur, il n'existe donc aucun aperçu séparé susceptible de diverger.
Globale ou par page
Définissez un en-tête, une barre supérieure, un titre de page, une bannière d'accueil et un pied de page par défaut pour l'ensemble du site, puis modifiez chacun d'eux sur une page donnée depuis les réglages de cette page.
Responsive par conception
Les zones se réordonnent selon chaque point de rupture et peuvent être limitées à une catégorie d'appareil, ce qui vous permet de vérifier la mise en page mobile dans l'éditeur avant que quiconque ne la voie.
À propos du constructeur
Les autres réponses se trouvent dans la FAQ complète et dans la documentation.
Faut-il un second en-tête pour le mobile ?
Un seul en-tête Canvas couvre généralement aussi le mobile, car les zones se réordonnent selon chaque point de rupture et chacune peut être limitée à un type d'appareil. Un même enregistrement d'en-tête peut placer le logo au centre sur téléphone, masquer les coordonnées et replier le menu derrière un bouton. Créez un second enregistrement uniquement si vous voulez vraiment un design différent, et non pour corriger une mise en page.
Une page peut-elle utiliser un en-tête différent ?
Oui, chaque en-tête, barre supérieure, titre de page et pied de page Canvas dispose d'une valeur par défaut à l'échelle du site et d'une valeur propre à chaque page, si bien qu'une page d'atterrissage peut afficher un en-tête transparent et une barre supérieure avec le seul logo, tandis que le reste du site conserve les siens.
Un en-tête est-il une zone de widgets ou un menu ?
Un en-tête Canvas n'est ni l'un ni l'autre : c'est un enregistrement que vous modifiez dans l'éditeur de blocs, exactement comme une page. La navigation, le logo, la recherche, le panier et les boutons qu'il contient sont des blocs dotés de leurs propres panneaux de réglages.
Que se passe-t-il pour mon en-tête quand ma licence expire ?
Lorsqu'une licence Canvas expire, votre en-tête et le reste de votre site continuent de s'afficher exactement comme aujourd'hui. Ce qui est suspendu, c'est le service : les mises à jour, les importations de démos, les fonctionnalités IA et la modification des blocs premium sont interrompues jusqu'au renouvellement. Un délai de grâce de 14 jours s'applique si une vérification de licence ne parvient pas à joindre nos serveurs.
Puis-je encore utiliser l’Éditeur de site ?
Oui, Canvas repose sur de véritables modèles de blocs : les modèles et les parties de modèle restent là où WordPress les stocke, et un élément d'en-tête est placé dans le modèle par un bloc. Découvrez le fonctionnement de l'éditeur.
Créez votre prochain site web avec Canvas
Débutant, freelance ou agence, vous obtenez les mêmes blocs et les mêmes démos. Commencez avec un seul site et créez-en autant que nécessaire avec la même licence.