Adding blocks with tabs

Tabs are useful for organizing chunks of related information into a single block, thereby freeing space on a page. With this feature, you can structure the pictures in a gallery by general topics, organize your company's products and services, and much more.

Devellp editor allows you to add a pre-made block with tabs or enable tabs mode in some of the existing blocks.

• Here's a good example of block with tabs:

Adding a block with tabs

• To add a block with tabs, open the blocks gallery and choose a suitable block with tabs:

• Hover over the content of the block and click on the "gear" to access the Collection settings. In the pop-up window, navigate to the Modes tab and choose the type, quantity, and alignment of your tabs:

Enabling the tabs mode in a collection

Some blocks in our gallery can contain a set of entirely interdependent elements gathered in a collection. Each item in a collection keeps the same layout as others — if you delete an element from one item in a collection, it will be automatically deleted from every item.

The collection blocks can be re-structured into tabs.

• For that, hover over the collection item and click on the "gear" in the top right corner to access its settings:

• In the pop-up window, navigate to the Modes tab and enable the Tabs option:

• Here you can change the type, quantity or alignment of your tabs, and also set the accent color:

Managing tabs and their content

• To rename a tab, click on its name, highlight it and add a new one:

• To access the tabs settings, hover over the collection element and click on three stripes icon:

• In the new window, you can drag the tabs to change their order, duplicate, delete or hide them:

• To move elements within one tab, hover over the element and drag it to the desired position:

Don't forget to publish your site for the changes to appear live.

Updated on: 04/14/2023