{"id":3487,"date":"2025-02-17T03:05:58","date_gmt":"2025-02-17T03:05:58","guid":{"rendered":"https:\/\/tableberg.com\/?p=3487"},"modified":"2025-04-23T09:37:44","modified_gmt":"2025-04-23T09:37:44","slug":"comment-ajouter-un-tableau-de-prix-avec-ruban-dans-wordpress","status":"publish","type":"post","link":"https:\/\/tableberg.com\/fr\/how-to-add-a-pricing-table-with-ribbon-in-wordpress\/","title":{"rendered":"Comment ajouter un tableau de prix avec un ruban dans WordPress"},"content":{"rendered":"<p>La pr\u00e9sentation de vos tableaux de prix est importante pour influencer les clients. L'incorporation d'un ruban est un moyen efficace d'am\u00e9liorer les tableaux de prix. Il s'agit visuellement d'une banni\u00e8re d'\u00e9tiquettes affich\u00e9e en diagonale sur un tableau pour mettre en \u00e9vidence des offres, des remises et des caract\u00e9ristiques sp\u00e9cifiques.<\/p>\n\n\n\n<p>Que vous fassiez la promotion d'une r\u00e9duction limit\u00e9e dans le temps, d'une fonction sp\u00e9ciale ou d'un produit en vogue, un ruban bien plac\u00e9 peut instantan\u00e9ment influencer les clients potentiels et les inciter \u00e0 prendre une d\u00e9cision. <a href=\"https:\/\/wordpress.org\/plugins\/tableberg\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Tableberg<\/a> est un plugin intuitif et puissant.<\/p>\n\n\n\n<p>Dans cet article, nous vous montrerons comment ajouter un tableau de prix avec ruban dans WordPress avec Tableberg.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Comment ajouter un tableau de prix avec un ruban dans WordPress\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/SSv8XHstwLQ?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p>Une fois le plugin install\u00e9 sur votre site, passez au tutoriel suivant.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u00c9tape 1 : Ajouter le bloc Tableberg \u00e0 l'\u00e9diteur<\/h2>\n\n\n\n<p>Le plugin ajoute un bloc nomm\u00e9 <strong>Tableberg<\/strong> \u00e0 la biblioth\u00e8que de blocs de Gutenberg. Ajoutez le bloc \u00e0 l'\u00e9diteur en appuyant simplement sur <strong>l'ic\u00f4ne plus (+)<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor.webp\" alt=\"Ajouter le bloc TableBerg \u00e0 votre \u00e9diteur Gutenberg\" class=\"wp-image-481\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>D\u00e9finissez le nombre de colonnes et de lignes dont vous avez besoin pour votre tableau. Pour ce tutoriel, nous d\u00e9finirons <strong>3*1<\/strong> pour les colonnes et les lignes.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"653\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns.webp\" alt=\"D\u00e9finir le nombre de lignes et de colonnes\" class=\"wp-image-3014\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns-1024x522.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Vous pouvez voir que la structure de base du tableau de tarification a \u00e9t\u00e9 cr\u00e9\u00e9e avec des colonnes et une ligne.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Rows-and-columns-selected-for-designing-Icon-Boxes.webp\" alt=\"Les colonnes et les lignes sont ajout\u00e9es \u00e0 l&#039;\u00e9diteur\" class=\"wp-image-3113\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Rows-and-columns-selected-for-designing-Icon-Boxes.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Rows-and-columns-selected-for-designing-Icon-Boxes-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Rows-and-columns-selected-for-designing-Icon-Boxes-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Rows-and-columns-selected-for-designing-Icon-Boxes-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Rows-and-columns-selected-for-designing-Icon-Boxes-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">\u00c9tape 2 : Ajouter du contenu au tableau<\/h2>\n\n\n\n<p>Un tableau de prix comprend g\u00e9n\u00e9ralement les noms des produits, les images, les prix, les prix r\u00e9duits et les boutons CTA. Voyons comment les ajouter au tableau.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Ajouter le nom du produit<\/h3>\n\n\n\n<p>Tableberg vous permet d'ajouter diff\u00e9rents types de blocs \u00e0 ses cellules, \u00e0 l'instar de l'\u00e9diteur de blocs Gutenberg. Ajoutez le bloc <strong>Bloc de paragraphes<\/strong> pour \u00e9crire le nom du produit. (Par d\u00e9faut, le bloc de paragraphe est ajout\u00e9 aux cellules du tableau).<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-paragraph-block-to-the-pricing-table.webp\" alt=\"Ajouter le bloc de paragraphes au tableau des prix\" class=\"wp-image-3488\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-paragraph-block-to-the-pricing-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-paragraph-block-to-the-pricing-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-paragraph-block-to-the-pricing-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-paragraph-block-to-the-pricing-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-paragraph-block-to-the-pricing-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Inscrivez le nom de votre produit dans la cellule. Alignez le texte au centre, mettez-le en gras, modifiez sa couleur et redimensionnez-le \u00e0 l'aide des options pr\u00e9sent\u00e9es dans l'image ci-dessous.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Write-the-products-name-and-customize-it.webp\" alt=\"\u00c9crire le nom du produit et le personnaliser\" class=\"wp-image-3490\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Write-the-products-name-and-customize-it.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Write-the-products-name-and-customize-it-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Write-the-products-name-and-customize-it-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Write-the-products-name-and-customize-it-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Write-the-products-name-and-customize-it-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Ajouter l'image du produit<\/h3>\n\n\n\n<p>Ajoutez le bloc Image au tableau des prix.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-pricing-table.webp\" alt=\"Ajouter le bloc Image au tableau des prix\" class=\"wp-image-3491\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-pricing-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-pricing-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-pricing-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-pricing-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-pricing-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Le bloc d'image vous permet de t\u00e9l\u00e9charger l'image du produit. Redimensionnez l'image si n\u00e9cessaire et alignez-la correctement.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"523\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-the-product-image-1024x523.webp\" alt=\"T\u00e9l\u00e9charger l&#039;image du produit\" class=\"wp-image-3493\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-the-product-image-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-the-product-image-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-the-product-image-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-the-product-image-18x9.webp 18w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-the-product-image.webp 1280w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Ajouter un prix pr\u00e9c\u00e9dent<\/h3>\n\n\n\n<p>L'affichage de la diff\u00e9rence entre le prix pr\u00e9c\u00e9dent et le prix actuel est un excellent moyen de mettre en \u00e9vidence la r\u00e9duction. Ajoutons donc un prix pr\u00e9c\u00e9dent sous l'image du produit.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-a-Previous-Price.webp\" alt=\"Inscrivez le prix pr\u00e9c\u00e9dent\" class=\"wp-image-3494\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-a-Previous-Price.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-a-Previous-Price-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-a-Previous-Price-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-a-Previous-Price-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-a-Previous-Price-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>L'ajout d'un effet de biffure au prix pr\u00e9c\u00e9dent peut attirer l'attention des gens. Pour ce faire, proc\u00e9dez comme suit <strong>s\u00e9lectionner le prix<\/strong> \u00e0 l'aide du curseur. <strong>Cliquez sur<\/strong> les <strong>Plus d'options<\/strong> dans la barre d'outils.<\/p>\n\n\n\n<p><strong>Aller \u00e0<\/strong> les <strong>Mise en \u00e9vidence<\/strong> et <strong>Options de biffage<\/strong>. Vous pourrez changer la couleur du prix et ajouter un barr\u00e9.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-strikethrough-effect-to-the-price.webp\" alt=\"Ajouter l&#039;effet barr\u00e9 au prix\" class=\"wp-image-3495\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-strikethrough-effect-to-the-price.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-strikethrough-effect-to-the-price-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-strikethrough-effect-to-the-price-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-strikethrough-effect-to-the-price-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-strikethrough-effect-to-the-price-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Ajouter le prix actuel du produit<\/h3>\n\n\n\n<p>Ajoutez maintenant le prix actuel du produit dans une police relativement plus grande afin d'attirer l'attention des gens.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Current-Price-of-the-Product.webp\" alt=\"Ajouter le prix actuel du produit\" class=\"wp-image-3496\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Current-Price-of-the-Product.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Current-Price-of-the-Product-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Current-Price-of-the-Product-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Current-Price-of-the-Product-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Current-Price-of-the-Product-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Ajouter un bouton CTA<\/h3>\n\n\n\n<p>\u00c0 la fin de tout le contenu, ajoutez la mention <strong>Bloc de boutons<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-button-block-to-the-pricing-table.webp\" alt=\"Ajouter le bloc de boutons au tableau des prix\" class=\"wp-image-3497\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-button-block-to-the-pricing-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-button-block-to-the-pricing-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-button-block-to-the-pricing-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-button-block-to-the-pricing-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-button-block-to-the-pricing-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Modifiez la couleur d'arri\u00e8re-plan du bouton, la couleur du texte, la taille de la typographie et le remplissage. Effectuez ces changements comme vous le souhaitez.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-CTA-button-of-the-pricing-table.webp\" alt=\"Personnaliser le bouton CTA du tableau des prix\" class=\"wp-image-3498\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-CTA-button-of-the-pricing-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-CTA-button-of-the-pricing-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-CTA-button-of-the-pricing-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-CTA-button-of-the-pricing-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-CTA-button-of-the-pricing-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">\u00c9tape 3 : Ajouter des espaces entre les blocs<\/h2>\n\n\n\n<p>Le contenu de la colonne est donc pr\u00eat. Mais comme vous pouvez le voir, tous les blocs sont trop encombr\u00e9s. Nous devons ajouter de l'espace entre eux pour cr\u00e9er un aspect plus frais.<\/p>\n\n\n\n<p>Pour ce faire, <strong>s\u00e9lectionner une colonne particuli\u00e8re<\/strong>. Ensuite, allez \u00e0 la page <strong>Onglet Styles<\/strong>. Venez au <strong>Espacement des blocs<\/strong> en faisant d\u00e9filer l'onglet. Augmenter l'espace en ajoutant une valeur \u00e0 la case.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Spaces-Between-the-Blocks.webp\" alt=\"Ajouter des espaces entre les blocs\" class=\"wp-image-3499\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Spaces-Between-the-Blocks.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Spaces-Between-the-Blocks-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Spaces-Between-the-Blocks-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Spaces-Between-the-Blocks-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Spaces-Between-the-Blocks-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>De m\u00eame, ajoutez du contenu aux autres colonnes. Mais pour gagner du temps, vous pouvez dupliquer la colonne et mettre \u00e0 jour le contenu. Voici un guide sur <a href=\"https:\/\/tableberg.com\/fr\/documents\/comment-dupliquer-une-ligne-colonne\/\" target=\"_blank\" rel=\"noreferrer noopener\">comment dupliquer une colonne et une ligne de Tableberg<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Fill-the-other-columns-of-the-pricing-table.webp\" alt=\"Remplir les autres colonnes du tableau de tarification\" class=\"wp-image-3500\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Fill-the-other-columns-of-the-pricing-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Fill-the-other-columns-of-the-pricing-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Fill-the-other-columns-of-the-pricing-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Fill-the-other-columns-of-the-pricing-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Fill-the-other-columns-of-the-pricing-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">\u00c9tape 4 : Ajouter un rayon aux colonnes du tableau<\/h2>\n\n\n\n<p>Vous pouvez am\u00e9liorer l'esth\u00e9tique en ajoutant un rayon de bordure aux colonnes du tableau. <strong>S\u00e9lectionner<\/strong> les <strong>Ic\u00f4ne Tabelberg<\/strong> dans la barre d'outils. <strong>Aller \u00e0<\/strong> les <strong>Onglet Styles<\/strong>. <\/p>\n\n\n\n<p>D\u00e9filement et <strong>venir \u00e0<\/strong> <strong>Espacement des cellules<\/strong>. En faisant glisser l'option correspondante, vous pouvez ajouter des espaces entre les colonnes du tableau.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Radius-to-the-Table-Columns.webp\" alt=\"Ajouter un rayon aux colonnes du tableau\" class=\"wp-image-3501\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Radius-to-the-Table-Columns.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Radius-to-the-Table-Columns-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Radius-to-the-Table-Columns-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Radius-to-the-Table-Columns-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Radius-to-the-Table-Columns-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p><span style=\"box-sizing: border-box; margin: 0px; padding: 0px;\">Vous verrez le&nbsp;<strong>Table Border<\/strong>&nbsp;juste en dessous. <strong>Set (jeu de mots)<\/strong> votre souhait <strong>Valeur du rayon<\/strong> fo<\/span>r le bord int\u00e9rieur et ext\u00e9rieur. <\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-redius-to-the-table-columns.webp\" alt=\"Ajouter redius aux colonnes du tableau\" class=\"wp-image-3502\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-redius-to-the-table-columns.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-redius-to-the-table-columns-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-redius-to-the-table-columns-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-redius-to-the-table-columns-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-redius-to-the-table-columns-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Vous pouvez ainsi pr\u00e9parer votre tableau de prix.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u00c9tape 5 : Ajouter un ruban au tableau des prix<\/h2>\n\n\n\n<p>S\u00e9lectionnez la colonne \u00e0 laquelle vous souhaitez ajouter un ruban. Cliquez sur l'ic\u00f4ne plus (+) et recherchez l'ic\u00f4ne <strong>Bloc de rubans<\/strong>. Ensuite, cliquez sur et sur le bloc dans la colonne.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-column-to-add-a-ribbon.webp\" alt=\"S\u00e9lectionnez une colonne pour ajouter un ruban\" class=\"wp-image-3503\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-column-to-add-a-ribbon.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-column-to-add-a-ribbon-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-column-to-add-a-ribbon-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-column-to-add-a-ribbon-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-column-to-add-a-ribbon-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Le ruban sera ajout\u00e9 au tableau. Ensuite, dans la fen\u00eatre <strong>Onglet Param\u00e8tres<\/strong>s\u00e9lectionner le type de ruban, le texte du ruban, le c\u00f4t\u00e9 et la distance. <\/p>\n\n\n\n<p>Ensuite, personnalisez le texte et la couleur d'arri\u00e8re-plan \u00e0 partir de l'onglet <strong>Onglet Styles<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-ribbon-on-the-pricing-table.webp\" alt=\"Personnaliser le ruban du tableau des prix\" class=\"wp-image-3504\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-ribbon-on-the-pricing-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-ribbon-on-the-pricing-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-ribbon-on-the-pricing-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-ribbon-on-the-pricing-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-ribbon-on-the-pricing-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Votre tableau de tarification est donc pr\u00eat, avec un ruban.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Fermeture !<\/h2>\n\n\n\n<p>J'esp\u00e8re que vous avez appr\u00e9ci\u00e9 ce tutoriel. Mais il y a plusieurs points que vous devez garder \u00e0 l'esprit. Veillez \u00e0 ce que votre tableau soit propre et d\u00e9gag\u00e9. Les tables de tarification minimalistes ont toujours un impact sur les clients potentiels.<\/p>\n\n\n\n<p>Deuxi\u00e8mement, utilisez un texte clair et concis qui attire instantan\u00e9ment les visiteurs. Si possible, ajoutez quelques avantages\/caract\u00e9ristiques des produits dans le tableau. Si vous souhaitez couvrir plusieurs plans dans vos tableaux de prix, il est pr\u00e9f\u00e9rable de les afficher \u00e0 l'aide d'un interrupteur \u00e0 bascule.<\/p>\n\n\n\n<p>Voici un guide sur <a href=\"https:\/\/ultimateblocks.com\/how-to-create-a-pricing-table-with-toggle-switch-in-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">comment cr\u00e9er un tableau de prix avec un interrupteur \u00e0 bascule dans WordPress<\/a>.<\/p>","protected":false},"excerpt":{"rendered":"<p>The presentation of your pricing tables is important in influencing customers. One powerful way to enhance pricing tables is by incorporating a ribbon. It&#8217;s visually a striking banner of labels displayed diagonally across a table to highlight specific offers, discounts, and features. Whether you are promotion a limited-time discount, special feature, or hot-selling packages, a [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":3508,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","footnotes":""},"categories":[7],"tags":[86,113],"class_list":["post-3487","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-how-to","tag-pricing-tables","tag-ribbon-block"],"featured_image_src":"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/How-to-Add-a-Pricing-Table-with-Ribbon-in-WordPress.webp","author_info":{"display_name":"Istiak Rayhan","author_link":"https:\/\/tableberg.com\/fr\/author\/wpx_irayhan\/"},"_links":{"self":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/posts\/3487","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\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/comments?post=3487"}],"version-history":[{"count":5,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/posts\/3487\/revisions"}],"predecessor-version":[{"id":8451,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/posts\/3487\/revisions\/8451"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/media\/3508"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/media?parent=3487"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/categories?post=3487"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tableberg.com\/fr\/wp-json\/wp\/v2\/tags?post=3487"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}