Comment utiliser Page Builder Sandwich

Comment utiliser Page Builder Sandwich

Page Builder Sandwich n’est pas un constructeur de page comme les autres, il est simple et facile à utiliser.

Vous pouvez regarder la vidéo ci-dessous pour un aperçu rapide.

Où se trouve l’éditeur ?

Tout d’abord, créez une nouvelle page, un nouvel article ou un CPT. Ensuite, consultez votre nouvel article ou n’importe quel article existant sur votre site public (frontend). PBS fonctionne à 100 % en frontend, vous n’aurez pas besoin de bricoler dans le panneau d’administration (backend).

Il devrait y avoir un bouton « Page Builder Sandwich » en haut de votre page (dans votre barre d’administration), cliquez dessus pour commencer l’édition. Vous devriez voir la zone de mise en forme du texte apparaître depuis le haut, et le panneau d’ajout d’éléments apparaître sur le côté. La zone de contenu de votre thème est désormais votre éditeur !

Vous ne pouvez modifier que des pages individuelles avec PBS. Vous ne pouvez pas modifier une liste d’articles de blog ou une page 404, car celles-ci sont générées par votre thème. Les articles, les pages et les types de publication personnalisés (CPT) fonctionnent parfaitement.

Modifier votre contenu

C’est maintenant que la magie opère… une fois que vous êtes sur le site public et dans l’éditeur, cliquez sur n’importe quel texte de votre contenu ou cliquez dans votre zone de contenu et commencez à taper ! Contrairement à d’autres constructeurs de page, PBS vous permet de modifier directement le contenu sans avoir à passer par des fenêtres contextuelles.

Mettre en forme votre contenu / Rendre les choses jolies

dcb1615380 file 9OtagMFi2c

Pendant l’édition, la zone située en haut s’appelle la barre de mise en forme du texte. Cette barre contient tous les outils de mise en forme que vous utiliserez pour styliser le texte, tels que : les couleurs, le gras, l’italique, les alignements, l’ajout de liens, les puces et bien plus encore. Survolez chaque bouton pour découvrir la fonction de l’outil.

Ajouter des éléments

ecfd309bb2 file yDqiNEv73s

Survolez avec votre souris le bouton Ajouter des éléments en haut à gauche de l’écran pour afficher le panneau d’ajout d’éléments. Vous pouvez également simplement déplacer votre souris vers le côté gauche de l’écran pour le faire apparaître.

Pour insérer un élément, maintenez le clic de votre souris dessus, puis faites-le glisser dans votre zone de contenu. La zone où l’élément sera placé s’affichera en surbrillance. Relâchez le bouton de votre souris pour placer l’élément.

Styliser et modifier les éléments

Survolez avec votre souris n’importe quel élément présent dans votre contenu pour faire apparaître des contours et des barres d’outils au-dessus d’eux.

0046713cb7 file YU6nUCc7jYVous pouvez survoler avec votre souris les bords des contours pour augmenter ou réduire les marges entre les éléments.

Vous pouvez également cliquer sur un bouton de la barre d’outils pour effectuer des actions rapides sur l’élément. En cliquant sur l’icône d’engrenage de la barre d’outils, vous ouvrirez l’inspecteur de propriétés qui contient plus d’options.

5c220b4ac9 file Odem5RLPok

L’inspecteur de propriétés

3e7e48b754 file INy1v5z9Oz

L’inspecteur de propriétés vous donne plus de contrôle sur l’apparence de vos éléments. Vous pouvez ajouter de nombreuses choses comme des ombres, des animations, modifier les couleurs de la carte, le rayon des bordures, et bien plus encore.

Vous pouvez également accéder aux propriétés des éléments parents. Par exemple, si vous placez une image dans une colonne et ouvrez l’inspecteur de propriétés, vous pouvez alors accéder aux propriétés de l’image, de la colonne dans laquelle elle se trouve et de la ligne qui contient la colonne.

L’inspecteur de propriétés contient de nombreux réglages différents pour différents éléments, alors assurez-vous de tous les explorer.

Utiliser les codes courts (shortcodes)

Page Builder Sandwich affiche les véritables shortcodes sur le frontend, et vous pouvez également les modifier facilement !

edee730340 file TqfWB9yv3y

Si vous avez mémorisé vos shortcodes, vous pouvez les insérer en les tapant directement dans votre contenu. Mais si vous ne les avez pas tous mémorisés (qui fait ça ?), l’inspecteur répertorie tous les shortcodes disponibles sur votre site. Faites glisser un bouton Shortcode depuis l’inspecteur vers votre zone de contenu et trouvez celui que vous souhaitez insérer, puis cliquez dessus pour l’insérer.

Les shortcodes sont convertis en contenu réel sur le frontend. Pour les modifier, vous pouvez les sélectionner et examiner leurs attributs dans l’inspecteur. Ou, pour plus de contrôle, vous pouvez double-cliquer sur le shortcode pour le modifier sous sa forme brute. Après avoir effectué vos modifications, votre shortcode se mettra à jour pour refléter les changements.

Réorganiser votre contenu

Vous pouvez cliquer et glisser n’importe quoi et le déplacer n’importe où avec PBS. Lorsque vous faites glisser un élément, déplacez-le au-dessus d’un autre élément de la page, vous pouvez le déplacer au-dessus ou en dessous de tout autre contenu.

Enregistrer votre travail

ae0cf6f413 file

Une fois que vous êtes satisfait de votre mise en page, cliquez simplement sur le bouton d’enregistrement en haut à gauche de votre page. C’est tout !