Formation

Mise en page des blocs

La mise en page d’un bloc est un élément clé de la construction d’une page  Grâce à la mise en page, vous pourrez plus facilement séduire vos internautes.

Ici, vous verrez comment mettre en page un bloc de façon optimale.

La mise en page de bloc

Après avoir ajouté un de vos bloc, vous pourrez apercevoir un menu de « Mise en page », situé à gauche de votre fenêtre de configuration de bloc.

En cliquant sur ce menu, vous arriverez directement sur une fenêtre de configuration disposant de différents menus déroulants :

  • Template
  • Options avancées
  • Effet visuels

Le menu Template

Choisir son template n’est pas chose aisée.

Tout dépend du style que vous souhaitez donner à votre contenu, et de la cohérence à apporter au visuel créé.

Il faut également que cette mise en page corresponde à la mise en page de section (Voir tutoriel section).

Le menu Options avancées

Après avoir choisi son template de mise en page, il est essentiel d’apporter un oeil sur les options avancées.

Il est possible de régler l’affichage verticale du bloc selon trois critères (en haut, au milieu, en bas). Ce paramètre est utile pour par exemple équilibrer du contenu photo et textuel divisé en deux blocs. Ce paramètre est présent pour la mise en page d’un bloc texte.

Vous pouvez aussi, pour un bloc texte, limiter la hauteur du bloc (souvent textuel) concernant le bouton « Afficher Plus ». Un texte trop long ne sera pas forcément efficace. Optez donc pour cette solution.

Aussi, vous pouvez élargir les marges intérieures de manière « Grande » ou « Très Grande« . Ce paramètre est présent pour la mise en page d’un bloc texte.

 

Capture Decran 2024 07 01 A 17.03.46 1Capture Decran 2024 07 01 A 17.03.46 1
©Capture Decran 2024 07 01 A 17.03.46 1

Pour apporter plus de style, vous pouvez utiliser une couleur de fond (en corrélation avec votre intégration technique réalisée par nos experts), de même que les bordures. Vous pourrez choisir d’opacifier la couleur de fond également selon plusieurs pourcentages.

Au besoin, vous pourrez ajouter une image de fond et régler également son opacité.

Pour un bloc Galerie de médias, il sera possible de retirer les marges autour des photos (utile pour une image en bandeau horizontal : voir Tutoriel : Galerie de médias)

Capture Decran 2024 07 01 A 17.00.03Capture Decran 2024 07 01 A 17.00.03
©Capture Decran 2024 07 01 A 17.00.03

Le menu Effets visuels

 

Après avoir choisi son template de mise en page, et configuré ses options avancées de mise en page, le dernier point à visualiser est le menu d’effets visuels.

Ce menu sera utile pour réaliser un chevauchement de bloc à bloc. Cela sera utile si vous souhaitez par exemple faire superposer un bloc texte sur un bloc galerie de médias. (voir l’exemple ci dessous).

Pour cela cliquez sur le bouton bleu en bas à droite « Ajouter une transformation ». Vigilance ! Vous pourrez ajouter qu’une seule transformation à un bloc.

Choisissez le type de transformation et le décalage (en px). Plus la valeur chiffrée du décalage (en Px) est élevée et plus le décalage sera prononcé.

Choisissez enfin la position du bloc. Il pourra être en position « devant », « milieu », ou « derrière ».

Mise en pratique de chevauchement

Ici, il s’agit d’un chevauchement du bloc texte :

  • Transformation : décalage vers la gauche – 90 px
  • Position : devant
Fermer