Fraud Blocker
  • Home
  • Products
  • Support
  • Blog
  • Contact

Table Of Contents

Table Widget in Elementor

How to Use Table Widget in Elementor

In this documentation, I’ll show you how to use the Table widget in Elementor. This widget holds the opportunity of adding custom code. So, let’s get started.

To Insert Widget

Inserting the Table Widget in Elementor

Inserting the widget is just a matter of dragging and dropping. As you see in the screenshot above, drag the Elementor table widget inside your page.

Content Tab

Using the content tab, you’ll be able to make a layout of a particular part (such as a table) of a website. And in this regard, some handy sections in the tab will assist you a lot in designing the Table Widget in Elementor.


table plugin settings

Go to the Content tab > Table.

This section holds a few controls (Source, Content, Header & Body Alignment, Responsive, etc.). From the Source control, select Custom, CSV File (allow data in a table structured format), or Static.

Most importantly, in the Content control, you can add code custom for the WordPress table.

In addition, from the Responsive control, you can set Responsive 1, Responsive 2, or No Responsive.

Data Table Settings

WordPress table data settings

Simply, go to the Content tab > Data Table Settings.

In this section, you’ll get some switcher buttons(). Just you’ve to activate or deactivate them in accordance with your demand.

Style Tab

Now, let’s work with Style Tab. The tab will confidently have you style the web content (text, image, video, etc.) of the page you require to design with the Table Widget in Elementor. 

Styling with the Style tab in Elementor will always give you a fantastic experience.

Let’s have a look.


Elementor table widget table sstyle

Only, go to the Style tab > Table.

Here, this section will allow you to add Border, Border width and color to around the Table plugin.

1 21 - BdThemes

The is another switcher below called the Leading Column Style that highlights the first column as the leading column over others. Turning on the switcher will pop up another section in the Style tab named Leading Column.

2 17 - BdThemes

This section lets you customize the leading column by color, border, typography, and padding.


tablewidget style 2 - BdThemes

To style the Header part, go to the Style tab > Header.


In this section, you will be able to add border style, border width and cell padding to the body of the table.

Most important thing is that there are three modes (Normal, Hover, and Stripe). In terms of the Normal mode, you may add background, text, and border color.


tablewidget style 3 - BdThemes

And regarding the rest two modes, you can set background color and text color.


tablewidget style 4 - BdThemes


tablewidget style 5 - BdThemes

Simply, go to the Style tab > Body.


There are two modes (Header and Footer). These two modes separately allow you to style the Header part and Footer part. Look at the screenshot below.


tablewidget style 6 - BdThemes


tablewidget style 7 - BdThemes

Just, go to the Style tab > Filter.

Video Assist

In conclusion, though there are various table creating plugins in the WordPress repository, I hope our Table Widget in Elementor will be one of the best solutions for making table. Watch video assist and to get more ideas about the usage of the widget by Element Pack, take a jump into the demo page.

Take advantage of fine-tuned plugins

Get Customizable Elementor Widgets to Power Up Your Website

Take advantage of fine-tuned plugins to speed up web projects without sacrificing quality. We offer a 30-days money-back guarantee.

BdThemes is the sole owner of #1 market-leading addons for Elementor such as Element Pack Pro, Prime Slider, Ultimate Post Kit, Ultimate Store Kit, Pixel Gallery, and more useful plugins.

This website is powered by Element Pack Pro and Rooten Theme.

New Year Sales Are Giving up to ~70% Price Off!! on our products | Coupon: HNY2023

Need any assistance? Call Us:+880 1700 55 95 95

Copyright © 2023 BdThemes. All Rights Reserved.