---
title: "How to Add a Pricing Table in WordPress?"
url: https://nexterwp.com/docs/add-a-pricing-table-in-wordpress/
date: 2024-12-10
modified: 2026-04-14
author: "Aditya Sharma"
description: "A well-designed pricing table not only enhances the visual appeal of your website but also simplifies the decision-making process for potential buyers by clearly outlining the features and costs associated..."
image: https://nexterwp.com/wp-content/uploads/2024/12/How-to-Add-a-Pricing-Table-in-WordPress_-1024x519.jpg
word_count: 1136
---

# How to Add a Pricing Table in WordPress?

## Key Takeaways

- Nexter Blocks includes a Pricing Table block that allows users to add beautiful pricing tables to their WordPress website.
- The Pricing Table block offers multiple predesigned layouts, available in both free and pro versions.
- Users can display a previous price in the pricing table to highlight differences between old and new prices.
- The PRO version of the Pricing Table block includes features like tooltips and scale effects for enhanced interactivity.

A well-designed pricing table not only enhances the visual appeal of your website but also simplifies the decision-making process for potential buyers by clearly outlining the features and costs associated with each option.

With the Pricing Table block from Nexter Blocks, you can easily add beautiful pricing tables to your WordPress website.

[LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/blocks/wordpress-pricing-table/)

## Required Setup

- Make sure the default WordPress Block editor is active. 

