Quand une lignée est créée en plein écran, elle s’adapte automatiquement à la hauteur de la fenêtre du navigateur et occupe donc tout l’écran du visiteur, peu importe la taille de son écran. Utilisez des lignes en plein écran pour fournir une expérience de navigation plus fluide et plus engageante avec une belle apparence sur n’importe quel écran d’ordinateur portable ou de bureau.
Les lignes en plein écran s’appliquent uniquement aux fenêtres d’ordinateur
Quand une ligne est paramétrée en plein écran, la hauteur de la ligne s’ajuste automatiquement à la hauteur de l’écran sur les fenêtres d’ordinateur uniquement.
L’option plein écran ne s’applique pas aux mobiles et aux tablettes car les navigateurs mobiles comme Safari et Chrome ajoutent parfois une barre d’adresse en haut de l’écran. Quand la barre d’adresse est visible, le bas de l’écran est "coupé" car les navigateurs mobiles définissent le plein écrancomme la hauteur de l’écran sans la barre d’adresse. Par conséquent, la ligne en plein écran se retrouve poussée vers le bas et une partie devient invisible à l’écran, empêchant le but premier d’avoir des lignes en plein écran.
Activer les lignes en plein écran
Pour paramétrer une ligne en plein écran, cliquez sur l’étiquette de ligne pour ouvrir le menu Paramètres de ligne. Allez dans Paramètres > Général et cochez Ligne en plein écran.
Si le contenu de votre ligne dépasse la hauteur du navigateur du visiteur
Si votre ligne contient beaucoup de contenu - par exemple plusieurs images empilées les unes sur les autres, des formulaires de contact, de longs paragraphes, etc. – sa hauteur peut dépasser celle de la fenêtre du navigateur du visiteur. Dans ce cas, cocher Ligne en plein écrann’aura aucun effet car la ligne conservera sa hauteur afin d’afficher tout le contenu qu’elle contient.
Aligner verticalement le contenu
Une fois que vous avez coché Ligne en plein écran, vous verrez une option pour aligner verticalement tout contenu au sein de cette ligne soit en haut, au centre ou en bas de la ligne. Cela aligne toutes les colonnes (et leur contenu) au sein de la ligne.
Exemple d’alignement en haut
Exemple d’alignement au centre
Exemple d’alignement en bas
Pourquoi mon contenu ne s’aligne-t-il pas correctement ?
Même si vous avez activé Ligne en plein écran, tout remplissage existant sur la ligne sera quand même respecté. Par exemple, si vous avez aligné votre contenu au centre au sein de la ligne en plein écran mais que vous avez paramétré un remplissage en bas de 200px, la ligne n’aura pas l’air d’être centrée (techniquement, elle seracentrée + remplissage de 200px ajouté en bas).
Pour éviter cela, assurez-vous de retirer tout remplissage existant sur votre ligne et la marge sur les colonnes au sein de la ligne, ou assurez-vous que les valeurs de remplissage/marge soient identiques en haut et en bas.
Curseurs de Lignes en Plein écran
Un Curseur de Lignes vous permet de créer un ensemble de lignes que les visiteurs peuvent faire défiler manuellement – ou vous pouvez paramétrer leur transition automatique à intervalles spécifiques. Les Curseurs de Lignes peuvent également être paramétrés pour apparaître en plein écran en cliquant sur l’étiquette Curseur de Lignes pour ouvrir le menu Paramètres du Curseur de Lignes. Allez dans Paramètres et cochez Ligne en plein écran.
Si vous n’avez pas activé les lignes en plein écran dans le Curseur de Lignes mais qu’une ou plusieurs lignes dans le curseur sont paramétrées en plein écran, toutes les diapositives dans le Curseur de Lignes apparaîtront en plein écran.
Ligne en plein écran sous l’en-tête
Une touche graphique particulièrement jolie peut être obtenue en combinant l’option Ligne en plein écranavec le paramètre Placer la ligne sous l’en-tête sur la première ligne d’une page. Ainsi, votre en-tête se mélangera au style global de votre site internet, tout en assurant que la première ligne remplisse toute la hauteur de la fenêtre du navigateur du visiteur.