How to Create Tables in WordPress Using the Block Editor, Plugins, and External Sources

[ad_1]

With over a billion active websites today, providing users with a positive experience is crucial to stay competitive. One effective way to achieve this is by optimizing your website’s content readability.

Tables greatly improve information readability, especially if your WordPress site has long paragraphs and complex data. They offer an efficient way to organize and display data, making it easier for users to navigate and understand.

This article will guide you through the step-by-step process of creating tables in WordPress, providing insights into various plugins and methods. Discover the benefits of using tables on your WordPress site and how to effectively leverage them.

How to Add Tables in WordPress

There are three ways to create tables in WordPress ‒ using the block editor, installing table plugins, or importing tables from external sources. We’ll explore these three methods in detail, so feel free to choose the one that best suits your needs.

How to Create Tables in WordPress Using the Block Editor

The default Gutenberg block editor is more than enough for creating simple WordPress tables. With the table block, you can add tables directly from the editor to WordPress posts and pages.

Here are the steps for creating a table in WordPress using the block editor:

  1. Log into your WordPress dashboard and head to Posts Add New.
  2. Once you’re redirected to the content editor, hit the (+) symbol and select the WordPress Table block.
Adding a block for tables to a post in the Gutenberg editor.
  1. Enter the number of rows and columns and hit Create Table. You can add more or remove rows and columns later.
Setting the number of table rows and columns in WordPress.
  1. As you populate the table with data, WordPress will automatically resize the cells accordingly. If you prefer the table cells to have a fixed width, toggle the Fixed width table cells setting in the sidebar. You can also activate the header and footer sections if needed.
The settings of the WordPress table element highlighted.
  1. To change the table’s layout, move your cursor to the desired cell and select Edit Table in the block toolbar. You can insert or delete rows and columns before or after the appointed cell.
WordPress Edit Table setting highlighted.
  1. Open the Styles tab in the sidebar and adjust the settings for Styles, Colour, and Typography. Align the table’s style with your website’s design and color scheme for consistency. Other table settings, like column alignment and text styles, are available in the block toolbar.
Modifying the table's styles in WordPress.

Although this is the easiest method, it doesn’t create mobile-friendly tables. When a table exceeds the visible area on mobile devices, WordPress adds a horizontal scroll bar below it.

Moreover, tables created with the Gutenberg editor lack advanced features such as custom sorting, filtering, and visualization.

For more features and customization, check out the other methods using a WordPress table plugin or importing from external sources.

How to Add Tables in WordPress Using a Plugin

WordPress table plugins offer advanced features for creating complex tables with ease. They also support advanced customizations, making styling tables in WordPress simpler.

Choosing the right table plugin for WordPress can be difficult. Luckily, we have compiled some of the best WordPress table plugins to narrow your search:

  • Ninja Tables ‒ supports various types of SEO-friendly table templates.
  • WP Table Builder ‒ provides a drag-and-drop table builder with a cell management mode.
  • TablePress ‒ a popular freemium plugin that lets you create and manage tables in a spreadsheet-like interface.
  • Easy Pricing Tables ‒ best for creating responsive tables in WordPress eCommerce sites.
  • Visualizer ‒ offers responsive and animated charts with cross-browser compatibility.

Looking for More Options?

Explore other recommended table plugins for WordPress, along with their notable features and pricing. All plugins listed on our list are compatible with the latest WordPress version and well-maintained by their developer team.

The following tutorial will show you how to create a table in WordPress using the free version of TablePress:

  1. Install and activate TablePress from your WordPress dashboard. Use other plugin installation methods if you don’t have access to the admin area.
  2. Head to TablePressAdd New, then enter all the necessary information to create a new table. Hit Add Table.
Adding a new table using the TablePress free plugin.
  1. Once the table is ready, start populating it with data. Add column titles to the first row of the table and fill the rest of the cells with content. Check the Table Head Row option to convert the table’s first row as a header.