- You need to have the [Nexter Blocks](https://wordpress.org/plugins/the-plus-addons-for-block-editor/) plugin installed and activated.

- Make sure the Pricing Table block is activated, to verify this visit Nexter → Blocks → and Search for Pricing Table and activate.

- This is a Freemium block, to unlock the extra features, you need the [PRO version of Nexter Blocks](https://nexterwp.com/pricing/?utm_source=tpag&utm_medium=docs&utm_campaign=text).

## Learn via Video Tutorial

https://www.youtube.com/watch?v=RCmNUbEATzo&t

## How to activate the Pricing Table Block?

Go to 

- **Nexter **→ **Blocks **

- **Search **the block name** **and** turn on the toggle**.

![](https://nexterwp.com/wp-content/uploads/2024/12/pricing-table-activate-new-1.png)

## Key Features

- **Multiple Layout** - You can select from multiple predesigned layouts (free and pro).

- **Previous Price** - You can easily show a previous price in the pricing table.

- **Ribbon **- You can easily [add a ribbon tag to highlight a pricing table](https://nexterwp.com/docs/add-a-ribbon-to-a-wordpress-pricing-table-recommended-popular-tag/).

- **Tooltip** (Pro) - You can [add a tooltip to a pricing table content](https://nexterwp.com/docs/add-a-tooltip-to-a-wordpress-pricing-table/).

- **Show More Options** - You can easily limit the initial content by [adding a show more option to a pricing table](https://nexterwp.com/docs/add-a-show-more-button-for-features-in-wordpress-pricing-table/).

- **Scale Effect** (Pro) - You can easily [add a zoom effect to highlight a pricing table](https://nexterwp.com/docs/highlight-a-pricing-plan-with-scale-effect-in-wordpress/).

## How to Use the Pricing Table Block?

Add the Pricing Table block to the page.

Then click on the **Design from Scratch** button to design the layout from scratch.

![](https://nexterwp.com/wp-content/uploads/2024/12/pricing-table-design-type-1024x190.png)

> *Note: By clicking on the Import Pre-Designed Template button, you can [import a preset template](https://nexterwp.com/docs/import-templates-in-nexter/#Import-Preset-Designs-for-Specific-Blocks-in-Nexter) and customize it as per your requirements.*

### Style

From the **Layout** section, you can select a pre-defined style (free and pro) for the pricing table.

![](https://nexterwp.com/wp-content/uploads/2024/12/pricing-table-layout-new.png)

### Title Area

From the **Title Layout **dropdown, you can select a style for the title.

You can edit the title from the **Title** field.

In the **Subtitle** field, you can add a subtitle.

Then from the **Icon Type** section, you can add an icon, image or SVG above the title in the pricing table.

- **None** - To add nothing above the title.

- **Icon** - To add an icon from different icon libraries.

- **Image** - To add an image above the title.

- **SVG** - To add a custom SVG image above the title.

From the **Alignment** section, you can align the title.

### Price Area

From the **Price Layout** section, you can select a pre-defined style (free and pro) of the price text.

![](https://nexterwp.com/wp-content/uploads/2024/12/pricing-table-price-area-new.png)

In the **Prefix Text** field, you can add a currency symbol or any text before the price amount. 

Then in the **Price Amount** field, you have to add the actual price.

You can add a text after the price in the **Postfix Text** field. Ideal for adding the frequency of the payment like per month, per year etc.

### Previous Price

By enabling the **Display Previous Price** toggle, you can add a previous price, ideal for showing the differences between the old and new prices.

![](https://nexterwp.com/wp-content/uploads/2024/12/pricing-table-previous-price-new.png)

Similar to the Price Area tab, you can add a prefix text, price and postfix text in the **Prefix Text**, **Price Amount** and **Postfix Text** fields.

### Content Area

In this tab, you have to add the pricing table content.

From the **Content Type** section, you have to select how you want to add the content. Here you’ll find two options - 

- **Text Content** - With this option, you’ll find a text editor to add the content.

- **Stylish List** - With this option, you can add content using repeater items.

> *Note: For each option, you’ll find two pre-defined styles for the content section. *

Select the option as per your requirements. Let’s select Stylish List here.

> *Note: You’ll find extra options with the Stylish List option.*

You can select a pre-defined style from the **Price Layout** section.

Then you’ll find three repeater items by default under the Features section, open one item.

In the **List Description** section, you can add the description.

From the **Select Icon** section, you can select the icon library and add an icon to the description list item.

Then, from the **Icon Color** section, you can change the icon color for normal and hover states.

By enabling the **Tooltip Options** (Pro) toggle, you can [add a tooltip to the list item](https://nexterwp.com/docs/add-a-tooltip-to-a-wordpress-pricing-table/).

You can also add an extra icon to the content item by enabling the **Extra Icon** toggle.

Following this process you can edit the other repeater items.

You can click on the **+ Add Features** button to add more items.

From the **Read More Toggle**, you can limit the initial item visibility by [adding a show-all option](https://nexterwp.com/docs/add-a-show-more-button-for-features-in-wordpress-pricing-table/).

### Button

By enabling the **Button** toggle, you can add a button to the pricing table.

![](https://nexterwp.com/wp-content/uploads/2024/12/pricing-table-button-new.png)

From the **Style** section, you can select a pre-defined style.

In the **Button Text** field, you can add the button text.

You can add a link to the button in the **Button Link** field.

> *Note: The icon related options are available for Style 2 only.*

From the **Icon Type** section, you can add an icon to the button. 

Then, from the **Icon Position** section, you can place the icon before or after the button text.

You can adjust the icon spacing size from the **Icon Spacing** and **Icon Size** sections.

### Call to Action

From the **Content** field, you can add a call to action content below the button.

![](https://nexterwp.com/wp-content/uploads/2024/12/pricing-table-call-to-action-new.png)

### Ribbon

By enabling the **Display Ribbon** toggle, you can [add a ribbon to the pricing table](https://nexterwp.com/docs/add-a-ribbon-to-a-wordpress-pricing-table-recommended-popular-tag/).

![](https://nexterwp.com/wp-content/uploads/2024/12/pricing-table-ribbon-new.png)

> *Note: This will only add one pricing table item, to create multiple pricing table items you have to use the Pricing Table widget multiple times.*

## How to Style the Pricing Table Block?

To style the Pricing Table block, you’ll find all options in the Style tab.

**Title Area** - From here, you can style the title.

![](https://nexterwp.com/wp-content/uploads/2024/12/pricing-table-style-tab-new.png)

**Previous Price Style** - From here, you can style the previous price text. 

**Price Area** - From here, you can style the price text.

**Content Area** - From here, you can style the pricing table description text.

**Content Background** - From here, you can style the pricing table description area.

**Tooltip Options** (Pro) - From here, you can style the tooltip.

**Button** - You’ll see this tab, only when the button toggle is enabled. From here, you can style the button.

**Ribbon** - You’ll see this tab, only when the ribbon toggle is enabled. From here, you can style the ribbon.

**Background Options** - From here, you can style the pricing table background for normal and hover states, add different hover animations and more.

**Extra Options** (Pro) - From here, you can add a zoom effect to highlight a pricing plan.

Advanced options remain common for all our blocks, you can explore all it options from here.

[View Advanced tab tutorial.](https://nexterwp.com/docs/add-advanced-tab-in-wordpress/)

## Frequently Asked Questions

**Q: What should I do if the Pricing Table block isn't showing up?**
A: If the Pricing Table block isn't visible, ensure that the Nexter Blocks plugin is installed and activated. You can verify this by navigating to Nexter u2192 Blocks and searching for the Pricing Table. If it's not activated, simply turn on the toggle. This is crucial because the block won't function without proper activation.

**Q: Can I use the Pricing Table block for subscription services?**
A: The Pricing Table block is ideal for subscription services as it allows you to display various pricing options clearly. You can include a price amount, prefix text for currency, and even a postfix text for billing frequency, such as 'per month' or 'per year'. This clarity helps users make informed decisions.

**Q: How can I add a tooltip to my Pricing Table?**
A: To add a tooltip to your Pricing Table, you need to enable the Tooltip option, which is available in the PRO version of Nexter Blocks. This feature allows you to provide additional information about pricing or features without cluttering the table, enhancing user experience.