Documentation
Feedback
Guides
Storefront Development

Storefront Development
Store Framework
Building pages

Discover how to leverage Store Framework to build various types of pages tailored to your business needs.

Store Framework streamlines page creation by offering a set of pre-built components and development tools. These resources simplify building and customizing different page types, such as product details pages, promotional layouts, and custom pages.

This section covers a range of page-building scenarios, and each guide focuses on practical implementation, ensuring you can effectively develop pages that meet your business needs.

Before you begin

Develop your Store Theme

Make sure your store has a Store Theme developed following the Getting Started tutorial.

Check the builders

Check if the builders are properly installed in your Store Theme. To use builders, your account must have at least version vtex.builder-hub@0.293.4 installed. Also, you need to specify them in the app's manifest.json file. Learn more in Builders.

Make sure the store builder is configured, as it enables the development of Store Framework storefronts.

Learn about VTEX IO apps

Familiarize yourself with VTEX IO apps.

Essential concepts

To better understand how to build your store pages, you should understand the concepts of components and templates.

Components are building blocks created using the VTEX IO development platform and React technology, which are used to create storefronts and admin apps.

Learn more in the Components guide.

A template refers to the structural layout of your site pages. Templates define the components for various pages, such as the home, product, and search results pages, by declaring json blocks that render these components.

Learn more in the Configuring templates guide.

Guides in this section

Building a product details page
Discover how to create a product details page for your store.
Building a search results page with multiple layouts
Learn how to create search result pages leveraging our VTEX IO apps.
Creating a Black Friday page from template
Explore our templates to create promotional pages.
Creating a custom search results page
Learn how to customize your search results page and enhance user interaction.
Creating a new custom page
Understand the process of building a custom page that meets specific business needs.
Customizing the Header and Footer blocks by page
Discover how to optimize your site’s navigation by customizing header and footer blocks by page.
Creating an institutional page with Content types
Learn how to create an institutional page using various content types.
Contributors
2
Photo of the contributor
Photo of the contributor
+ 2 contributors
Was this helpful?
Yes
No
Suggest edits (Github)
Contributors
2
Photo of the contributor
Photo of the contributor
+ 2 contributors
On this page