Table Widget for Elementor allows you to easily pull data from Google Sheets then display those Google sheets via Elementor Table Widget within few simple steps.
Now, you can use Premium Table Widget for Elementor to show off and customize your Google Sheets that you want to display on your website. Furthermore, you can edit your Google Sheets without any need to update anything on Elementor Table Widget, as it will automatically update (republish) any changes you made within few minutes after saving the Google Sheet.
Click here to check Premium Table Widget Tutorial and Premium Table Widget demo.
Premium Table Widget For Elementor Page Builder
Search for “Premium Table” widget on Elementor Editor, you will find Premium Table Widget for Elementor.
Google Sheet [Part1]
We are assuming that you already have a spreadsheet on Google Sheets.
So, to add Google Sheets into Elementor Table Widget.
1- First, Go to your Google Sheet file, from the toolbar click on File.
2- Click on [Publish to the web].
3- Select the Google Sheet that you want to add to your Table Widget for Elementor. You can also check if you want to make your Google Sheet automatically republish when changes are made (Recommended) so that any changes happen to your Google Sheet will appear on Elementor Table Widget within few minutes [5-10 minutes] after the changes are saved on Google Sheets.
4- Select the following format [Comma-seperated values (.CSV)].
5- Copy the link from the Google Sheet which appears in “Publish to The Web” popup window to use it in your Elementor Table Widget.
Table Widget For Elementor [Part2]
And now we will move to the next step, you have to do the settings for the Elementor Table Widget to display your Google Sheet on your webpage.
Go to Premium Table Widget -> Content
6- Data Type, Select [CSV File].
7- File Type, Select [Remote File].
8- Data Separator: Use a separator to separate between the data cells. You can write comma [,].
9- File URL: Paste the URL that was copied from your Google Sheet. Refer back to step [5].
10- “Render First Row As” You can select one of two choices either Header or Body.
- Header: Will give the first row a distinctive styling from the rest of the table.
- Body: Will make the first row similar to the rest of the table.
This is how the data pulled from Google Sheets will looks like when you insert it into the Elementor Table Widget.
And this is how the Table Widget for Elementor looks after applying some basic styling. For more details about how to style the Elementor Table Widget, you can check Table Widget Tutorial.
Note: HREFs (links) within Google Sheet will be delivered as a text on Elementor Table template.
