Tables are a key component in most websites. You can use them to share all kinds of information, from prices to lists of features and links. WordPress enables you to set up basic tables for your website, but you may be looking for more customization options.

With Elementor, you get access to multiple table widgets. Moreover, there are plenty of Elementor table plugins that add new widgets to the popular page builder.

In this article, we’ll talk about how WordPress tables work and how they compare to Elementor widgets. Then, we’ll show you how to create Elementor tables manually, and introduce you to some plugins that add new table widgets to the editor. Let’s get to it!


When To Use WordPress Tables

Once you start looking for them, you’ll notice that tables are everywhere on the web. That’s because they’re some of the most versatile elements that you can use in a website.

Take pricing tables, for example. It’s hard to find a service or subscription website that doesn’t use tables to help you compare options:

Pricing tables on the Kinsta website
Pricing tables on Kinsta

Tables enable you to present large amounts of information in a way that’s easy for readers to digest. Even better, tables make it simpler for users to compare multiple datasets against each other:

A table comparing multiple datasets
Comparing multiple datasets

On top of helping you share information, tables can also help break the monotony of long paragraphs in a blog post or a page. Typically, we recommend that you avoid long walls of text as they can be hard to navigate.

The Block Editor gives you the option of adding tables to your website with ease. The Table block enables you to set the number of rows and columns that you need:

Tables using the block editor in WordPress
WordPress block editor tables

Although adding tables in WordPress is easy, you’re somewhat limited as to customization options. You can change background colors, customize button styles, and modify font sizes, but that’s pretty much it. If you want to create more stylish and complex tables, you’ll need to use a page builder such as Elementor (or even Divi).

Tables are a key component of most websites 💪, and this guide will show you how they can enhance your site 🚀Click to Tweet

What an Elementor Table Can Do

If you want to go beyond basic WordPress tables, Elementor gives you access to a highly-customizable Price Table widget. This enables you to edit table titles, set heading tags, add lists of features, tweak Calls To Action (CTAs), and more:

The Elementor Price Table widget
Elementor Price Table widget

Remember that with Elementor, you can create any type of layout that you want for any page or post. This means you can set up multi-column designs so you can have several Price Table widgets side by side:

Example of price table widgets side by side
Price table widgets in Elementor side by side

Elementor also comes with a Table of Contents widget. This makes navigating long-form content much easier for your readers.

How To Create an Elementor Table (Manually)

Creating a pricing table using Elementor is simple. To get started, open the Elementor editor. From here, you can choose to start with a blank page or to import a template from the Elementor library:

Choose a page or template from the Elementor library
Choose a page or template from the Elementor library

When you’re ready to add the element, you’ll want to select the number of columns you want the table to have. Click on the Elementor plus sign at the bottom of the editor and select the column structure that you want to use for the price section:

An image showing number of columns available
Select the number of columns you want

Keep in mind that if you use multiple columns, you’ll need to add a separate Price Table widget in each of them. Although each table will be a unique element, users will see them side by side (or below each other on mobile) as part of one section:

Add multiple table widgets when needed
Add multiple table widgets when needed

We recommend adding one Price Table module and styling it first. Then, you can duplicate or copy that element into the remaining columns, and add unique text to each one.

To customize the table, select the element and move to the Style tab under the widget settings. Elementor provides you with plenty of styling options. These include color selection, typography settings, and unique configurations for each section of the table:

Customize the table using the styling options in Elementor
Customize the table using the styling options in Elementor

Once you’re happy with the style of the price table, right-click on the element and select the Duplicate option. A copy of the table will appear under the original element, and you can drag it into one of the empty columns:

Use the duplicate option when needed
Duplicate your table to save time

You’ll want to repeat that process for as many columns as you have. Keep in mind that each table can have a unique style if you’d rather not re-use settings. In that case, make sure that the styles are similar enough so that visitors will understand they’re looking at a comparison.

While customizing your table, remember that Elementor enables you to add custom CSS to any module. To do so, go to the widget’s Advanced settings and select the Custom CSS tab:

Add custom CSS to a module in Elementor
Add custom CSS

Adding custom CSS through Elementor is a lot easier than editing WordPress code manually. Likewise, editing CSS in WordPress requires you to access theme files and optimize the code for peak performance. With Elementor, you just need to add the CSS code in the corresponding field for each module.

If adding CSS manually sounds intimidating, don’t worry. Learning CSS doesn’t require you to be a web developer. However, it’s a valuable skill that will help you customize your WordPress websites (and maybe even find a career in web development).

Once all of your tables are set, it’s time to edit their text and add as many features as you need for each entry. You can do that by selecting a table and moving to the Content tab under the widget settings:

Edit table text and other content
Edit table text and other table content

Editing the content of your price tables is easy. You can click on any element within the widget to start editing it. Once you’re happy with the results, your price tables will be good to go.

