Jump to Content
VTEX Developer PortalAPP STOREBECOME A PARTNERRELEASESHELP CENTERLEARNING CENTERFEEDBACKCOMMUNITY
VTEX IO GuidesRelease Notes
APP STOREBECOME A PARTNERRELEASESHELP CENTERLEARNING CENTERFEEDBACKCOMMUNITYLog InVTEX Developer Portal
Log In
VTEX IO GuidesRelease Notes

Hello

  • Welcome
  • Frequently asked questions
  • Other resources
  • Contributing
  • VTEX Community
  • Learning Center
  • GitHub
  • Release Notes

Getting Started

  • Overview
  • What is VTEX IO
  • What is VTEX Store Framework
  • What is a VTEX App
  • Storefront
    • 1. Setting up your development environment
    • 2. Configuring your account
    • 3. Setting your store's theme
    • 4. Configuring templates
    • 5. Defining styles
    • Making your theme content public
    • 6. Building your own store theme
  • Storefront apps
    • 1. Setting up your development environment
    • 2. Creating the new app
    • 3. Declaring a theme block
    • 4. Defining styles
    • 5. Structuring documentation
    • 6. Consuming data
    • 7. Translating the component
    • 8. Improving performance with caching
    • 9. Making your app publicly available
  • Pixel apps
    • 1. Setting up your development environment
    • 2. Cloning the boilerplate repository
    • 3. Configuring your app settings
    • 4. Writing the header and body scripts
    • 5. Listening to store events
    • 6. Structuring the documentation
    • 7. Making your Pixel app publicly available

Reference

  • Overview
  • Concepts
    • Billing Options
    • Builders
    • Clients
    • CMS
    • Composition
    • Dependencies
    • Edition App
    • Interfaces
    • Manifest
    • Peer Dependencies
    • Pixel app
    • Policies
    • Properties
    • Roles
    • Routes
    • Service
    • Site Editor
    • Slots
    • Sponsor Account
    • VTEX IO CLI
    • VTEX Resource Name (VRN)
    • Workspace
  • VTEX IO CLI
    • Installing the VTEX IO CLI
    • Updating VTEX IO's CLI
    • Uninstalling VTEX IO's CLI
    • Using VTEX IO's CLI
    • Managing plugins
    • Command reference
    • Changelog
  • GraphQL APIs
    • Overview
    • Rewriter

Storefront Guides

  • Overview
  • B2B setup
    • Segmenting the search result
    • Access Control List
    • Configuring a B2B environment
    • Installing B2B Easy Set Up
    • Installing the B2B Store Theme
    • Customizing the B2B Store Theme
    • Querying B2B order statuses
  • Storefront development
    • Building a Carousel using Slider Layout
    • Building a horizontal Product Summary
    • Building a Shelf
    • Collecting user session data
    • Cleaning cart data on log out
    • Configuring custom images for the SKU Selector
    • Creating a native form for your store users
    • Creating a product availability form
    • Creating modals using icons
    • Customizing the Header and Footer blocks by page
    • Improving filter navigator experience
    • Rendering a badge on top of a product
    • Using events to trigger side effects on store components
    • Using Flex Layout
    • Using Sandbox blocks
    • Using the Assets Builder
  • Cross-border stores
    • Checking your store's binding id
    • Creating robots files for cross-border stores
    • Cross-border store content internationalization
    • Indicating alternate versions of localized pages in cross border stores
    • Managing landing pages in cross-border stores
  • Google Tag Manager
    • Installing Google Tag Manager
    • Setting up Google Tag Manager
    • Migrating Google Tag Manager app from major 2.x to major 3.x
  • Internationalization
    • Disabling automatic translation
    • Internationalizing product prices
    • Translating storefront content
    • Translating Catalog content
    • Overwriting the Messages app
  • Pages and routing
    • Associating a custom page to a content type
    • Building a Product Details Page
    • Building a search results page with multiple layouts
    • Creating a custom search results page
    • Creating a Black Friday page from template
    • Creating a new custom page
    • Enabling 404 pages
    • Managing URL redirects
    • Using several service workers in your store
  • Performance
    • Deactivating the VTEX IO native service worker
    • Debugging performance issues
    • Displaying asynchronous prices
    • Enabling the Order Form optimization
    • Getting started with Lighthouse performance audit
    • Safely enabling performance settings
    • Tracking changes in Lighthouse performance score
    • Lazy loading components
  • SEO
    • Setting up Google Analytics search tracking
  • Styling
    • Contributing with new CSS Handles
    • Customizing your store's icons
    • Customizing your store’s typography
    • How to Interactively Inspect Blocks on a Store Framework Store
    • Using CSS Handles for store customization
    • Using the Markers prop to customize a block's message
  • Migrating CMS settings after a theme major update

App Guides

  • Overview
  • A/B tests
    • Running A/B tests
    • A/B testing Legacy and IO store versions
  • Edition Apps
    • Becoming a Sponsor Account
    • Configuring an Edition App
    • Updating Edition apps
    • Seller Portal Edition App
  • Deploy
    • Creating a Production workspace
    • Deprecating an app
    • Making your new app version publicly available
    • Promoting a workspace to Master
    • Publishing an app
    • Releasing a new app version
  • Local development
    • Creating a Development workspace
    • Installing an app
    • Listing an account’s apps
    • Linking an app
    • Managing application logs
    • Running IO scripts in non-IO VTEX stores
    • Creating a Development workspace for a Legacy CMS store
  • Services
    • Connecting to VTEX Core Commerce APIs
    • Developing service configuration apps
    • Managing Clients
    • Receiving Catalog Changes on VTEX IO
    • Receiving Order Notifications
  • VTEX App Store
    • Becoming a registered VTEX App Store developer
    • Developing an app
    • Setting your app's billing model
    • Preparing your app for distribution
    • Submitting your app to the VTEX App Store

