Ajouter un séparateur de section Elementor avec motif (divider)

Un séparateur de section Elementor, aussi appelé Divider, est un motifs ou design entre deux sections d’une page. 

Il sert à faire des transitions originales entre deux partie d’une page Elementor et grandement améliorer le design de vos pages. 

Par exemple voici un séparateur de section Elementor (ou divider) en forme de vague : 

séparateur de sections elementor

Elementor dispose de toute une liste de motif de séparateur de sections. 

Voyons comment ajouter un motif entre deux sections (aussi appelé divider) pour marquer la séparation.

Sommaire

Créer un séparateur de section avec Elementor

Pour créer un séparateur de section Elementor il faut cliquer sur la section du dessus ou du dessous (dans l’exemple c’est celle du dessous) : 

Puis dans l’onglet Style > Forme de séparation :

Indiquer si vous souhaitez ajouter un séparateur de section Elementor vers le haut de la section ou le bas :
 

  • Type : choisir dans la liste de forme de séparation Elementor

     

  • Couleur : lui donner la même couleur que le fond de la seconde section (celle avec laquelle la section sur laquelle on travail fait une bordure)

     

  • Hauteur : On donne ensuite une hauteur à notre motif pour le rendre plus ou moins prononcé
separateur section gouttes elementor

Sur l’exemple ci-dessus, on a ajouté un séparateur de section Elementor, ou Divider, en forme de gouttes de peinture noire.

Inverser et symétriser la forme de séparation d’une section Elementor

Il y a ensuite deux réglages qui peuvent être fait sur la forme de séparation :

  1. Retournement 
  2. Inverser

 

Ces paramètres du séparateur de section Elementor vont changer le design de la forme de séparation et permettre un paramétrage plus fin. 

Retournement sur séparateur de section Elementor

Le retournement va réaliser une symétrie le long de l’axe vertical. 

Le motif de la gauche de l’écran passe à droite et inversement : 

separateur section gouttes elementor

Inverser le séparateur de section Elementor

Inverser va réaliser une symétrie le long de l’axe horizontal.

Ce qui est en bas passe en haut et inversement donnant l’impression que le motif sort de la section : 

separateur section gouttes elementor

Il existe tout une liste de forme de séparation Elementor qui permettent de donner de beaux effets de transitions entre vos sections. 

Ils peuvent être cependant lourd pour l’œil donc n’en abusez pas. 

Utilisez une couleur de fond de section unie pour un séparateur de section :

Un séparateur de section Elementor ne fonctionnent pas avec des images de fond de section.

Veuillez donc a utiliser uniquement des couleurs unies de fond de section, lorsque vous souhaitez ajouter un motif de séparation entre vos deux sections.

Partagez le guide Elementor