Een prijstabel is een goed gestructureerde weergave van producten en diensten met de bijbehorende prijzen en functies. Hiermee kunnen klanten verschillende prijsplannen vergelijken en de prijs kiezen die bij hen past.
De default WordPress table block lacks many advanced features. You cannot create comprehensive price tables with it. You need a table builder plugin like Tableberg to create stunning pricing tables.
You can create conversion-centric pricing tables even with its free version. In this article, we’ll show you how to create a pricing table in WordPress using the Tableberg plugin.
- Methode 1: Choosing a Pricing Table Template
- Methode 2: Creating a Pricing Table from the Scratch
Maak prachtige tafels
Met blok-editor
Choosing a Pricing Table Template
The Tableberg plugin comes with some pre-built pricing table templates. You can get started right away by choosing one of these templates.
Step 1: Install and Activate the Tableberg Plugin
Ga naar Plugins > Nieuwe plug-in toevoegen. Type Tafelberg in het zoekvak. Installeer en activeren de plugin nadat deze hieronder is weergegeven.
Step 2: Add the Tableberg Block to Your Post or Page
Open the post or page where you want to create the pricing table. Click on the + icon and search for ‘Tableberg’. Click on the Tableberg block to insert it.
Step 3: Choose a Pre-Built Table
Now if you want, you can create a table from the scratch. I’ll show that later.
Let’s see the pre-built option first. Once you’ve inserted the Tableberg block, simply click on ‘Pre-Built Tables’.
A patterns library will be popped up. Select the ‘Pricing Table’ section and choose a pricing table template.
The table will be inserted to the editor.
Step 4: Customize the Table
Select the whole block by click on the Tableberg icon and then click on the Settings icon from the upper right-hand side corner. You can customize the table from there.
Creating a Pricing Table from the Scratch
You can also create a table from the scratch.
Step 1: Choose the Number of Columns & Rows
Once you’ve inserted the Tableberg block, set its row and column number. However, you can increase or decrease the number of rows and columns after creating the table as needed. But for now, we are selecting a 4*4 row and column.
Als je veel inhoud toevoegt, heb je misschien meer ruimte nodig in de tabelcellen. Het is dus beter om de breedte van de tabel te vergroten. Selecteer de hele tabel door drie keer op het TableBerg-pictogram op de werkbalk te klikken.
Je krijgt de Tabblad Instellingen in de rechterzijbalk. Onder de instellingentabel vindt u de Tabel Breedte optie. Vergroot de breedte naar behoefte.
Step 2: Add Titles to the Table Columns
Voeg passende titels toe aan de kolommen van de tabel. Stel dat we een prijstabel maken voor een webhostingbedrijf. Er zijn vier prijsplannen in de tabel. De kolomtitel wordt dan Economy, Deluxe, Ultimate, en Maximaal.
Je kunt de titeltekst en de achtergrondkleur aanpassen via het tabblad aan de rechterkant. Je kunt ook de teksttypografie en de grootte aanpassen.
Step 3: Add Prices and Discount Rates to the Pricing Table Columns
Voeg eerst de prijzen van de plannen toe aan hun respectievelijke kolommen. We hebben de prijsteksten vet, iets groter en blauw gekleurd gemaakt.
Het kortingspercentage zit meestal dicht bij de hoofdprijs. Plaats je cursor op de prijscel en creëer ruimte eronder door op de knop Knop Enter op je toetsenbord.
Typ daarna je gewenste kortingspercentages in de respectievelijke kolommen.
We zullen nu de discontovoet benadrukken zodat deze beter zichtbaar wordt. Selecteer het kortingspercentage tekstgebied met je cursor. Klik op de Meer optie op de werkbalk. Kies de Markeer optie.
Gebruik een achtergrondmarkeerstift voor de kortingstarief tekst. We hebben de kleurcode toegepast #fcdc4b op de achtergrond van het kortingspercentage op de prijstabel.
Pas hetzelfde proces toe op elke kolom in de respectieve gebieden.
Als er speciale opmerkingen zijn voor de plannen, moet u deze opgeven in het prijsgebied. Kijk, we hebben het gedaan met het eerste haakjesteken.
Step 4: Add CTA Buttons to the Table
Door CTA-knoppen toe te voegen, kun je gebruikers niet uitlokken om je producten te kopen. Selecteer de cel waaraan je de CTA-knop wilt toevoegen. Druk op de Plus (+) pictogram op de cel en selecteer de CTA-knop.
We behandelen dit gedeelte niet in detail. Het enige wat je hier hoeft te doen is een overtuigende CTA-tekst schrijven voor elke knop. Koppel de knoppen aan de afrekenpagina. Achtergrond- en tekstkleuren toevoegen voor de knoppen.
Step 5: Add Features to the Pricing Table
Ten slotte moet je alle functies van je producten en diensten op basis van hun prijsplannen opsommen. Als er speciale woorden zijn die je wilt benadrukken, kun je die vet maken.
Step 6: Preview the Pricing Table
Voordat je de prijstabel publiceert, kun je hem het beste bekijken in de voorbeeldmodus om te controleren of er fouten in zitten. Als de tabel helemaal schoon is, kun je hem live zetten.
Conclusie
Zo kun je informatieve prijstabellen op je site maken die klanten helpen weloverwogen beslissingen te nemen. TableBerg komt met meer nieuwe functies waarmee je meer geavanceerde tabellen op je site kunt maken.
Als je deze post leuk vindt, plaats dan hieronder een reactie en laat ons weten wat je ervan vindt. Neem een kijkje op hoe maak je een vergelijkingstabel in WordPress.