Add table slice with dynamic amount of rows and columns

Issue that it solves: Having to add raw html, embed a third party table, or create a new slice for every table that needs a different amount of rows and columns thus, speeding up the content creation process as the people working on the content can just add a table of their own without having to contact the dev team to create it for them.

2 Likes

Hello @calvinpierce99, thanks for reaching out.

You can create your own Table Slice. Here's a guide to learning how to do it:

Hello,
The suggested solutions from the FAQ are not helpful in my case.

  1. Slice with repeating fields - Does not allow dynamic adjustment for adding columns when more are needed.
    Variants 2 and 3 are omitted, since the content should only be editable via Prismic.

One Solution would be: Allow the usage of "Group - a repeatable group of fields" in "Repeatable zone"

Example:
We want to create a slice called "Size Table" for article data. The size table can appear multiple times on a page, but with more or fewer columns or rows. The number varies depending on the item variant.

Hello @marpei!
Do you have a visual representation of your use case?
Also, are you using Slice Machine or the Legacy Editor?

I'm using the legacy editor.

Example given from the current case:

This is the prismic configuration for the slice. It allows me to use the repeatable zone to add Rows for the given table structure (that the "header" parts in the non-repeatable zone aren't really necessary, because i could also add them in the repeatable zone below).
Notice, that there are 6 columns, because they have to be set.

The slice from above gives me the opportunity to add unlimited rows to my table, but i'm still unable to add dynamically more columns to that table!

Example preview of the used data from prismic. The case which would require more columns:
The first table should have one more column with another title, e.g. "ab 500 Stk.", and other prices below. That is currently unable to create dynamically in prismic.

For more complex use cases like yours, I recommend using a Custom Type dedicated solely to the table. This way, you can create a Slice with the non-repeatable zone as the row name, and the repeatable zone for all the options you need to add. This way, the header row can also be a single Slice at the beginning of the document.