Comment ajouter un contenu pliable/extensible dans WordPress

Comment ajouter un contenu pliable/extensible dans WordPress

Avez-vous déjà parcouru une longue page web en vous efforçant de trouver l'information exacte dont vous avez besoin ? C'est frustrant, n'est-ce pas ? La solution réside dans le contenu pliable et extensible, qui est un moyen simple mais efficace d'organiser l'information.

Cette technique vous permet de présenter un contenu détaillé tout en conservant des pages claires et faciles à parcourir. Qu'il s'agisse de FAQ, de descriptions de produits ou d'articles de blog, les sections repliables améliorent la convivialité et l'engagement.

La bonne nouvelle ? Vous n'avez pas besoin de vous plonger dans le codage pour le mettre en œuvre. Avec WordPress, des outils comme le plugin Ultimate Blocks rendent les choses incroyablement simples. Ultimate Blocks, un plugin spécialement conçu pour les utilisateurs de Gutenberg, offre des fonctionnalités telles que le Bascule du contenu et Agrandir les blocs pour vous permettre de créer des sections interactives et repliables. 

Méthode 1 : Utilisation du plugin Ultimate Blocks

Étape 1 : Installer le plugin Ultimate Blocks

Naviguez dans votre tableau de bord WordPress, allez dans la section "Plugins" et cliquez sur "Ajouter nouveau". Type "Blocs ultimes" dans la barre de recherche, localisez le plugin dans les résultats, cliquez sur "Installer maintenant". et ensuite "Activer".

Installer le plugin Ultimate Blocks

Étape 2 : Ajouter le bloc de basculement du contenu

Ouvrez l'article ou la page où vous souhaitez ajouter un contenu pliable. Cliquez sur l'icône Icône "+" (ou "+") dans l'éditeur WordPress pour ajouter un nouveau bloc, recherchez "Content Toggle" et sélectionnez-le. 

Ajouter le bloc de basculement du contenu

Une fois le bloc ajouté, vous verrez le bloc de basculement en position, mais dans un format fermé. Cliquez sur la flèche pour le développer, placez le titre de votre contenu dans le champ "Titre du panneau et, par la suite, le contenu principal dans le champ "Contenu du panneau" boîte. 

Titre et contenu du site

Maintenant, si vous avez besoin de plus d'une section extensible ou repliable, cliquez sur le bouton + bouton au bas du bloc pour insérer une nouvelle bascule. De même, si vous ne voulez pas de bascule spécifique, cliquez sur le bouton x à la fin du bloc. 

Ajouter de nouveaux boutons

Étape 3 : Personnalisation du bloc de basculement du contenu

Une fois le bloc sélectionné, le panneau des paramètres du bloc apparaît à droite de votre tableau de bord. Vous y trouverez deux onglets distincts : Paramètres généraux et styles.

Dans le cadre de la Paramètres généraux tab, vous le pouvez :

  • Ajuster le Titre du panel pour une hiérarchie appropriée.
  • Définir l'état de basculement pour contrôler si les panneaux doivent être réduits ou ouverts lors du chargement de la page.
  • Activer Schéma de la FAQ pour améliorer la visibilité dans les résultats des moteurs de recherche.
  • Utilisation Contrôle réactif pour masquer ou afficher le bloc sur des appareils spécifiques.
  • Ajouter un Boîte de recherche pour faciliter la navigation dans les FAQ. Toutefois, cette fonctionnalité est limitée aux utilisateurs Pro. 
Paramètres généraux

Maintenant, si vous passez à l'option Onglet StylesVous pouvez ajuster les couleurs, activer les bordures, définir les styles et les positions des icônes de basculement et affiner le rembourrage et les marges.

Onglet Styles

Une fois satisfait, cliquez sur "Publier" ou "Mettre à jour" pour le mettre en ligne.

Démonstration finale

Méthode 2 : Utilisation du bloc Expand

Étape 1 : Ajouter le bloc Expand

Naviguez jusqu'à la page ou l'article dans lequel vous souhaitez que le contenu soit repliable/extensible. Cliquez à nouveau sur l'icône "+" pour ajouter un nouveau bloc, recherchez "Expand" et sélectionnez-le. 

Ajouter le bloc Expand

Étape 2 : Ajouter du contenu au bloc

Le bloc comprendra deux sections : l'une pour le contenu visible (affiché initialement) et l'autre pour le contenu caché (révélé lorsqu'on clique dessus). Ajoutez le contenu que vous souhaitez garder visible dans la première section, au-dessus de l'icône "Afficher plus". Placez le reste du contenu dans la section cachée sous le texte "Afficher plus" texte. 

Contenu visible et caché

Cliquez sur le bouton + signe sur chaque bloc, sélectionnez le bloc de votre choix et ajoutez ensuite du contenu aux blocs. Vous pouvez personnaliser le bloc "Afficher plus" et "Montrer moins" les textes pour qu'ils s'adaptent mieux à votre contenu ou à votre public. Il vous suffit de cliquer sur les textes par défaut et de les remplacer par les libellés de votre choix.

Ajouter du contenu et personnaliser les textes

Étape 3 : Personnaliser le bloc Expand

La version gratuite offre une personnalisation limitée, notamment des paramètres de défilement, un contrôle réactif et des ajustements de dimensions dans l'onglet Styles. Mais si vous passez à la version pro, vous pouvez choisir un effet de fondu pour le contenu minimisé (disponible dans les paramètres généraux). Vous pouvez également personnaliser le style, la couleur d'arrière-plan, la bordure et le rayon du bouton pour une apparence plus soignée.

Personnaliser le bloc

Lorsque vous êtes satisfait du résultat, cliquez sur "Publier" ou "Mettre à jour" pour enregistrer et afficher les modifications sur votre site.

Démonstration finale

Conclusion

L'objectif de cet article est de vous guider dans la création d'un contenu pliable et extensible dans WordPress, tout en conservant une mise en page propre et facile à naviguer. Les Ultimate Blocks vous permettent d'atteindre cet objectif sans avoir recours au codage et en toute simplicité, tant au niveau de l'utilisation que de la conception. Il est essentiel de comprendre les besoins de votre public, car cela vous aide à mettre en œuvre le contenu pliable là où il apporte le plus de valeur et à vous assurer que tout fonctionne bien pour une expérience de navigation optimale. Gardez à l'esprit que de petits changements comme ceux-ci peuvent transformer la façon dont les visiteurs interagissent avec votre site.



L'équipe Tableberg