Block-based store
In this article we will show you what the block-based store is, which page types and blocks you can use, and how drafts, previews and publishing work.
WHAT IS THE BLOCK-BASED STORE?
With the block-based store you build your store from blocks, such as a navigation bar, product shelves, embedded HTML and a footer, without writing code.
With it you can:
- Compose the Home and extra pages yourself, in the order you want.
- Work on a draft, preview it as your visitors will see it, and publish it when it is ready. Your visitors never see half-finished work.
- Change colors, fonts and shapes in one place (the theme).
- Create custom pages with their own address and their own search engine settings, for example for campaigns, authors or landing content.
- Add a pop-up to the Home and a notice to every product page.
You edit all of this in Control Panel > Settings > Interface > Appearance.
THE THREE PAGE TYPES
Every page in your store is one of these three types. The type decides where the page lives and which blocks it accepts.
| Page type | Where it lives | Blocks it accepts | Own SEO settings |
|---|---|---|---|
| Home | Your store catalog, {your_store_domain}/library | Navigation bar, product shelves, embedded HTML, footer and pop-up | Yes |
| Product page | Every product page of the store (one shared page) | Only the product page notice | No (each product provides its own) |
| Custom page | {your_store_domain}/p/ followed by the address you choose | Navigation bar, product shelves, embedded HTML and footer | Yes, plus an option to hide it from search engines |
Your store has one Home and one product page, and it can have as many custom pages as you need. We show you how to create them in Create custom pages and set up their SEO.
THE BLOCK TYPES
| Block | What it does | Where it can go | More information |
|---|---|---|---|
| Navigation bar | The top bar with the logo, search, sign-in and cart. You can use automatic catalog filters or build a custom menu. | Home and custom pages (fixed at the top) | Set up the navigation bar and footer |
| Footer | Social network icons, legal links and the optional regret button. | Home and custom pages (fixed at the bottom) | Set up the navigation bar and footer |
| Product shelf | A row of products picked with filters such as genre, author, year or free titles. | Home and custom pages | Add shelves and embedded HTML |
| Embedded HTML | Your own HTML, styles and scripts, shown as you write them. | Home and custom pages | Add shelves and embedded HTML |
| Pop-up | A message that opens over the Home, with a schedule and a frequency. | Home only | Add a pop-up and a product page notice |
| Product page notice | A short text that shows on the product page of every product. | Product page only | Add a pop-up and a product page notice |
The navigation bar and the footer show a Fixed badge in the block list: you can edit them, but not move them. Their content is shared by every page. On custom pages you can hide them for that page only. The Home always keeps both visible.
THE THEME
The theme controls how your whole store looks:
- Four colors: header and footer, buttons and links, background, and text.
- The fonts and text sizes.
- The shape of cards and buttons: corners, borders, shadows and spacing.
It starts from your store's current colors. You can apply a ready-made theme (Default, Modern, Editorial or Nocturne) and adjust it. The theme has its own editor and its own publish. We explain it in Customize the store theme.
HOW EDITING WORKS
To edit a page, go to Control Panel > Settings > Interface > Appearance and click Edit. It works the same way on every page:
1. Changes save automatically to a draft, a few seconds after your last edit. There is no save button for blocks.
2. A live preview shows the page as your visitors would see it, with the draft applied. The View draft link opens the full draft in a new tab.
3. Publish turns the draft into the version your visitors see.
4. Revert to published version discards the draft and goes back to what is live.
A badge next to the page name tells you where the page stands.
| Badge | Meaning |
|---|---|
| Draft | The page was never published. Your visitors cannot see it. |
| Unpublished changes | The page is published, and the draft has changes that your visitors do not see yet. |
| Published | The draft and the live version match. A link to view the page replaces the badge. |
You will find the step-by-step guide in Edit and publish a page in Appearance.
WHAT EACH CHANGE NEEDS TO REACH YOUR VISITORS
Not every change goes through Publish. Check this table if you made a change and your store looks the same.
| Change | What makes it reach your visitors | When |
|---|---|---|
| Blocks of a page (navigation bar, shelves, embedded HTML, footer) | Publish on that page | After publishing |
| Product page notice | Publish on the product page | After publishing |
| Pop-up | Its own publish, in the pop-up editor (you must publish the Home once first) | After publishing |
| Theme (colors, typography, shape) | Publish theme, in the theme editor | After publishing |
| SEO title, SEO description and Open Graph image | Save on the page settings | Immediately |
| Regret button | The switch saves by itself | Immediately, but visitors see it only once your store is live on blocks |
| Adult content exclusion | The switch saves by itself | Immediately |
⚠️ Only the first publish of the Home takes your store live on blocks. Until you publish the Home, your visitors keep seeing the previous store, and custom pages show as "not found". Publishing the Home does not publish the theme: remember to publish it too.
💡 In the meantime you can edit and preview at your own pace: your visitors notice nothing until you publish the Home.
WHAT KEEPS WORKING
The block-based store keeps your store's tracking, support and cookie consent features.
| Feature | How it behaves on blocks |
|---|---|
| Google Tag Manager (store container) | Loads when you fill in the container ID in Settings > Marketing and your store has the Google Analytics connection. When the cookie banner is on, it waits for the visitor to accept analytics. |
| Google Analytics and Facebook Pixel | Load when configured, under the same consent rule. |
| Support chat | Stays on by default, as before. It does not appear on checkout, cart or billing pages. |
| FAQ flyout | Shows the floating FAQs button when you turn it on in Settings > Advanced. |
| Cookie consent | The banner and badge load when your store has the feature on. |
| Google Search Console verification | The tag keeps showing from Settings > Marketing. |
💡 Tracking also loads in the editor preview and the draft preview, so your editing sessions can show up in your analytics.
WHAT DOES NOT CARRY OVER
| Item | What happens on blocks |
|---|---|
| Custom CSS | Not shown. |
| Custom header code and custom footer code | Not shown. Only the Google Search Console tag is kept. |
| Custom support code (the chat code that replaces the default support chat) | Not shown. The store uses the default support chat instead. |
| Legacy widgets placed above the header | Not converted. On blocks there is no space above the navigation bar. |
| Legacy template and shelf colors | Ignored. The theme replaces them. |
If you relied on custom code, you will need to rebuild that part with blocks, the theme or embedded HTML. Customize the store theme and Add shelves and embedded HTML will help you.
⚠️ When your store moves to blocks, the previous shelves, menu and widgets screens are locked and everything is managed from Appearance.
FREQUENTLY ASKED QUESTIONS
Do I need to know how to code? No. Embedded HTML is optional, for those who want to paste their own code.
Can I try it without my visitors noticing? Yes. Once the feature is enabled, your visitors keep seeing the previous store until you publish the Home. In the meantime you can edit and preview.
Why does my store look the same after I published? Check which change you made. The theme and the pop-up publish separately, and SEO and the Open Graph image apply when you click Save. See the table above.
Does the regret button appear automatically for Argentine stores? No. It is off for every store and you turn it on in the footer editor. Its helper text says it is required in Argentina by Resolución 424/2020.
Is there a limit on shelves or custom pages? The editor does not set a maximum number of shelves, blocks or custom pages. Each shelf shows up to 8 products, and the page loads shelves in groups as the visitor scrolls (3 first, then 5 more each time).
Can I go back to the previous store? Write to us at [email protected] and we will look at it together.
RELATED ARTICLES
- Edit and publish a page in Appearance
- Set up the navigation bar and footer
- Add shelves and embedded HTML
- Customize the store theme
- Create custom pages and set up their SEO
- Add a pop-up and a product page notice
We hope this tutorial has been easy for you. If you have questions, write to us at [email protected].