L'en-tête rétractable est une version plus petite de l'en-tête du site. Il permet de conserver les informations de navigation importantes sans distraire les utilisateurs lorsqu'ils font défiler la page et sans occuper trop d'espace. Il agit comme un en-tête fixe, mais condense la taille des logos et autres widgets de l'en-tête. Il est particulièrement utile pour les sites dotés d'en-têtes volumineux et conçus pour un défilement long.
Note :
L'en-tête rétractable est disponible sur ordinateur et uniquement sur tablette lorsque la disposition d'en-tête de la barre supérieure est utilisée.
Une fois que l'utilisateur fait défiler la hauteur de l'en-tête, l'en-tête rétrécit.
- Si les colonnes contiennent un widget visible, le widget est centré verticalement à l'intérieur de la colonne et le remplissage et les marges haut/bas sont définis à 0.
- Si les colonnes contiennent plus d'un widget visible, les widgets ne sont pas alignés verticalement et le remplissage et les marges haut/bas sont définis à 10 px.
- S'il y a des lignes vides avec des colonnes, les colonnes occupent tout l'espace de la ligne.
- Pour gérer les modèles avec une valeur de hauteur minimale dans l'en-tête, la hauteur minimale de l'en-tête est définie sur auto.
Pour modifier la conception d’un en-tête rétractable :
- Passez la souris sur l'en-tête, cliquez sur En-tête, puis cliquez sur Modifier la conception.
- Dans l'onglet En-tête rétractable, cliquez sur le bouton Activer la réduction de l'en-tête pour activer la bascule. Vous disposez des options suivantes :
- Afficher uniquement la ligne de navigation : n'afficher que la ligne contenant la navigation lorsque l'en-tête se rétrécit. Cette fonctionnalité n'est applicable que si l'en-tête comporte plusieurs lignes.
- Couleur d'arrière-plan : modifiez la couleur d'arrière-plan de l'en-tête rétractable. Notez que la couleur d'arrière-plan de la ligne remplace celle de l'en-tête rétractable.
- Plus de couleurs d'en-tête au défilement : spécifiez les couleurs du texte, du lien sélectionné et du survol, des icônes, du texte des boutons, etc.
- Taille du logo : modifiez la taille à laquelle le logo ou l'image rétrécit lorsque l'en-tête rétrécit (valeur par défaut : 66 %).
- Changer le logo lors du défilement : sélectionnez un logo à afficher lors du défilement.
- Espacement des en-têtes : ajustez le remplissage supérieur et inférieur de l'en-tête rétractable. Vous pouvez modifier l'espacement des en-têtes pour chaque appareil.
Lorsque l'en-tête rétractable est activé :
- Le site défile vers le bas afin d'afficher le logo et les effets de l'en-tête rétrécissant.
- La fonctionnalité d’en-tête collant est automatiquement appliquée à l’en-tête.
- L'espacement de l'en-tête modifie le rembourrage haut/bas et la marge à 0.
Note :
Cela change le rembourrage et la marge de l'en-tête, et non des lignes à l'intérieur de l'en-tête.