Store Framework Apps

  • Overview
  • Basic components
    • Add To Cart Button
    • Autocomplete
    • Banner
    • Breadcrumb
    • Footer
    • Google One-Tap Login
    • Header
    • Locale Switcher
    • Login
    • Menu
    • Minicart
    • Order Placed
    • Product Customizer
    • Product Highlights
    • Product Identifier
    • Product List
    • Product Price
    • Product Quantity
    • Product Specifications
    • Product Summary
    • Product Summary Attachment List
    • Product Summary Buy Button
    • Product Summary Description
    • Product Summary Image
    • ProductSummaryList
    • Product Summary Name
    • Product Summary Shelf
    • Product Summary SKU Selector
    • Product Summary SKU Name
    • Rich Text
    • Search
    • Suggestions
    • DidYouMean
    • Search Result
    • Store Image
  • Store Components
    • Autocomplete Result List
    • Availability Subscriber
    • Back To Top Button
    • Image
    • Info Card
    • Logo
    • Notification
    • Product Brand
    • Product Description
    • Product Images
    • Product Name
    • Product SKU Attributes
    • Search Bar
    • Share
    • Shipping Simulator
    • SKU Selector
  • Advanced components
    • Availability Notify
    • Category Menu
    • Kit Look
    • Icon Pack list
    • Iframe
    • Live Shopping
    • Product Availability
    • Product Comparison
    • Product Gifts
    • Product Highlight by VTEX Segment
    • Product Recommendation
    • Quantity On Cart
    • Reviews and Ratings
    • SafeData
    • Seller Selector
    • Similar Products Variants
    • Store Drawer
    • Store Locator
    • Store Form
    • Store Link
    • Store Media
    • Store Newsletter
    • Video
    • VTEX IO Sandbox Component
    • VTEX Product Specification Badges
    • Wishlist
  • B2B components
    • Organizations
    • Admin Organizations
    • Organizations Challenge
    • Challenge Trade Policy Condition
    • Location Availability
    • Order Configuration
    • Order Quote
    • Quickorder
    • Shopper Location
    • SKU List
  • B2B Suite
    • Storefront Permissions
    • Storefront Permissions UI
    • B2B Organizations
    • B2B Checkout Settings
    • B2B Orders History
    • B2B Quotes & Carts
  • Functional Apps
    • AB Tester
    • Checkout UI Custom
    • Checkout UI Settings
    • Product Context
    • Responsive Values
    • Store Icons
    • Store Sitemap
    • VTEX Telemarketing
  • Layout Apps
    • Condition Layout
    • Disclosure Layout
    • Flex Layout
    • Modal Layout
    • Overlay Layout
    • Responsive Layout
    • Slider Layout
    • Stack Layout
    • VTEX Sticky Layout
    • Tab Layout
  • Pixel Apps
    • accessiBe
    • Alexa Certify
    • Audara
    • Bazaarvoice
    • Bluecore
    • Blueknow app
    • BTG360
    • Cookiebot
    • Cookie Script
    • Curbside Pickup
    • CyberSource Fingerprint
    • Elfsight
    • Facebook Business Extension
    • Facebook pixel
    • Facebook Domain Verification
    • Flixmedia
    • Google Adwords
    • Google Customer Reviews
    • Hotjar
    • Idea CRM
    • Iubenda
    • JivoChat
    • Kelkoo app
    • Listrak
    • LogRocket
    • Lucky Orange
    • PowerReviews
    • Search Console
    • Shareasale
    • Sidecar pixel app
    • smarthint
    • Speech to Text Search
    • Suiteshare
    • Tawk.to
    • TikTok for Business
    • Trustpilot
    • Wordpress Integration
    • Yotpo
    • Zendesk Chat
    • Zopim
  • My Account - StoreV2 version
    • My Account Commons
    • My Authentication
  • Deprecated
    • Animation
    • Buy Button
    • Categories Highlights
    • Collection Badges
    • Container
    • Discount Badge
    • Gradient Collapse
    • Greeting
    • Newsletter
    • Product Highlights
    • Product Price
    • Product Specifications
    • Product Specification Badges
    • Product Summary Brand
    • Product Summary Price
    • Shelf
    • Slider
    • VTEX Product Kit

Perks

  • Overview
  • Best practices
    • Developing custom storefront components
    • Installing apps on live stores
    • Optimizing performance
    • Rendering images
  • App Store Guidelines
    • App monetization
    • Marketing guidelines
    • User Experience guidelines
    • Engineering best practices
  • Troubleshooting
    • Development
    • Production

Storefront

[email protected]

Suggest Edits

Updated 7 months ago


What’s Next
  • Basic setup to develop in VTEX IO
  • Setting your store's theme
  • Configuring templates
  • Defining styles
  • Making your theme content public
Did this page help you?