Le Héros est une grande bannière avec une image ou une vidéo derrière votre texte et vos boutons. Il se trouve sur votre page d'accueil et c'est souvent la première chose que voient les clients.
Ajouter un héros
- Ouvrez le constructeur et choisissez Page d'accueil dans l'onglet Pages.
- Dans l'onglet Sections, cliquez sur Ajouter une nouvelle section et choisissez Héros dans le groupe Contenu.
- Choisissez vos médias, écrivez votre texte et cliquez sur Publier.
Le héros n'est proposé que sur la page d'accueil, et vous pouvez en ajouter un par page. Pour le déplacer, le copier ou le masquer, voir Sections et blocs
Médias et hauteur
- Mode : Simple affiche une image ou une vidéo. Divisé en affiche deux, réglées dans Média 1 et Média 2. Elles sont côte à côte quand la Direction du contenu est Vertical, et l'une au-dessus de l'autre quand elle est Horizontal. Sur téléphone, les deux sont toujours empilées.
- Média 1 et Média 2 : une image ou une vidéo de votre médiathèque. Une vidéo se lit sans le son, en boucle, comme un fond animé.
- Hauteur : Petit, Moyen, Grand, Plein écran (remplit l'écran), Image (suit la forme de votre première image, pour que rien ne soit coupé) ou Personnalisé. Avec Personnalisé, Hauteur personnalisée règle la hauteur en proportion de la hauteur de l'écran. Les nouveaux héros commencent sur Image.
Texte et boutons par-dessus
Sélectionnez le héros et cliquez sur Ajouter un nouveau bloc pour ajouter du contenu sur les médias : jusqu'à 2 blocs Texte, 2 Bouton, 2 Groupe et 2 Séparateur. Leurs propres réglages se trouvent dans Blocs Groupe, Texte, Bouton et Séparateur : comment fonctionnent les réglages des composants de mise en page ?
Sous Disposition, vous placez ce contenu :
- Direction : Vertical empile les blocs, Horizontal les place côte à côte. Avec Horizontal, Empiler verticalement sur mobile les empile sur téléphone.
- Position et Alignement : déplacent le contenu vers le haut ou le bas et vers la gauche ou la droite, par exemple en bas à gauche ou au centre. Espace entre (space between) écarte les blocs.
- Largeur du contenu : Page garde le contenu dans la largeur de votre page, Complet le laisse aller jusqu'aux bords de l'écran. Les médias remplissent toujours toute la largeur.
Espacement (sous Espacement) règle l'espace entre les blocs, et Marge intérieure l'espace autour d'eux.
Couleurs et voile
- Schéma de couleurs : les couleurs du texte et des boutons du héros. Voir Schémas de couleurs.
- Superposition du média : ajoute une couche de couleur sur les médias pour que votre texte soit plus lisible. Réglez ensuite Couleur de superposition et Style de superposition : Solide couvre les médias de façon uniforme, Dégradé fait s'estomper la couleur. Direction du dégradé (Haut ou Bas) définit le sens du fondu.
L'onglet CSS personnalisé vous permet d'ajouter votre propre CSS à ce héros uniquement.
Tâches courantes
- L'en-tête par-dessus le héros : activez En-tête transparent dans les réglages de l'en-tête. Cela ne fonctionne que si le héros est juste sous l'en-tête. Voir Réglages de l'en-tête.
- Titre et bouton centrés : Direction Vertical, puis Position et Alignement sur Centre.
- Texte blanc sur une photo claire : activez Superposition du média avec une Couleur de superposition foncée et le style Dégradé.
Bon à savoir
- Si une vidéo du héros ne bouge pas, vérifiez Lecture automatique des vidéos dans l'onglet Automatisations des Réglages. Quand elle est désactivée, les vidéos d'arrière-plan restent immobiles. Voir Réglages des automatisations.
- Si la taille de votre première image n'est pas connue, la hauteur Image utilise Moyen à la place.
- Besoin d'une bannière sur une autre page ? Le héros est réservé à la page d'accueil, mais la section Image fonctionne sur toutes les pages. Voir Sections texte, image et séparateur.