TablePress' Table Head Row setting highlighted.
  1. Select the arrows above the table columns to sort your data alphabetically or numerically.
TablePress' sorting function highlighted.
  1. The Table Manipulation section contains commands to change the table’s layout. You can also hide, merge, and add rows, columns, as well as links.
The Table Manipulation section in the TablePress plugin.
  1. The Table Options section contains additional table customization settings. Here, you can set the header and footer area, change the background color, and add custom CSS for styling.
The Table Options section in the  TablePress plugin.
  1. The Table Features for Site Visitors section lets you have an interactive table, allowing users to sort, filter, and change the number of rows shown. Consider enabling these features to enhance your data’s readability and overall user experience.
The Table Features for Site Visitors section in the TablePress plugin.
  1. Once you’re done customizing the table, select Save Changes.
  2. Copy the shortcode in the Table Information section and head to the WordPress editor. Paste the shortcode in your chosen post or page using the shortcode block, and save the changes.
Embedding the table on a page or post using the shortcode block.
  1. Here’s what the table looks like:
The preview of a table made with the TablePress WordPress table plugin.

Improve User Experience Even Further

Deliver an even better user experience by switching to Hostinger’s managed WordPress hosting. All plans include WordPress auto-updates, LiteSpeed Cache, and WooCommerce optimization.

How to Insert Tables in WordPress From External Sources

The previous methods work for tables with small datasets. If you work with larger amounts of data, importing from another source can save you time. This method allows you to utilize other platforms for data processing and collaboration, boosting productivity and efficiency.

Instead of replicating the table manually, you can compile the data on your preferred platform and display it on your WordPress site. Here’s how to import an existing table from Google Sheets to WordPress:

  1. Open your spreadsheet and select File Share Publish to web.
  2. Switch to the Embed tab and choose whether to import the entire spreadsheet or a specific sheet. Check the automatic republish setting under the Published content and settings section, then hit Publish.
Publishing a Google spreadsheet.
  1. Google Sheets will generate an iFrame code to embed the table. Copy this code and navigate to your WordPress dashboard.
The iFrame code by Google for embedding purposes is highlighted.
  1. Open the page or post where you want to display the table and add the code using the Shortcode block.
Adding the iFrame code to WordPress editor using a shortcode block.
  1. If you want to customize the table size, add custom HTML code before the closing tag. The following code snippet sets the table’s dimensions to 400 px wide and 200 px tall. Keep in mind that text formatting, like size and color, should be done in the spreadsheet.
<iframe src="https://docs.google.com/spreadsheets/d/e/2PACX-1vTbZsvBh0jBXvvK9OqTMCPrenDypmzp9BGS5SpflYkqhE7DHO7mOF4IairkGoKgFoG0v6BMTgaML-Z_/pubhtml?widget=true&amp;headers=false" style="height:200px;width:400px"></iframe>
  1. Once you’re done, click Update. Here’s what our imported table looks like:
Google table preview in WordPress using the iFrame method.

While this method saves you the trouble of installing a WordPress plugin, it doesn’t support live data updates. If the data in the spreadsheet changes, you will need to republish the WordPress data table.

With most WordPress table generators available today, you have the option to import datasets from multiple sources, including direct upload and URL. Here’s how to upload a table in CSV format to WordPress using the TablePress plugin:

  1. Head to TablePress Import a Table from your WordPress dashboard.
  2. Select File Upload as the import source and drag and drop your table file to the available field. Hit Import.
Import data from a CSV file using TablePress.
  1. Adjust the settings in the Table Options and Table Features for Site Visitors sections as needed and click Save Changes.
  2. Copy the table’s shortcode and place it anywhere on your site using the Shortcode block.

The free version of TablePress doesn’t support live data updates. Consider upgrading to Pro for $79/year to get this functionality, which makes maintaining dynamic tables much easier. You can also get other premium features, like individual column filtering and automatic table export.

