{"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":"wie-man-eine-preistabelle-mit-ribbon-in-wordpress-hinzufugt","status":"publish","type":"post","link":"https:\/\/tableberg.com\/de\/how-to-add-a-pricing-table-with-ribbon-in-wordpress\/","title":{"rendered":"So f\u00fcgen Sie eine Preistabelle mit Ribbon in WordPress hinzu"},"content":{"rendered":"<p>Die Pr\u00e4sentation Ihrer Preistabellen ist wichtig, um die Kunden zu beeinflussen. Eine wirkungsvolle M\u00f6glichkeit, Preistabellen aufzuwerten, ist die Integration eines Lesebands. Dabei handelt es sich um ein auff\u00e4lliges Banner, das diagonal \u00fcber eine Tabelle gelegt wird, um bestimmte Angebote, Rabatte und Funktionen hervorzuheben.<\/p>\n\n\n\n<p>Egal, ob Sie einen zeitlich begrenzten Rabatt, eine Sonderfunktion oder ein hei\u00df begehrtes Paket bewerben, ein gut platziertes Band kann die potenziellen Kunden sofort zu einer Entscheidung bewegen. <a href=\"https:\/\/wordpress.org\/plugins\/tableberg\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Tischberg<\/a> ist ein intuitives und leistungsf\u00e4higes Plugin f\u00fcr diese Aufgabe.<\/p>\n\n\n\n<p>In diesem Beitrag zeigen wir Ihnen, wie Sie mit Tableberg eine Preistabelle mit Farbband in WordPress hinzuf\u00fcgen.<\/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=\"So f\u00fcgen Sie eine Preistabelle mit Ribbon in WordPress hinzu\" 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>Sobald Sie das Plugin auf Ihrer Website installiert haben, k\u00f6nnen Sie mit dem folgenden Tutorial beginnen.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Schritt 1: Hinzuf\u00fcgen des Tableberg-Blocks zum Editor<\/h2>\n\n\n\n<p>Das Plugin f\u00fcgt einen Block namens <strong>Tischberg<\/strong> zur Gutenberg-Block-Bibliothek hinzuf\u00fcgen. F\u00fcgen Sie den Block zu Editor einfach die Presse <strong>das Plus-Symbol (+)<\/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=\"F\u00fcgen Sie den TableBerg-Block zu Ihrem Gutenberg-Editor hinzu\" 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>Legen Sie die Anzahl der Spalten und Zeilen fest, die Sie f\u00fcr Ihre Tabelle ben\u00f6tigen. F\u00fcr dieses Tutorial werden wir Folgendes festlegen <strong>3*1<\/strong> f\u00fcr Spalten und Zeilen.<\/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=\"Festlegen der Anzahl der Zeilen und Spalten\" 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>Sie sehen, dass das Grundlayout f\u00fcr die Kalkulationstabelle mit Spalten und einer Zeile erstellt wurde.<\/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=\"Spalten und Zeilen werden dem Editor hinzugef\u00fcgt\" 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\">Schritt 2: Inhalt zur Tabelle hinzuf\u00fcgen<\/h2>\n\n\n\n<p>Eine Preistabelle enth\u00e4lt in der Regel Produktnamen, Bilder, Preise, erm\u00e4\u00dfigte Preise und CTA-Schaltfl\u00e4chen. Sehen wir uns an, wie man sie zur Tabelle hinzuf\u00fcgt.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Den Produktnamen hinzuf\u00fcgen<\/h3>\n\n\n\n<p>Tableberg erm\u00f6glicht es Ihnen, verschiedene Arten von Bl\u00f6cken zu seinen Zellen hinzuzuf\u00fcgen, \u00e4hnlich wie der Gutenberg-Block-Editor. Hinzuf\u00fcgen der <strong>Absatzblock<\/strong> um den Namen des Produkts zu schreiben. (Standardm\u00e4\u00dfig wird der Absatzblock zu den Tabellenzellen hinzugef\u00fcgt).<\/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=\"F\u00fcgen Sie den Absatzblock zur Preistabelle hinzu\" 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>Schreiben Sie den Namen Ihres Produkts in die Zelle. Richten Sie den Text mittig aus, machen Sie ihn fett, \u00e4ndern Sie seine Farbe und passen Sie die Gr\u00f6\u00dfe an, indem Sie die in der folgenden Abbildung gezeigten Optionen verwenden.<\/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=\"Schreiben Sie den Namen des Produkts und passen Sie ihn an\" 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\">Das Produktbild hinzuf\u00fcgen<\/h3>\n\n\n\n<p>F\u00fcgen Sie den Bildblock zur Preistabelle hinzu.<\/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=\"F\u00fcgen Sie den Bildblock zur Preistabelle hinzu\" 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>Mit dem Bildblock k\u00f6nnen Sie das Produktbild hochladen. \u00c4ndern Sie die Gr\u00f6\u00dfe des Bildes nach Bedarf und richten Sie es passend aus.<\/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=\"Hochladen des Produktbildes\" 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\">Einen fr\u00fcheren Preis hinzuf\u00fcgen<\/h3>\n\n\n\n<p>Die Anzeige der Differenz zwischen dem vorherigen und dem aktuellen Preis ist eine gute M\u00f6glichkeit, den Rabatt hervorzuheben. F\u00fcgen wir also einen fr\u00fcheren Preis unter dem Produktbild ein.<\/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=\"Schreiben Sie den vorherigen Preis\" 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>Das Hinzuf\u00fcgen eines Durchstreichungseffekts zum vorherigen Preis kann die Aufmerksamkeit der Leute erregen. Um dies zu tun, <strong>W\u00e4hlen Sie den Preis<\/strong> mit Ihrem Cursor. <strong>Klicken Sie auf<\/strong> die <strong>Mehr Optionen<\/strong> in der Symbolleiste.<\/p>\n\n\n\n<p><strong>Gehe zu<\/strong> die <strong>Highlight<\/strong> und <strong>Durchgestrichene Optionen<\/strong>. Sie k\u00f6nnen die Farbe des Preises \u00e4ndern und ein Durchstreichen hinzuf\u00fcgen.<\/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=\"Durchstreichen des Preises hinzuf\u00fcgen\" 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\">Den aktuellen Preis des Produkts hinzuf\u00fcgen<\/h3>\n\n\n\n<p>F\u00fcgen Sie nun den aktuellen Preis des Produkts in einer vergleichsweise gro\u00dfen Schrift hinzu, damit er ins Auge f\u00e4llt.<\/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=\"Den aktuellen Preis des Produkts hinzuf\u00fcgen\" 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\">Hinzuf\u00fcgen einer CTA-Schaltfl\u00e4che<\/h3>\n\n\n\n<p>F\u00fcgen Sie am Ende des gesamten Inhalts die <strong>Knopfleiste<\/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=\"Hinzuf\u00fcgen des Schaltfl\u00e4chenblocks zur Preistabelle\" 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>\u00c4ndern Sie die Hintergrundfarbe der Schaltfl\u00e4che, die Textfarbe, die Schriftgr\u00f6\u00dfe und die Auff\u00fcllung. Nehmen Sie diese \u00c4nderungen nach Belieben vor.<\/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=\"Anpassen der CTA-Schaltfl\u00e4che der Preistabelle\" 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\">Schritt 3: Leerzeichen zwischen den Bl\u00f6cken hinzuf\u00fcgen<\/h2>\n\n\n\n<p>Der Spalteninhalt ist also fertig. Aber wie Sie sehen k\u00f6nnen, sind alle Bl\u00f6cke zu dicht gedr\u00e4ngt. Wir m\u00fcssen Abstand zwischen ihnen einf\u00fcgen, um ein frischeres Aussehen zu schaffen.<\/p>\n\n\n\n<p>Um dies zu tun, <strong>die jeweilige Spalte ausw\u00e4hlen<\/strong>. Gehen Sie dann zum <strong>Registerkarte \"Stile<\/strong>. Come to the <strong>Block-Abstand<\/strong> Option durch Bl\u00e4ttern in der Registerkarte. Vergr\u00f6\u00dfern Sie den Platz, indem Sie einen Wert in das Feld eintragen.<\/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=\"Leerzeichen zwischen den Bl\u00f6cken hinzuf\u00fcgen\" 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>F\u00fcgen Sie in \u00e4hnlicher Weise Inhalte zu den anderen Spalten hinzu. Um jedoch Zeit zu sparen, k\u00f6nnen Sie die Spalte duplizieren und dann den Inhalt aktualisieren. Hier ist ein Leitfaden \u00fcber <a href=\"https:\/\/tableberg.com\/de\/docs\/wie-dupliziere-ich-eine-zeilenspalte\/\" target=\"_blank\" rel=\"noreferrer noopener\">wie man eine Tableberg-Spalte und -Zeile dupliziert<\/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=\"F\u00fcllen Sie die anderen Spalten der Preistabelle aus\" 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\">Schritt 4: Radius zu den Tabellenspalten hinzuf\u00fcgen<\/h2>\n\n\n\n<p>Sie k\u00f6nnen die \u00c4sthetik verbessern, indem Sie den Tabellenspalten einen Randradius hinzuf\u00fcgen. <strong>Select<\/strong> die <strong>Tabelberg-Symbol<\/strong> in der Symbolleiste. <strong>Gehe zu<\/strong> die <strong>Registerkarte \"Stile<\/strong>. <\/p>\n\n\n\n<p>Bl\u00e4ttern und <strong>zu sich kommen<\/strong> <strong>Abstand zwischen den Zellen<\/strong>. Durch Ziehen der entsprechenden Option k\u00f6nnen Sie Leerzeichen zwischen den Spalten der Tabelle hinzuf\u00fcgen.<\/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=\"Radius zu den Tabellenspalten hinzuf\u00fcgen\" 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;\">Sie werden sehen, dass die&nbsp;<strong>Tabelle Randleiste<\/strong>&nbsp;Option direkt darunter. <strong>Satz<\/strong> Ihr gew\u00fcnschtes <strong>Wert des Radius<\/strong> f\u00fcr<\/span>r sowohl den inneren als auch den \u00e4u\u00dferen Rand. <\/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=\"Redius zu den Tabellenspalten hinzuf\u00fcgen\" 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>So k\u00f6nnen Sie Ihre Preistabelle vorbereiten.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Schritt 5: Hinzuf\u00fcgen einer Multifunktionsleiste zur Preistabelle<\/h2>\n\n\n\n<p>W\u00e4hlen Sie die Spalte aus, der Sie ein Farbband hinzuf\u00fcgen m\u00f6chten. Klicken Sie auf das Plus-Symbol (+) und suchen Sie die Option <strong>Farbbandblock<\/strong>. Klicken Sie dann auf und den Block in die Spalte.<\/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=\"W\u00e4hlen Sie eine Spalte, um ein Farbband hinzuzuf\u00fcgen\" 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>Das Farbband wird der Tabelle hinzugef\u00fcgt. Als N\u00e4chstes wird aus dem <strong>Registerkarte Einstellungen<\/strong>W\u00e4hlen Sie den Farbbandtyp, den Farbbandtext, die Seite und den Abstand. <\/p>\n\n\n\n<p>Danach passen Sie den Text und die Hintergrundfarbe in der <strong>Registerkarte \"Stile<\/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=\"Anpassen des Farbbandes auf der Preistabelle\" 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>Ihre Preistabelle ist also fertig und mit einer Schleife versehen.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Wir schlie\u00dfen!<\/h2>\n\n\n\n<p>Ich hoffe, diese Anleitung hat Ihnen gefallen. Aber es gibt einige Punkte, die Sie beachten m\u00fcssen. Achten Sie darauf, dass Ihre Tabelle sauber und \u00fcbersichtlich ist. Minimalistisch gestaltete Preistabellen wirken immer auf potenzielle Kunden.<\/p>\n\n\n\n<p>Zweitens: Verwenden Sie einen klaren und pr\u00e4gnanten Text, der den Webbesucher sofort anspricht. Wenn m\u00f6glich, f\u00fcgen Sie einige Vorteile\/Merkmale der Produkte in die Tabelle ein. Wenn Sie in Ihren Preistabellen mehrere Pl\u00e4ne abdecken wollen, ist es besser, sie mit einem Kippschalter anzuzeigen.<\/p>\n\n\n\n<p>Hier ist ein Leitfaden \u00fcber <a href=\"https:\/\/ultimateblocks.com\/how-to-create-a-pricing-table-with-toggle-switch-in-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">wie man eine Preistabelle mit dem Kippschalter in WordPress erstellt<\/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\/de\/author\/wpx_irayhan\/"},"_links":{"self":[{"href":"https:\/\/tableberg.com\/de\/wp-json\/wp\/v2\/posts\/3487","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tableberg.com\/de\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tableberg.com\/de\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tableberg.com\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tableberg.com\/de\/wp-json\/wp\/v2\/comments?post=3487"}],"version-history":[{"count":5,"href":"https:\/\/tableberg.com\/de\/wp-json\/wp\/v2\/posts\/3487\/revisions"}],"predecessor-version":[{"id":8451,"href":"https:\/\/tableberg.com\/de\/wp-json\/wp\/v2\/posts\/3487\/revisions\/8451"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tableberg.com\/de\/wp-json\/wp\/v2\/media\/3508"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/de\/wp-json\/wp\/v2\/media?parent=3487"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tableberg.com\/de\/wp-json\/wp\/v2\/categories?post=3487"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tableberg.com\/de\/wp-json\/wp\/v2\/tags?post=3487"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}