Elementor est un constructeur de page sur WordPress qui est largement plébiscité. Pourtant, il n’est pas toujours facile à prendre en main lorsqu’on débute. Comment ne pas mettre d’espaces entre des sections ? Comment styliser des widgets ? Bref, on peut souhaiter configurer des éléments simples et parfois chercher un long moment avant de trouver comment faire.
Parmi les subtilités pas toujours faciles à trouver, il y a la question courante qui est de comment réussir à mettre une section en pleine largeur. Pleine largeur fréquemment nommée « full width » en anglais. Alors comment faire pour afficher une section en full width sur une page avec Elementor ?
Découvrons comment faire !
Mettre une section Elementor en pleine largeur sur WordPress
Pour passer une section elementor wordpress en pleine largeur, il y a plusieurs façons de procéder.
Section elementor en pleine largeur avec champ largeur de contenu
Pour commencer, ouvrez votre page Elementor. Ensuite placez votre curseur sur la section que vous souhaiteriez mettre en pleine largeur en frontal.
La bonne nouvelle c’est que quand on se positionne avec le curseur sur une section Elementor d’une page, à gauche, c’est le bon espace qui s’ouvre. Car en l’occurrence comme on peut le distinguer sur la capture d’écran qui suit, c’est la Mise en page « Modifier Section » qui est affichée :
Et mieux encore, le champ à modifier pour passer d’une section encadrée à une section Full width Elementor, est le premier.
Aussi, pour passer une section Elementor encadrée à pleine largeur, vous l’aurez compris, on changera l’item « Encadré » en optant pour « Pleine largeur ». Cela masquera d’ailleurs le second item permettant de choisir la dimension de la section en pixels quand elle est encadrée.
Section elementor pleine largeur avec Étirer la section (JS)
Une autre façon de passer une section en pleine largeur est proposée sur la même vue que précédemment. Il suffit simplement de descendre un peu sur cet affichage jusqu’à voir ce qui suit :
Ici, vous pouvez donc opter pour une autre façon de passer une section Elementor en pleine largeur. Dans ce cas, il faudra simplement cliquer sur le bouton gris dans la capture d’écran ci-dessus afin de le passer sur Oui.
C’est tout et c’est déjà pas mal !
Pourquoi passer une section en pleine largeur avec Elementor ?
Passer une section en pleine largeur avec Elementor permet d’afficher un élément particulier d’une page ou article WordPress sur toute la largeur de l’écran. Que ce soit pour Desktop, tablette ou mobile. En général un affichage en pleine largeur, à savoir le fameux full width est utilisé pour mettre en évidence un élément visuel. Cela peut être un titre h1 ou H2. Cela peut être une sorte de bannière avec ou sans bouton pour appeler à l’action, façon CTA « Call to action ».
Il est également possible d’opter pour cet affichage simplement par goût. Parce que le reste de la page sera également en pleine largeur. En effet, on peut décider de mettre certaines sections Elementor en pleine largeur et d’autres non. Tout comme on pourra mettre toute une page en pleine largeur ou non.
Vous aurez sans doute remarqué combien Elementor est profond et complet même en version gratuite. Ce qui peut parfois dissuader de l’utiliser. Car utiliser Elementor peut réclamer du temps pour l’appréhender et savoir l’utiliser pour obtenir les affichages qu’on souhaite.
Aussi, il ne faut pas hésiter à chercher sur le web comment effectuer certaines actions. Ou prendre le temps de creuser la question via le plugin si populaire pour construire des pages WordPress. Comparé ou Themify ou encore à WP Bakery, il est tout à fait accessible.
