{"id":1340,"date":"2024-05-11T17:08:03","date_gmt":"2024-05-11T17:08:03","guid":{"rendered":"https:\/\/tableberg.com\/?post_type=docs&#038;p=1340"},"modified":"2024-06-22T23:07:46","modified_gmt":"2024-06-22T23:07:46","password":"","slug":"comment-ajouter-des-listes-stylisees-dans-les-tableaux-wordpress","status":"publish","type":"docs","link":"https:\/\/tableberg.com\/fr\/docs\/how-to-add-styled-lists-in-wordpress-tables\/","title":{"rendered":"Bloc de listes stylis\u00e9es"},"content":{"rendered":"<p>Le bloc Liste stylis\u00e9e vous permet de pr\u00e9senter vos informations d'une mani\u00e8re visuellement attrayante que les lecteurs peuvent assimiler. Ce bloc est utilis\u00e9 dans diverses sections d'un site web pour expliquer les caract\u00e9ristiques d'un produit, ses avantages, les services offerts, etc.<\/p>\n\n\n\n<p>Vous pouvez \u00e9galement ajouter ce bloc aux tableaux WordPress pour cr\u00e9er des comparaisons, des sp\u00e9cifications et d'autres types de tableaux. Dans ce document, nous allons vous montrer comment ajouter des listes stylis\u00e9es dans les tableaux WordPress en utilisant le bloc <a href=\"https:\/\/wordpress.org\/plugins\/tableberg\/\" target=\"_blank\" rel=\"noopener nofollow\" title=\"TableBerg\">TableBerg<\/a> plugin.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u00c9tape 01 : Ajouter le bloc de liste stylis\u00e9e au tableau<\/h2>\n\n\n\n<p>Supposons que nous voulions pr\u00e9senter les caract\u00e9ristiques d'un produit dans un tableau \u00e0 l'aide d'un bloc. Placez votre curseur sur la cellule o\u00f9 vous souhaitez ajouter le bloc.<\/p>\n\n\n\n<p>Appuyer sur la touche <strong>bouton plus (+)<\/strong> et trouver le <strong>Bloc de listes stylis\u00e9es<\/strong>. Ajouter le bloc \u00e0 la cellule.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Styled-List-Block-to-the-Table.webp\" alt=\"Ajouter le bloc de liste stylis\u00e9e au tableau\" class=\"wp-image-1341\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Styled-List-Block-to-the-Table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Styled-List-Block-to-the-Table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Styled-List-Block-to-the-Table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Styled-List-Block-to-the-Table-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Les <strong>Bloc de listes stylis\u00e9es<\/strong> sera ajout\u00e9 \u00e0 la cellule dans une seconde.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-Styled-List-block-is-added.webp\" alt=\"Le bloc Liste stylis\u00e9e est ajout\u00e9\" class=\"wp-image-1342\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-Styled-List-block-is-added.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-Styled-List-block-is-added-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-Styled-List-block-is-added-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-Styled-List-block-is-added-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">\u00c9tape 02 : Configuration des param\u00e8tres du bloc de liste stylis\u00e9e<\/h2>\n\n\n\n<p>Avant d'ajouter du contenu, vous pouvez modifier les param\u00e8tres de l'option <strong>Bloc de listes stylis\u00e9es<\/strong>. Vous pouvez modifier la <strong>Indentation des \u00e9l\u00e9ments de la liste, espacement des \u00e9l\u00e9ments,<\/strong> et <strong>l'alignement vertical<\/strong>. <\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"523\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-Settings-of-the-Styled-List-Block-1024x523.webp\" alt=\"\" class=\"wp-image-1343\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-Settings-of-the-Styled-List-Block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-Settings-of-the-Styled-List-Block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-Settings-of-the-Styled-List-Block-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-Settings-of-the-Styled-List-Block.webp 1280w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Le plugin TableBerg comprend <strong>270+ ic\u00f4nes<\/strong> pour le bloc Liste des styles. Pour modifier l'ic\u00f4ne de la liste, cliquez sur l'ic\u00f4ne de la liste \u00e0 c\u00f4t\u00e9 de l'ic\u00f4ne de la liste. <strong>S\u00e9lectionner l'option Ic\u00f4ne<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"523\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Change-icon-for-the-Style-List-block-1024x523.webp\" alt=\"\" class=\"wp-image-1344\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Change-icon-for-the-Style-List-block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Change-icon-for-the-Style-List-block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Change-icon-for-the-Style-List-block-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Change-icon-for-the-Style-List-block.webp 1280w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>S\u00e9lectionnez une ic\u00f4ne pour le bloc Liste stylis\u00e9e dans la collection. <\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Select-an-icon-for-the-Styled-List-block-from-the-collection.webp\" alt=\"S\u00e9lectionnez une ic\u00f4ne pour le bloc Liste stylis\u00e9e dans la collection\" class=\"wp-image-1345\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Select-an-icon-for-the-Styled-List-block-from-the-collection.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Select-an-icon-for-the-Styled-List-block-from-the-collection-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Select-an-icon-for-the-Styled-List-block-from-the-collection-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Select-an-icon-for-the-Styled-List-block-from-the-collection-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Vous pouvez \u00e9galement r\u00e9gler la <strong>taille des ic\u00f4nes, espacement des ic\u00f4nes,<\/strong> et <strong>taille de la police<\/strong> pour le bloc Liste stylis\u00e9e.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Set-icon-size-and-spacing-for-the-Styled-List-block.webp\" alt=\"D\u00e9finir la taille et l&#039;espacement des ic\u00f4nes pour le bloc Liste stylis\u00e9e\" class=\"wp-image-1346\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Set-icon-size-and-spacing-for-the-Styled-List-block.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Set-icon-size-and-spacing-for-the-Styled-List-block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Set-icon-size-and-spacing-for-the-Styled-List-block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Set-icon-size-and-spacing-for-the-Styled-List-block-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">\u00c9tape 03 : Ajouter du contenu au bloc de liste stylis\u00e9e<\/h2>\n\n\n\n<p>Ajoutez maintenant le contenu de votre article au bloc Liste stylis\u00e9e.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-Content-to-the-Styled-List-Block.webp\" alt=\"Ajouter du contenu au bloc de liste stylis\u00e9e\" class=\"wp-image-1347\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-Content-to-the-Styled-List-Block.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-Content-to-the-Styled-List-Block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-Content-to-the-Styled-List-Block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-Content-to-the-Styled-List-Block-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">\u00c9tape 04 : Styliser le bloc de liste stylis\u00e9e<\/h2>\n\n\n\n<p>Aller \u00e0 la page <strong>Onglet stylis\u00e9<\/strong>. Vous aurez la possibilit\u00e9 de personnaliser le <strong>ic\u00f4ne<\/strong> et <strong>couleur du texte<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Edit-Post-Practice-for-Doc-Writing-Dont-Touch-\u2039-Tableberg-\u2014-WordPress.webp\" alt=\"Fl\u00e8che Shottr\" class=\"wp-image-1348\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Edit-Post-Practice-for-Doc-Writing-Dont-Touch-\u2039-Tableberg-\u2014-WordPress.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Edit-Post-Practice-for-Doc-Writing-Dont-Touch-\u2039-Tableberg-\u2014-WordPress-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Edit-Post-Practice-for-Doc-Writing-Dont-Touch-\u2039-Tableberg-\u2014-WordPress-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Edit-Post-Practice-for-Doc-Writing-Dont-Touch-\u2039-Tableberg-\u2014-WordPress-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>De la m\u00eame mani\u00e8re, vous pouvez ajouter le bloc Liste stylis\u00e9e aux autres lignes du tableau. J'esp\u00e8re que vous pourrez le faire vous-m\u00eame.<\/p>\n\n\n\n<p>Maintenant, avant de quitter la documentation, prenez quelques minutes pour explorer cette doc sur <a href=\"https:\/\/tableberg.com\/fr\/documents\/tableberg-one\/tableberg\/comment-ajouter-un-classement-par-etoiles-dans-wordpress\/\" target=\"_blank\" rel=\"noopener\" title=\"Comment ajouter des notes en \u00e9toiles dans les tableaux WordPress\">Comment ajouter des notes en \u00e9toiles dans les tableaux WordPress<\/a>.<\/p>\n\n\n\n<p><\/p>","protected":false},"excerpt":{"rendered":"<p>The Styled List block allows you to present your information in a visually appealing way that readers can digest. This block is used in various sections of a website to explain product features, benefits, service offerings, and more. You can add this block to WordPress tables as well to create comparisons, specifications, and other type [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"_eb_attr":"","footnotes":""},"doc_category":[94],"doc_tag":[46,77],"class_list":["post-1340","docs","type-docs","status-publish","hentry","doc_category-sub-blocks","doc_tag-list-block","doc_tag-styled-list"],"year_month":"2026-04","word_count":312,"total_views":0,"reactions":{"happy":0,"normal":0,"sad":0},"author_info":{"name":"Istiak Rayhan","author_nicename":"wpx_irayhan","author_url":"https:\/\/tableberg.com\/fr\/author\/wpx_irayhan\/"},"doc_category_info":[{"term_name":"Sub-Blocks","term_url":"https:\/\/tableberg.com\/fr\/docs-category\/sub-blocks\/"}],"doc_tag_info":[{"term_name":"List Block","term_url":"https:\/\/tableberg.com\/fr\/docs-tag\/list-block\/"},{"term_name":"Styled List","term_url":"https:\/\/tableberg.com\/fr\/docs-tag\/styled-list\/"}],"_links":{"self":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/docs\/1340","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/comments?post=1340"}],"version-history":[{"count":2,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/docs\/1340\/revisions"}],"predecessor-version":[{"id":1824,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/docs\/1340\/revisions\/1824"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/media?parent=1340"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/doc_category?post=1340"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/doc_tag?post=1340"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}