Getting Started with Theme Studio
A quick guide to get you up and running with the Builder Theme Studio
Builder's Theme Studio for Shopify allows you to customize, optimize, and re-imagine your Shopify storefront. No coding required. Theme Studio works with any and all themes and enables you create the storefront of your dreams.
Using our powerful drag-and-drop editor, you can create and edit any type of content, whether you're looking to optimize they key parts of your shopping funnel, like product and cart pages, or feature an upcoming launch or promotion across all your pages.
Publishing directly from Theme Studio, you can optimize your content and experiences with targeting, A/B testing, and see detailed analytics and heat maps to measure performance and show how visitors are engaging with your storefront.
How does Builder work?
To use Builder, first decide what parts on your site should be controlled by Builder vs. hard coded in your site or application. There are two main ways you can do this:
- Visual pages - full drag and drop control between your site's header and footer
- Visual sections - make a part of a page visually editable in Builder and use our targeting and scheduling to decide who sees what
Structuring your site
One of the easiest ways to get started is to add landing page building to your site. Once you have that, you can start adding editable sections across your site, and use targeting to choose the right content for the right users
Here are some examples we recommend for how to structure various pages on your site
Extending with code
- An account with Builder
- An account with Shopify
- If you haven't already, create a store in Shopify
- Add the Builder.io Theme Studio app to your Shopify store
Once you have the Theme Studio app installed in your Shopify store, you're ready to get started!
Now that you are in Theme Studio you can explore all it has to offer! You can either navigate your storefront in the preview pane on the right or in the sidebar on the left.
Click the page or section you want to add or modify and either select +Create or View all.
The first time you edit any page or element, you will be presented with a set of options
For example, if you were to create a new homepage, you could choose to to either:
- Create a new homepage
- Add an editable section to your existing homepage
Next, you'll select who should be able to see this new page or section
- Select visitors based on targeting
Once you confirm your choices, you're ready to start building!