Aller au contenu

Zones et mises en page

Une zone est une partie d’un écran avec son propre contenu. En divisant un écran en zones, vous pouvez par exemple afficher un grand bien immobilier avec, à côté, un bandeau défilant d’horaires d’ouverture ou une rotation sans fin d’images.

Quand utiliser des zones

Un seul élément de contenu par écran ? Alors vous n’avez pas besoin de zones. Choisissez un modèle fullscreen et c’est terminé.

Utilisez des zones quand vous voulez afficher plusieurs choses en même temps :

  • Le bien en grand à gauche, les coordonnées à droite
  • La carte du menu en haut, la liste des prix en bas
  • Une vidéo en direct avec, à côté, un flux de réseaux sociaux

Mises en page

Quand vous créez un modèle, vous choisissez un type de mise en page :

  • Fullscreen : une zone qui remplit tout l’écran
  • Split-screen : deux zones, une grande à gauche et une étroite à droite (ou l’inverse)
  • Elegant-stacked : une pile verticale de blocs, adaptée au portrait
  • Gallery-grid : plusieurs biens côte à côte dans une grille

Chaque zone affiche son contenu de façon indépendante. Une zone peut afficher un bien précis, une autre peut être une rotation de cinq autres biens.

Étapes

  1. Allez dans Design › Mises en page et cliquez sur Nouvelle mise en page. Si vous êtes dans Mes mises en page, choisissez Commencer avec une mise en page vierge. Dans la Bibliothèque, vous passez directement à l’étape suivante.
  2. Choisissez un canevas vide ou l’un des modèles de base. L’éditeur s’ouvre avec votre nouvelle mise en page.
  3. Définissez pour chaque zone les données à afficher, par exemple le détail d’un bien dans la zone 1 et une galerie d’images dans la zone 2.
  4. Réglez une orientation : paysage, portrait ou les deux.
  5. Enregistrez le modèle et utilisez-le dans une playlist.

Portrait ou paysage

Un écran se comporte selon son orientation physique réelle. Vous avez un écran vertical en vitrine ? Choisissez alors un modèle marqué portrait ou les deux. La mise en page s’organise ainsi correctement.

Certaines mises en page ne fonctionnent qu’en paysage (comme un split-screen large) ou qu’en portrait (comme elegant-stacked). La bibliothèque de modèles indique pour chaque modèle les orientations prises en charge.

Si cela ne fonctionne pas

Une zone reste vide

Ouvrez l’éditeur de modèle et vérifiez que la zone est liée à une source de données. Pas de données liées → pas de contenu.

Le texte est coupé dans une zone

La taille du texte s’adapte à la largeur de la zone. Si le texte ne tient pas, réduisez la taille du texte dans le modèle ou élargissez la zone.

L'écran n'est pas dans la bonne orientation

Assurez-vous que le modèle correspond à la façon dont l’écran est réellement accroché. L’écran est tourné mais le modèle est en paysage ? Faites pivoter le modèle ou l’écran.

Cette page vous a-t-elle aidé ?