Visual CMS

Drag-and-drop visual editor and headless CMS for any tech stack

Theme Studio for Shopify

Build and optimize your Shopify-hosted storefront, no coding required



Get StartedLogin






Made in Builder


The layers tab gives you an overview of every element on your page. You can add, remove, and rename elements in the layers tab. You can also view which layers are nested or have an animation, action, binding, event, etc.

Renaming layers

To rename a layer, double click on the layer and enter in the new name. Naming layers is helpful because you can give your element a more useful name (e.g. instead of section or box). This way you can browse over the layers tab and have a better idea of what each layer contains/is. 

Nested layers

 A nested element is a child element inside of a parent container. An element with nested elements will have an arrow next to it that shows all nested layers.

Animations, actions, and events

If an element has an animation, action, binding, event, etc. it will have an icon next to it in the layers tab.

Adding, deleting, and moving layers

In the example below, the element is selected from the insert tab and hovered over the layers tab. From here, you can add the element wherever you'd like it. To nest an element, hover the element where you'd like to place it. There are blue lines that appear to show you where you are placing the element and whether you're nesting it or not.

Up Next

Shopify FAQ
Was this article helpful?