Why Use Tables in WordPress?

Tables in WordPress are a powerful tool for improving the functionality and user experience of your website. Here are some common reasons why you should consider embedding tables:

Enhanced Content Readability and Organization

Tables provide a clear structure for presenting information, making complex ideas visually appealing and easier to digest.

Easy Comparison and Data Analysis

The structured layout of tables makes it easier to identify patterns, differences, and relationships within data. They allow readers to quickly analyze and draw conclusions from the data.

Better Visual Appeal and Structure

Tables break up text and make articles appear more organized, making your content more engaging and professional.

Where Can WordPress Tables Be Used?

Here are examples of where WordPress tables can benefit you.

Pricing Tables for eCommerce or Service-Based Websites

Pricing tables in eCommerce sites allow customers to quickly compare products and make informed purchasing decisions. Similarly, service-based websites can use pricing tables to showcase different service packages to educate clients and promote transparency.

In both cases, tables enhance user experience, encourage conversions, and foster trust by presenting product pricing in an organized and accessible manner.

For example, Hostinger uses tables to compare the pricing of our hosting services. Here’s what the pricing table for shared hosting plans looks like:

Hostinger's pricing table for shared hosting services.

Product or Feature Comparison Tables for Businesses

Comparison tables in WordPress offer users an efficient way to evaluate multiple options side by side, helping them make informed choices based on their needs and preferences.

This type of table simplifies the decision-making process, minimizes decision fatigue, and enhances the overall user experience.

Whether you’re selling products or services, this WordPress table formatting can highlight key features, pricing, and benefits to improve user satisfaction and conversion rates.

Here’s an example of a comparison table for Hostinger’s cloud hosting services:

Hostinger's comparison table for cloud hosting services.

Data Tables for Presenting Statistics or Research Findings

Data tables provide a structured format that makes complex information like scientific research, survey results, or market data easy to understand. This type of table helps visualize trends and key insights, allowing users to conclude and make decisions based on the processed data.

Here’s an example of a data table in hPanel presenting access logs:

Hostinger's data table for access logs.

Conclusion

Optimizing content readability is crucial for a positive user experience. Tables are essential to content readability as they simplify data presentation and analysis, enhance visual appeal, and facilitate information scanning.

Let’s recap the three effective ways to create WordPress tables:

  • Using table tools in the Gutenberg block editor.
  • Using a table builder plugin.
  • Importing tables from external sources.

We hope this article helps you better understand how to create tables in WordPress. If you still have questions, check out our FAQ section or drop them in the comments section below. Good luck!

Tables in WordPress FAQ

This section answers some of the most common questions about embedding tables in WordPress.

How Can I Create Tables in WordPress Without a Plugin?

You can import tables from external sources or use the Table block in the WordPress block editor. Keep in mind that using a plugin may offer more customization and advanced functionality.

Can I Customize the Appearance of Tables in WordPress?

The WordPress table customization tools are available in the block editor. If you insert tables from external sources in iFrame format, you can add HTML style attributes to the code to resize them. Meanwhile, plugin-based tables can be customized through the plugin’s settings.

Why Is My Table Not Displaying Correctly in WordPress?

Table display issues in WordPress can result from HTML errors, plugin or theme conflicts, or theme limitations. To fix this issue, check the table’s code for errors, deactivate conflicting plugins, or consider a theme better suited for tables.

[ad_2]

Jaspreet Singh Ghuman

Jaspreet Singh Ghuman

Jassweb.com/

Passionate Professional Blogger, Freelancer, WordPress Enthusiast, Digital Marketer, Web Developer, Server Operator, Networking Expert. Empowering online presence with diverse skills.

jassweb logo

Jassweb always keeps its services up-to-date with the latest trends in the market, providing its customers all over the world with high-end and easily extensible internet, intranet, and extranet products.

Contact
Jassweb, Rai Chak, Punjab, India. 143518