Typing a long price list or product list cell by cell into Elementor takes time and invites mistakes.
The CSV File source of the Table widget from The Plus Addons for Elementor reads a CSV file and shows it as a table. Update the file and the table follows.
To check the complete feature overview documentation of The Plus Addons for Elementor Table widget, click here.
Requirement – This widget is a part of The Plus Addons for Elementor, make sure it’s installed & activated to enjoy all its powers.
Before You Start
- Edition: Pro — The CSV File source needs The Plus Addons for Elementor Pro. The Table widget itself is free.
- Widget to enable: Table, switched on under The Plus Addons > Widgets.
- A CSV file that uses a semicolon (;) between columns.
Step 1: Prepare the CSV File
- The first line is the header row; every following line is a table row.
- Separate the columns with a semicolon. A comma-separated file is shown as one single column.
- Wrap a value in double quotes if it contains a semicolon itself, for example
"1 website; email support". - Save the file as UTF-8 so accented letters and currency signs show correctly.
Example:
Product;Category;Price
Wireless Mouse;Accessories;29
Desk Lamp;Office;35
Many spreadsheet apps export commas by default. Choose semicolon as the separator when you export, or replace the commas in a text editor before you upload the file.
Step 2: Upload the File and Connect It
- Upload the CSV file in Media > Add New Media File and copy its File URL.
- Add the Table widget. In Content > Table, set Content Table to CSV File.
- Paste the address into Enter a CSV File URL.
On the page, the file becomes a normal table. Search and sorting work too:
How It Behaves
- The file is read again every time the page is shown, so changes to the file appear on the next page view.
- A value that contains a web address is turned into a link.
- HTML in the file is shown as plain text, not as formatting.
- Table Searchable, Table Sortable, Entry Filter Dropdown and the vertical scrollbar work with CSV data.
Limitations
- The address must end in .csv. Anything after it, such as
?v=2, shows “Opps!! Please Enter Only CSV File Extension.” on the page. - A wrong or missing file shows nothing. In our test a file that did not exist left an empty table with no message, so check the page after changing the URL.
- Numbers are sorted as text (119 before 29) when Table Sortable is on.
- With One by One Responsive, stacked rows on phones do not show the column names.
- Per-cell icons, images, buttons and tooltips are not available; the Icon / Image style options do not apply.
- Your server must be allowed to open the file URL. If the host blocks that, the table stays empty.
Troubleshooting
Everything is in one column
The file uses commas. Save it again with semicolons between the columns.
The table is empty
Open the file URL in your browser to check that it exists, and make sure the address ends in .csv.