Top Elementor Table Plugins (12 Options)

Although Elementor contains plenty of tools for helping you create tables, you can always add more widgets to the roster. In this section, we’ll look at 12 Elementor plugins you can use to add new types of tables to your posts and pages. Even though a lot of these addons are built for Elementor, you can install them as regular plugins.

As always, we only recommend best-in-class WordPress plugins that offer great performance and that get regular updates. Using well-optimized plugins will help you scale your website without running into performance issues.

1. ElementsKit Add-Ons for Elementor

ElementsKit add on
ElementsKit

ElementsKit adds over 85 widgets to Elementor. You have options for basic tables, pricing tables, support for embedding TablePress elements, and more.

The Professional version of ElementsKit also includes an advanced tables widget. This enables you to add search and filter features to tables. Plus, you can include pagination so users can navigate entries without having massive tables on your website.

Key Features:

  • Three types of table widgets
  • Support for table filtering, searching, and pagination
  • Integration with TablePress for embedding tables

Price: ElementsKit licenses start at $39 per year.

2. WP Table Builder

WP Table Builder plugin for Elementor
WP Table Builder

If you’re a fan of drag-and-drop editors (which you should be if you’re using Elementor) you’ll enjoy using WP Table Builder. This plugin enables you to build tables using pre-configured elements such as buttons, review sections, product ratings, and more.

On top of advanced elements, you get access to basic modules, such as text and images. The plugin also ships with table templates, which will make your work even simpler.

You can add WP Table Builder tables to your website using the Block Editor. The plugin also integrates with Elementor, making it easy to place tables anywhere within your website.

Key Features:

  • Use a drag-and-drop table builder
  • Get access to pre-built elements such as buttons, review sections, and product ratings
  • Customize the style of each element in your tables
  • Use pre-built page templates

Price: WP Table Builder licenses start at $39 per year.

3. TablePress

TablePress add on
TablePress

TablePress is a free plugin that’s about as close as you can get to adding spreadsheet functionality to WordPress. The plugin can import data in several formats, including Excel, CSV, and JSON files. You can even export table data for other programs.

With TablePress, you can create tables that include search functionality. Users can choose how many entries to display and move from page to page if you’re showing massive datasets.

Embedding TablePress tables with Elementor is simple. The plugin creates unique shortcodes for each table. The Elementor Shortcode widget will help you add those codes anywhere on your website.

Key Features:

  • Import and export datasets in Excel, CSV, JSON, and HTML formats
  • Add searchable tables to WordPress
  • Enable pagination for tables

Price: TablePress is a free plugin but you can find premium extensions for it.

4. Essential Addons for Elementor

Essential Addons for Elementor
Essential Addons

Essential Addons for Elementor adds over 80 new widgets to the page builder. You have options for pricing tables, data tables, tables of contents, and more.

Essential Addons for Elementor comes in two versions. The free plugin adds a better version of the pricing table widget that Elementor ships with. If you want access to data tables (which include filtering, searching, and multiple styles), you’ll need to pay for a premium license.

Key Features:

  • Add pricing, data, and content table widgets
  • Enable searching and filtering within tables

Price: There’s a free version of Essential Addons for Elementor and premium licenses start at $39.97 per year.

5. PowerPack for Elementor

PowerPack for Elementor add on
PowerPack for Elementor

PowerPack for Elementor adds over 70 widgets to the page builder. The plugin also includes a large number of new templates that you can use to design websites faster.

As far as tables go, PowerPack enables you to set up sortable and searchable data tables. You can import data into tables using CSV files. The plugin also includes multiple table template options.

Beyond data tables, PowerPack offers info and pricing table widgets. Info tables are perfect if you want to provide visitors with a breakdown of the services that you offer.

Key Features:

  • Create sortable and searchable data tables
  • Import data tables in CSV format
  • Add pricing and info table widgets

Price: PowerPack licenses start at $44 per year.

6. Exclusive Addons for Elementor

Exclusive Addons for Elementor plugin
Exclusive Addons for Elementor

Exclusive Addons for Elementor comes in both free and premium versions. The free plugin adds 39 new widgets to Elementor, whereas a premium license will net you over 69 new elements.

When it comes to tables, the free version adds a new pricing table module to the mix. With the premium version, you get access to comparison and data tables. Comparison tables work similarly to pricing elements, but you get to use new layouts and styles.

Key Features:

  • Add a new pricing table module
  • Get access to comparison and data tables
  • Access multiple layouts for table widgets

Price: There’s a free version of Exclusive Addons for Elementor. Premium licenses start at $29 per year.

7. JetElements

JetElements addon
JetElements

JetElements adds 45 new widgets to Elementor. Most of them are geared toward ecommerce and subscription websites. However, JetElements also includes several interesting table widgets in its roster.

