Home › Forums › Feature Requests › Tabs layout option for repeater fields
Repeater fields take up a ton of space in the editor.
Often I’m creating a block for displaying three columns of content. A repeater field is the obvious choice for this, but my clients find tabs a much better user experiencing than scrolling a long wall of repeater fields. A handful of repeater fields containing many fields blend together and can easily make the editing experience confusing. I agree – using tabs saves a lot of space and are easy to get at a glance.
For field groups with many repeater fields, like reviews, a tabbed layout is not the ideal choice, but for a smaller amount of repeater fields, tabs would be a superior option.
Please submit suggestions here https://www.advancedcustomfields.com/contact/
But, as far as using what’s available. When I have a lot of fields in a repeater I actually add tabs in the repeater rows to make things more manageable for the user. I also take advantage of the collapse setting for the repeater and give the user a field where they can enter a description for the row so that they can find the one they are looking for more easily by collapsing them all.
I am attaching a screen shot of an interface I’m currently working on.
Columns on the left is a tab in a flexible content field. On the right there is a “Group” field named “Columns” This group field has it’s own tabs. Then in the “Columns” tab of this group there is a “Columns” repeater field. This repeater has a field that will be shown when the row is collapsed and it also has it’s own set of tabs to split things up and make it easier to manage.
this setup looks really interesting. I like to do something similar:
I want to organize the items of a flexibel content field in this nice layout that do you have on the left side. But I dont figure it out, can you give me a hint?
edit: I want to add the tabs dynamically. I found this https://github.com/JamesParkNINJA/acf-repeater-tabs and i will test it.
This is from a flex field setup.
Each flex layout has tabs at the top and the left are these tabs.
Each of the tabs on the left contains a single group field.
Inside of the group fields are more tabs that are top aligned. Because they are in a group field their alignment in independent of the outer tabs.
The tabs inside the repeater are also independent of other tabs and can be top or left aligned.
This setup can be a little complicated when coding the templates because of all the fields being nested in groups, but I build the admin for the client’s convenience and not my own. Generally a lot of planning goes into how I built the UI to make it as easy as possible to use.
You must be logged in to reply to this topic.
Welcome to the Advanced Custom Fields community forum.
Browse through ideas, snippets of code, questions and answers between fellow ACF users
Helping others is a great way to earn karma, gain badges and help ACF development!
🚀 This week’s session of ACF Chat Fridays dips into the preliminary results of our first ever user survey. Don’t miss it! https://t.co/3UtvQbDwNm pic.twitter.com/kMwhaJTkZc— Advanced Custom Fields (@wp_acf) May 9, 2023
© 2023 Advanced Custom Fields.