- M\u00e9thode 1 : Utilisation du plugin Ultimate Blocks<\/a>
- \u00c9tape 1 : Installer le plugin Ultimate Blocks<\/a><\/li>
- \u00c9tape 2 : Ajouter le bloc de basculement du contenu<\/a><\/li>
- \u00c9tape 3 : Personnalisation du bloc de basculement du contenu<\/a><\/li><\/ul><\/li>
- M\u00e9thode 2 : Utilisation du bloc Expand<\/a>
- \u00c9tape 1 : Ajouter le bloc Expand<\/a><\/li>
- \u00c9tape 2 : Ajouter du contenu au bloc<\/a><\/li>
- \u00c9tape 3 : Personnaliser le bloc Expand<\/a><\/li><\/ul><\/li><\/ul>\n\t\t\t<\/div>\n\t\t<\/div><\/div>\n\n
<\/div><\/div><\/div>\n\n\nM\u00e9thode 1 : Utilisation du plugin Ultimate Blocks<\/strong><\/h2>\n\n\n\n
\u00c9tape 1 : Installer le plugin Ultimate Blocks<\/strong><\/h3>\n\n\n\n
Naviguez dans votre tableau de bord WordPress, allez dans la section \"Plugins\"<\/strong> et cliquez sur \"Ajouter nouveau\".<\/strong> Type \"Blocs ultimes\"<\/strong> dans la barre de recherche, localisez le plugin dans les r\u00e9sultats, cliquez sur \"Installer maintenant\".<\/strong> et ensuite \"Activer\".<\/strong>
<\/p>\n\n\n\n![\"Installer](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/1-5-1024x613.png\")
<\/figure>\n\n\n\n\u00c9tape 2 : Ajouter le bloc de basculement du contenu<\/strong><\/h3>\n\n\n\n
Ouvrez l'article ou la page o\u00f9 vous souhaitez ajouter un contenu pliable. Cliquez sur l'ic\u00f4ne Ic\u00f4ne \"+\" (ou \"+\")<\/strong> dans l'\u00e9diteur WordPress pour ajouter un nouveau bloc, recherchez \"Content Toggle\" et s\u00e9lectionnez-le. <\/p>\n\n\n\n
![\"Ajouter](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/1.2-1024x425.png\")
<\/figure>\n\n\n\nUne fois le bloc ajout\u00e9, vous verrez le bloc de basculement en position, mais dans un format ferm\u00e9. Cliquez sur la fl\u00e8che pour le d\u00e9velopper, placez le titre de votre contenu dans le champ \"Titre du panneau<\/strong> et, par la suite, le contenu principal dans le champ \"Contenu du panneau\"<\/strong> bo\u00eete. <\/p>\n\n\n\n
![\"Titre](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/2.2-2-1024x450.png\")
<\/figure>\n\n\n\nMaintenant, si vous avez besoin de plus d'une section extensible ou repliable, cliquez sur le bouton + bouton<\/strong> au bas du bloc pour ins\u00e9rer une nouvelle bascule. De m\u00eame, si vous ne voulez pas de bascule sp\u00e9cifique, cliquez sur le bouton x \u00e0 la fin du bloc. <\/p>\n\n\n\n
![\"Ajouter](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/2.3-1024x423.png\")
<\/figure>\n\n\n\n\u00c9tape 3 : Personnalisation du bloc de basculement du contenu<\/strong><\/h3>\n\n\n\n
Une fois le bloc s\u00e9lectionn\u00e9, le panneau des param\u00e8tres du bloc appara\u00eet \u00e0 droite de votre tableau de bord. Vous y trouverez deux onglets distincts : Param\u00e8tres g\u00e9n\u00e9raux et styles.<\/strong><\/p>\n\n\n\n
Dans le cadre de la Param\u00e8tres g\u00e9n\u00e9raux<\/strong> tab, vous le pouvez :<\/p>\n\n\n\n
- \n
- Ajuster le Titre du panel<\/strong> pour une hi\u00e9rarchie appropri\u00e9e.<\/li>\n\n\n\n
- D\u00e9finir l'\u00e9tat de basculement pour contr\u00f4ler si les panneaux doivent \u00eatre r\u00e9duits ou ouverts lors du chargement de la page.<\/li>\n\n\n\n
- Activer Sch\u00e9ma de la FAQ<\/strong> pour am\u00e9liorer la visibilit\u00e9 dans les r\u00e9sultats des moteurs de recherche.<\/li>\n\n\n\n
- Utilisation Contr\u00f4le r\u00e9actif<\/strong> pour masquer ou afficher le bloc sur des appareils sp\u00e9cifiques.<\/li>\n\n\n\n
- Ajouter un Bo\u00eete de recherche<\/strong> pour faciliter la navigation dans les FAQ. Toutefois, cette fonctionnalit\u00e9 est limit\u00e9e aux utilisateurs Pro.\u00a0<\/li>\n<\/ul>\n\n\n\n
![\"Param\u00e8tres](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/3.1-3-1024x519.png\")
<\/figure>\n\n\n\nMaintenant, si vous passez \u00e0 l'option Onglet Styles<\/strong>Vous pouvez ajuster les couleurs, activer les bordures, d\u00e9finir les styles et les positions des ic\u00f4nes de basculement et affiner le rembourrage et les marges.<\/p>\n\n\n\n
![\"Onglet](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/3.2-2-1024x738.png\")
<\/figure>\n\n\n\nUne fois satisfait, cliquez sur \"Publier\" ou \"Mettre \u00e0 jour\" pour le mettre en ligne.<\/p>\n\n\n\n
![\"D\u00e9monstration](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/toggledemo-1.gif\")
<\/figure>\n\n\n<\/div><\/div><\/div>\n\n\nM\u00e9thode 2 : Utilisation du bloc Expand<\/strong><\/h2>\n\n\n\n
\u00c9tape 1 : Ajouter le bloc Expand<\/strong><\/h3>\n\n\n\n
Naviguez jusqu'\u00e0 la page ou l'article dans lequel vous souhaitez que le contenu soit repliable\/extensible. Cliquez \u00e0 nouveau sur l'ic\u00f4ne \"+\" pour ajouter un nouveau bloc, recherchez \"Expand\" et s\u00e9lectionnez-le.\u00a0<\/p>\n\n\n\n
![\"Ajouter](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/2.1.1-1024x444.png\")
<\/figure>\n\n\n\n\u00c9tape 2 : Ajouter du contenu au bloc<\/strong><\/h3>\n\n\n\n
Le bloc comprendra deux sections : l'une pour le contenu visible (affich\u00e9 initialement) et l'autre pour le contenu cach\u00e9 (r\u00e9v\u00e9l\u00e9 lorsqu'on clique dessus). Ajoutez le contenu que vous souhaitez garder visible dans la premi\u00e8re section, au-dessus de l'ic\u00f4ne \"Afficher plus<\/strong>\". Placez le reste du contenu dans la section cach\u00e9e sous le texte \"Afficher plus<\/strong>\" texte. <\/p>\n\n\n\n
![\"Contenu](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/2.2.2-1024x468.png\")
<\/figure>\n\n\n\nCliquez sur le bouton + signe<\/strong> sur chaque bloc, s\u00e9lectionnez le bloc de votre choix et ajoutez ensuite du contenu aux blocs. Vous pouvez personnaliser le bloc \"Afficher plus<\/strong>\" et \"Montrer moins\"<\/strong> les textes pour qu'ils s'adaptent mieux \u00e0 votre contenu ou \u00e0 votre public. Il vous suffit de cliquer sur les textes par d\u00e9faut et de les remplacer par les libell\u00e9s de votre choix.<\/p>\n\n\n\n
![\"Ajouter](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/2.1.3-1024x472.png\")
<\/figure>\n\n\n\n\u00c9tape 3 : Personnaliser le bloc Expand<\/strong><\/h3>\n\n\n\n
La version gratuite offre une personnalisation limit\u00e9e, notamment des param\u00e8tres de d\u00e9filement, un contr\u00f4le r\u00e9actif et des ajustements de dimensions dans l'onglet Styles. Mais si vous passez \u00e0 la version pro, vous pouvez choisir un effet de fondu pour le contenu minimis\u00e9 (disponible dans les param\u00e8tres g\u00e9n\u00e9raux). Vous pouvez \u00e9galement personnaliser le style, la couleur d'arri\u00e8re-plan, la bordure et le rayon du bouton pour une apparence plus soign\u00e9e.<\/p>\n\n\n\n
\n![\"\"](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/2.3.1-1.png\")
<\/figure>\n\n\n\n![\"Personnaliser](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/2.3.2-1.png\")
<\/figure>\n<\/div>\n\n\n\nLorsque vous \u00eates satisfait du r\u00e9sultat, cliquez sur \"Publier\" ou \"Mettre \u00e0 jour\" pour enregistrer et afficher les modifications sur votre site.<\/p>\n\n\n\n
![\"D\u00e9monstration](\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/expanddemo-1-1.gif\")
<\/figure>\n\n\n\nConclusion<\/strong><\/h4>\n\n\n\n
L'objectif de cet article est de vous guider dans la cr\u00e9ation d'un contenu pliable et extensible dans WordPress, tout en conservant une mise en page propre et facile \u00e0 naviguer. Les Ultimate Blocks vous permettent d'atteindre cet objectif sans avoir recours au codage et en toute simplicit\u00e9, tant au niveau de l'utilisation que de la conception. Il est essentiel de comprendre les besoins de votre public, car cela vous aide \u00e0 mettre en \u0153uvre le contenu pliable l\u00e0 o\u00f9 il apporte le plus de valeur et \u00e0 vous assurer que tout fonctionne bien pour une exp\u00e9rience de navigation optimale. Gardez \u00e0 l'esprit que de petits changements comme ceux-ci peuvent transformer la fa\u00e7on dont les visiteurs interagissent avec votre site.<\/p>","protected":false},"excerpt":{"rendered":"
Have you ever scrolled through a lengthy webpage, struggling to pinpoint the exact information you need? It\u2019s frustrating, isn\u2019t it? The solution lies in collapsible and expandable content, which is a simple yet effective way to organize information. This technique lets you present detailed content while keeping your pages clean and easy to navigate. Whether […]<\/p>\n","protected":false},"author":9,"featured_media":5045,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","footnotes":""},"categories":[7],"tags":[],"class_list":["post-5018","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-how-to"],"featured_image_src":"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/11\/expandcollapse850-x-335-px.png","author_info":{"display_name":"Moinul Islam","author_link":"https:\/\/tableberg.com\/fr\/author\/marufmoinul27\/"},"_links":{"self":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/posts\/5018","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/comments?post=5018"}],"version-history":[{"count":4,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/posts\/5018\/revisions"}],"predecessor-version":[{"id":5047,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/posts\/5018\/revisions\/5047"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/media\/5045"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/media?parent=5018"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/categories?post=5018"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/tags?post=5018"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
- \u00c9tape 2 : Ajouter du contenu au bloc<\/a><\/li>
- \u00c9tape 2 : Ajouter le bloc de basculement du contenu<\/a><\/li>
- \u00c9tape 1 : Installer le plugin Ultimate Blocks<\/a><\/li>