Among those widgets, you have pricing and responsive tables. Compared to the base pricing tables in Elementor, the JetElements version gives you a lot of new customization options. For instance, you get to play with a lot of visual effects such as parallax and micro animations for table elements.

Key Features:

  • Add pricing and responsive tables to Elementor
  • Customize tables using new visual effects, such as parallax

Price: JetElements all-inclusive licenses start at $130 per year. You can also create custom widget bundles, choosing only the options that you want to use.

8. Premium Addons for Elementor

Premium Addons for Elementor
Premium Addons for Elementor

Premium Addons for Elementor comes in both free and premium versions. However, only the premium plugin adds new table widgets to Elementor.

If you pay for a premium license, you’ll get access to new data and pricing table widgets. You can accompany data tables with chart and graph widgets if you want to display more information for your visitors.

Key Features:

  • Add data and pricing table widgets to Elementor
  • Accompany tables with chart and graph widgets

Price: Licenses for Premium Addons for Elementor start at $39 per year.

9. DataMentor

DataMentor addon for Elementor
DataMentor

DataMentor is a plugin that adds a single table widget to Elementor. However, that widget packs a lot more features than most of the add-ons we’ve seen so far.

DataMentor tables are incredibly versatile. You can add images, buttons, lists, and icons within each element. The widget enables you to create tables with individual styles for each column or row. You also get access to several table templates if you want to kickstart the design process.

Key Features:

  • Add a new table widget to Elementor
  • Get access to multiple table templates
  • Add images, text, buttons, lists, and icons within tables

Price: DataMentor is a free plugin.

10. Happy Addons for Elementor

Happy Addons for Elementor
Happy Addons

Happy Addons for Elementor is one of the most comprehensive plugins for the page builder. This tool adds over 99 widgets to Elementor and a broad collection of new templates to its library.

As far as tables go, Happy Addons includes both basic and advanced table widgets. The advanced version supports imported data in multiple formats, as well as search, filtering, and pagination. Plus, you get access to multiple pre-design table layouts. On top of those options, Happy Addons also includes pricing and comparison table elements.

Key Features:

  • Access to basic and advanced table widgets
  • Import data for advanced ables
  • Use pre-designed table layouts
  • Add pricing and comparison tables

Price: There’s a free version of Happy Addons. Premium licenses start at $39 per year.

11. Royal Elementor Addons

Royal Elementor Addons
Royal Elementor Addons

Royal Elementor Addons adds over 40 new widgets to Elementor. These are all free, but the plugin also comes in a premium version that unlocks additional customization options for each widget.

With Royal Elementor Addons, you get a new pricing table to use in Elementor. This widget includes several new styling options. Plus, it comes with a toggle option that visitors can use to switch between monthly and yearly prices (or other options).

Key Features:

  • Add a new pricing table widget to Elementor
  • Customize pricing tables with new styling options
  • Add a price toggle to your tables

Price: Royal Elementor Addons is free. Premium licenses cost $29 per website (it’s a one-time fee).

12. Elementor Addon Elements

Elementor addon elements plugin
Elementor Addon Elements

Elementor Addon Elements is a free plugin that adds over 24 new widgets to Elementor. Among them, you have options for price, comparison, and data tables.

Price tables include many additional customization options that the default Elementor widget doesn’t. When it comes to data tables, you can choose between creating searchable or filterable elements. Additionally, tables support animations, which can make them a lot more visually engaging.

Key Features:

  • Add price, comparison, and data tables to Elementor
  • Choose between filterable and searchable data tables
  • Add animations to data tables

Price: Elementor Addon Elements is free.

Get ready to learn ✅ how to create Elementor tables manually and ✅ the best plugins to use to ad new table widgets to the editor 🚀Click to Tweet

Summary

Elementor provides you with a broad range of tools to create stylish and complex WordPress tables. A lot of WordPress table plugins are also compatible with Elementor, which means the page builder enables you to add almost any type of table that you want to your website.

The Elementor page builder comes with an intuitive Price Table widget. If you want to add other types of tables, we recommend using Elementor table plugins such as ElementsKit or WP Table Builder.

Kinsta CDN is a high-performance CDN available to all Kinsta customers at no additional cost. It’s powered by our free Cloudflare integration and automatically serves your content from over 200 PoPs across the globe. If you have any questions about Kinsta CDN, feel free to reach out to our 24/7 Support team for further assistance!


Save time, costs and maximize site performance with:

  • Instant help from WordPress hosting experts, 24/7.
  • Cloudflare Enterprise integration.
  • Global audience reach with 34 data centers worldwide.
  • Optimization with our built-in Application Performance Monitoring.

All of that and much more, in one plan with no long-term contracts, assisted migrations, and a 30-day-money-back-guarantee. Check out our plans or talk to sales to find the plan that’s right for you.





Source link