# Palo Alto theme documentation Welcome to Palo Alto theme by Presidio Creative ### Exceptional design and powerful features to elevate your brand Experience a world of elegance with Palo Alto’s exquisite design quality and fluid animations. The meticulous attention to detail and harmonious visual elements create an immersive, aesthetically pleasing environment that captivates visitors and highlights the uniqueness and appeal of your products.\ Palo Alto places a strong emphasis on promotions. It includes promotion-focused sections, newsletters, and pop-ups, along with strategically positioned ads on your home page, within collections, and on product pages. This thoughtful integration enables you to drive sales effectively and engage your audience with your latest deals and offerings. Discover innovative designs in our demonstration stores and learn how to use sections and features in Palo Alto through our extensive documentation. ## Explore Palo Alto demonstration stores Explore our demo stores to see the design elements and features included in Palo Alto. These Palo Alto presets are available in the *Shopify Theme store*: {% columns %} {% column width="50%" %}

{% endcolumn %} {% column width="50%" %} ### Pluma Our latest demo store, Pluma. Showcasing products and merchandising for **Home Decor** stores. Discover the page flow features in Palo Alto and vibrant element highlights. Plus, promotions to help shoppers get more value out of their purchase experiences. [Click to view](https://themes.shopify.com/themes/palo-alto/presets/pluma) {% endcolumn %} {% endcolumns %} {% columns %} {% column %}

{% endcolumn %} {% column %} ### Dynamo Features modern sections and promotions in Palo Alto with popular **Bags** as the product category and design. Explore how Palo Alto can showcase multiple categories on collection pages and cross-promote related products. [Click to view](https://themes.shopify.com/themes/palo-alto/presets/dynamo) {% endcolumn %} {% endcolumns %} {% columns %} {% column %}

{% endcolumn %} {% column %} ### Palo Alto Our Clothing demo preset includes merchandising examples with retail **Clothing** promotions. Explore the variety of swatch options in the product card, filtering system, and product form to assist shoppers in finding different variations and featured items. \ \ [Click to view](https://themes.shopify.com/themes/palo-alto/presets/palo-alto) {% endcolumn %} {% endcolumns %} {% columns %} {% column %}

{% endcolumn %} {% column %} ### Skylight Explore our **Shoes** demonstration store with Skylight. Featuring promoted products and variant options. Skylight adds elegance and stylish design elements to the shopping experience, featuring rich sections and blocks that improve how customers shop. [Click to view](https://themes.shopify.com/themes/palo-alto/presets/skylight) {% endcolumn %} {% endcolumns %} {% columns %} {% column %}

{% endcolumn %} {% column %} ### Phenomena **Beauty Products** and **Skin Care**. Phenomena showcases the merchandising features in Palo Alto. Helpful buying features, promotions, and a fully customized mobile navigation for quick control for fast shoppers. [Click to view](https://themes.shopify.com/themes/palo-alto/presets/phenomena) {% endcolumn %} {% endcolumns %} > ✔️ Our Palo Alto demonstration stores utilize only the features included with the theme, without using any third-party apps, except for Shopify's free apps, to show how we integrate with Shopify's tools. ## View the premium sections available in Palo Alto: Unleash your creative freedom with over 30 customizable sections, including standout options like "Shop the Look," a multifaceted "Featured Collection" with multiple layout choices, and an engaging "Image Accordion" section. These sections empower you to tailor your storefront uniquely, aligning perfectly with your brand aesthetics and vision: {% embed url="" %} ## Find out more about our latest release: Explore and learn about the new features and changes in Palo Alto. Our What's New guides detail changes and new features with each release: {% content-ref url="/pages/uwGRIia8dDQpt2TWq3Pj" %} [About 8.0 Release](/updates/whats-new-in-palo-alto/about-8.0-release) {% endcontent-ref %} Explore the changelog for details on our previous versions: {% embed url="" %} ## Experience Palo Alto for Free: You can download a free trial version from the Shopify theme store if you are new to Palo Alto. Discover how Palo Alto can help you build the right store for your brand, products, and services. Use it as a draft theme for as long as you like. Pay only when you publish: #### [Free unlimited trial available from the Shopify Theme Store - Click here](https://themes.shopify.com/themes/palo-alto/presets/palo-alto) ## Palo Alto Theme Support: If you have questions or need additional assistance with using Palo Alto, our support staff is here to help you by email. Reach out to us through our contact form: {% embed url="" %} # What's new in Palo Alto New features and updates # Release notes Release notes latest version of Palo Alto ## Version 9.1.0 January 16, 2026 #### New Features * New section: Collection links - Spotlight * New section: Header Countdown - Countdown Timer * PDP - Sticky add to cart * Text opacity animation - Text and Sticky Image Cards *** #### Improvements * Slideshow/Banner image - Mobile text settings * Custom section - Color schemes added * Header - Sticky header on collection pages * Shop the Look Grid - Hide product title on shop dots * PDP - Separated title and price blocks * PDP - Accordion block - New style setting *** #### Fixed * Improved cart page error handling to ensure clearer feedback and smoother checkout experiences. * Resolved an issue where border radius styling was not applied correctly. * Fixed the search icon requiring multiple clicks on iOS and desktop Safari. * Corrected the quick buy button so it now works properly for products without variants. * Addressed layout shift issues on mobile to improve page stability and performance. * Restored the language selector on desktop for larger screen sizes. * Added video popup functionality where it was previously missing. * Corrected button positioning in split image sections. * Fixed automated discounts not displaying correctly in the cart. * Fixed Section and Block Preview issues in the Theme Editor. * Fixed the Shop the Look banner block using incorrect button colors. * Resolved issue with upsell products added from the cart page update immediately without requiring a page refresh. * Fixed search page filters so they now open and close correctly. * Resolved issues affecting Shop Pay functionality. * Fixed an issue where product list was displaying an empty header. * Resolved general Shop the Look display and functionality issues. * Fixed autoplay speed issues for image sections with scrolling text. * Corrected text color issues for transparent headers on touch devices. * Fixed border styling issues in product and collection blocks within Custom Sections. * Resolved unwanted horizontal scrolling on smaller viewport heights. ## Version 8.0.0 September 11, 2025 #### Added * Color Opacity Controls have been added to fine-tune the transparency of your theme's colors. * Video option is now available in the Slideshow section. * Added the ability for customers to enter a discount code at the cart level before checkout. #### Changed * Additional improvements made to the theme for performance optimizations. * Siblings functionality updated so swatches appear in the product grid. * New color palettes. If upgrading, you will be required to reset your color settings. * Color swatches now get added in the Swatches settings in the theme editor. * Improved mobile design for Press/Logo section. #### Fixes and other improvements * Removed the "Cookies" popup. Please use the built-in Shopify version instead. * Resolved an AOS display issue. * Improved Countdown digits sizing. * Corrected an issue with quick shop for Recently Viewed Products. ## Version 7.0.0 June 18, 2025 #### Fixes and other improvements * Restructured theme files for theme store redesign. ## Version 6.2.2 May 12, 2025 #### Fixes and other improvements * An issue prevented the product image from rendering when it was set as the initial image in the "Product list" section. ## Version 6.2.1 May 9, 2025 #### Added * More content blocks are now available for the “Mobile menu”. * The currency selector now includes an option only to display the flag. * The language selector only has an option to display the language code. * “Shop the look grid” now includes an optional CTA under the product cards. * More control over the width of images in the “Multi column” and “Text column with images” sections. * A color picker has been added for text in the “Image with scrolling text” section. * “Product recommendations” section on the Product page now has a Grid layout option. #### Changed * Converted JavaScript utility functions to be global for easier access * Improved design for the “Final sale” option on Product pages * “Secondary background” color setting removed as it is no longer needed #### Fixes and other improvements * “Recently viewed products” displays correctly on iOS devices * Default padding for Accordions in the “Product form” has been adjusted * The padding for the “Product list” section has been improved resolving design issues * Spacing for the digits in the “Countdown” section is now consistent with the “Timer” block * Accessibility improvements * Display issues with blog posts resolved ## Version 6.2 March 21, 2025 #### **Added** * A new section called “Image with scrolling text” * New blocks for the Product template: “Timer”, “Fit guide” * Final sale shoutout on the Product page to call out products that cannot be returned or exchanged * A new section called "Mobile menu" (under the "Header") that utilizes blocks — more blocks to come! * Font picker added to the “Marquee” section * Option to enable the language and country/region selectors in the Header * Border color and opacity slider added to the Header * New “Soft” button style added * More heading and text sizing settings have been added to many sections including "Split images", "Grid", "Video", "Text columns with images", "Custom content", "Overlapping images", "Shop the look grid", and "Slideshow". * The timer block in the “Banner image” section now allows for a stacked layout * Quantity field styles within the product form and cart to choose between -/+ or a dropdown * Support for inline MP4/MOV videos added to the “Sticky image cards” and “Sticky images with text” sections #### **Changed** * Hover state added to the Menu block in the “Multi column” section * Product variant image option improved * “Social gallery” section now displays navigation dots on mobile #### **Fixes and other improvements** * Section height for the “Video” section fixed * Right alignment option on “Sticky image cards” and “Sticky images and text” sections fixed * Background color applies to the “Recommended posts” section on the Blog post template ## Version 6.1 January 29, 2025 #### Added * New advanced button size settings. Merchants will now be able to control the font, width and height sizes for small, medium and large buttons within the theme settings. * New "Social gallery" section available. Upload social proof and curate images without having to use an app. * New "Accordions with images" section * New "Alternate text" option added into the "Highlight" feature * "Accordion" block added to the "Image with text" section * Badges block added to the Product page. * Option to display custom and sale badges on top of product gallery images on the Product page. #### Changed * Improved button hover animation * "Image with text" section is now built with blocks to allow for more flexibility. Important: Please note that merchants will have to reconfigure this section with blocks after updating. * Background color picker added to all sections, replacing the "secondary background" setting * Gradient background color picker added to more sections * Option added to display accordions and descriptions full width under the product gallery on the Product page #### Fixes and other improvements * Optimized CSS rendering to improve page speed performance * Improved border settings in the Icons row section * Letter spacing setting now available for the Heading font ## Version 6.0.2 January 10, 2025 #### Fixes and other improvements * Improved product page loading on iOS devices ## Version 6.0.1 December 16, 2024 #### Added * An optional greyscale style for payment options in the Footer * Bottom center text alignment for Slideshow text #### Changed * Improved the user experience for Search input * Updated accessibility tabbing on the Quick View drawer * Improved animation when removing items in the Cart drawer #### Fixes and other improvements * Out-of-stock notification now works for more than one product at a time * Banner image text no longer becomes cropped for some font families and sizes * The button was missing from the Image Accordion if no header or text was entered * Dynamic checkout buttons now align with the Add to Cart button (decreased height to match) * Improved button margins in Text columns with images section ## Version 6.0 November 8, 2024 #### Added * A new section called "Shop the Look banner" 🎉 * New custom sale badge option for the Header * Font size sliders for the product page title and price * Width settings for "Banner image" and "Announcement bar." * Mobile height settings for "Promo row", "Custom content", and "Video." * Product count design option for "Collection list." * "Increase border-radius" is an appearance setting that can be applied to more sections. #### Changed * Renamed the existing "Shop the look" section to "Shop the look grid" and improved the overall design * Option to move button below the product grid for "Tab collections" and "Featured collection." * Updated active state for "Press/Logo" ## Version 5.9.1 October 7, 2024 #### Added * Color option for the loading overlay animation (previously black by default) #### Changed * Countdown timer - If expired, the section is hidden * Improved rounded corner style #### Fixes and other improvements * Custom content - The video was cropped, preventing the entire image from appearing * Location - Resize proportions were not accurate * Shop the look - Unable to click mobile hotspots when the hover animation was set to "Slide." * Improved accessibility for the "Quick Add" drawer ## Version 5.9 September 11, 2024 #### Added * A new section called “Multicolumn” * New "Empty cart" design to funnel customers into a purchase flow * Introduced "Font weight" and "Accent font" options to the Buttons * Connect images to your product variant boxes * Option to include the price in the "Add to cart" button * Slideshow & Image banner - Additional alignment settings and an optional stacked button style * Grid - design updates for the mobile experience #### Changed * Updated "Quick add", "Product form", "Cart drawer" and "Footer" styles for an improved user experience * Icons row - improved mobile design #### Fixes and other improvements * Implemented new Shopify requirements for the "Dynamic checkout buttons" * Testimonials - Updated the gap to match other sections for a unified appearance * Added Romanian translations * Removed "Reviews" from the product page as the Shopify app is no longer available ## Version 5.8 July 11, 2024 #### Added * New section called "Sticky image cards" * New section called "Testimonials with images" * Card scroll animation for the "Banner image" and "Slideshow" * Two new type highlights: hand-drawn circle and hand-drawn underline #### Changed * Animation improvements for the "Promotion row" and "Grid" sections #### Fixes and other improvements * Editions ’24 taxonomy and filter updates * Cumulative layout shift in the Footer * Optimized "Slideshow" and "Banner image" zoom animation on scroll ## Version 5.7 April 25, 2024 Version 5.7.0 includes key updates in text reveal animations in banner image sections, additional layout settings for mobile layouts, support for parallax scrolling effects in ticker and footer sections, and improved loading states for a much better user experience. #### Added * Updated "Slideshow", "Banner image" and "Split images" animations and order of appearance when text is being revealed * Optimized products and columns display on mobile devices with additional layout settings in most of the sections. * Option for parallax scrolling effect in "Footer" for a more dynamic experience * Two new layout options in the "Marquee" sections combining ticker animations with a parallax effect on scrolling * We've updated the zoom animation on hover and implemented it in more sections and blocks. * Support for all HTML tags inserted from rich-text fields where text highlight decorations are used * Headings style and size settings for "Product recommendations", "Search pages," and size chart drawers * Updated loading state overlays, on opening product pages images gallery, and on changing collection filters * Improved default color settings in the "Buttons list" section * Improved upsell design for a more engaging user experience. * Loading animation for "Image accordions" sections for enhanced visual appeal #### Changed * Updated body overlay animation on page load by merging "Loading icon" settings with improved "Loading overlay" settings #### Fixes and other improvements * Added body overlay when megamenu is opened for better visibility * Increased readability in predictive search dialog with more proportional font sizes * Increased the spacing control between blocks in "Grid" sections on mobile * Fixed block height issue on mobile in "Promotion row" when only images are used * Fixed predictive search results animation issues when the page is resized * Improved headings spacing in "Video" sections depending on the presence of text decorations * Fixed collections sorting dropdown visibility when scrolling animations are disabled * Fixed missing slider arrows in the "Product recommendations" section ## Version 5.6 March 6, 2024 Version 5.6.0 enriches the theme with improvements in section animations, with design enhancements of predictive search, rectangle swatches and footer, as well as with new sections for dynamic visual storytelling and effortless product showcasing, which not only bring value but are fun to interact with #### Added * New "Sticky images and text" section that utilizes vertical and horizontal layouts for engaging visual storytelling * New "Products with image" section to showcase both collections and product lists * New block in the "Footer" section for customizable designs with full-width logos * Parallax scrolling effect for the images in the "Overlapping images" section, which supports both multiple animation styles and adjusting the animation intensity * Unified hover effect for all instances where links are over the entire images * Enhanced loading experience of "Banner image" contents with a variety of options for the animation style * The Countdown Timer block can now be included in the "Banner image" sections * Refined styles of the search bar and the predictive search dialog box * Additional uppercase setting for all headings throughout the theme for easier control of their appearance * Improvements in rectangle swatch designs with a checkmark icon for better visibility of the active states with all colors #### Changed * In the "Footer" and "Footer minimal" sections, the maximum number of blocks is increased #### Fixes and other improvements * The navigation drawer is animated from the left to correspond to the position of the menu button in the header on mobile devices. * Adjusted spacing and balance of navigation icons in the header * Improved countdown timer sequential animations in both "Countdown" and "Banner image" sections * Updated "Size Guide" button positioning by aligning it with the last variant in size options * "Accent" typography is now used for tab headings in all places which can accommodate tabs, such as "Tab collections", "Product recommendations", "Search pages", and size chart drawers * The shimmer effect in image-loading animation now uses contrasting colors that correspond to the chosen body background color * Colors of the price range slider and filter remove buttons in Collection and Search pages are optimized for better visibility regardless of section color * The height of Promo block responds to Product grid image height settings whenever it is a single item in a row * Included alignment fixes for spacer lines below headings * Fixed search closing issues in the latest Safari versions ## Version 5.5 January 22, 2024 Version 5.5 adds enhancements to the theme including new sections, typography updates, optimizations for images loading, improved animations on page load and bug fixes #### Added * New "Buttons list" section * New "Recently viewed products" section * Better optimization for images loading in sections with options for both mobile and desktop images for improved site speed * Option to include a secondary navigation menu in closer to header icons * Support for metaobject swatches in the Search and Discovery app #### Changed * Added "Labels" typography settings which allow adjustments for tooltips, filter titles, product variants and form labels * Buttons "Add to cart" and dynamic checkout in Product pages have option to be displayed with either half or full width * "Product recommendations" section allows for setting up tabs with both dynamic product recommendations as well as recently viewed products * Header layout on mobile is improved by moving menu button on the left side and positioning the site logo in the center * "Announcement bar" and "Marquee" slider layouts now have arrows for navigation #### Fixes and other improvements * Improved animations on page load for Product pages using exponential delays * Improved "Slideshow" animations execution and emphasized more the different animation styles * Updated localization form selectors styles in footer * Improved "Countdown" inline layout so that the main focus of section content remains in the center * Fixed tooltips display issues * Resolved display issues in product form selectors and size guide popups * Fixed issues with "Image with title" heights to handle collections with lots of description or without any * Improved "Featured collection" grid layouts for tablet devices ## Version 5.4.1 - November 20, 2023 #### Fixes and other improvements * Product pages - Fixed quantity selector overlap * Text columns with images - Fixed scrollbar issue * Performance - Improved image-loading animations ## Version 5.4 - November 15, 2023 #### Added and changed * Typography - A global font picker for subheadings ("Accent") * Color - "Background Accent" color is removed * Banner with text columns - New layout * Footer minimal - New section * Header - Icons can be textHeader - Dot hover effect for header top-level links * Marquee / Announcement bar - sections are merged and improved * Nav / Product grid - typography adjustments * Product pages - accordion blocks have heading/body styles * Slideshow - Highlights added for headings * Image with text - Changed textarea type to richtext * Image with text / Overlapping images - Overlay gradient added * Custom content - Updated textarea to richtext / Reverse blocks checkbox on mobile * Collection list - Image aspect ratio min value reduced * Text columns with images - Borders between blocks / Mobile height and layout settings #### Fixes * Product grid - Sideshow progress bar issue in Firefox is fixed * Header - Nav menu hover when search-popdown is opened issue is fixed * Video - icon appearance in Safari is fixed * Image with text - Fixed inline layout overflow ## Version 5.3 - October 2023 #### Added * New section - Countdown timer * Introduced "Uppercase" font styles #### Changed * Improved hovering over the mega nav dropdowns * New design improvements for the Footer #### Fixes and other improvements * Fixed "Image with text" and "Grid" wrapper alignments * Fixed swatch tooltip position ## Version 5.2 - September 2023 #### Added * Main menu "letter-spacing" option for navigation * Featured collections - Added a "Products per row" setting * Added the highlight feature to the "Featured collection", "Marquee" and "Overlapping images" sections * Footer - Added width settings to each block to provide greater control over footer styles #### Changed * Collection list - Made settings more user-friendly and introduced additional width controls * Split images - Introduced a secondary button option #### Fixes and other improvements * Split images - Fixed an issue that was causing the "Highlight" type to not appear ## Version 5.1 - July 2023 This new version of Palo Alto includes the Shopify section groups feature and focuses on general improvements to design/UX, accessibility, performance, and settings. #### Added * Support for Product Siblings via Metaobjects. [Learn how to use siblings](/siblings/product-siblings) #### Changed * Size chart titles can be more easily customized * Tab collections now include a grid ratio option * Move accordions to blocks * Add lazy loading has been added to the product template * Hide swatches after 2 rows on the product grid and product pages * UX improvements for the marquee section * Automatically rotate through the press section * UX improvements for text highlights #### Fixes and other improvements * Minor UX improvements for predictive theme search * Fixed bug with section height for the grid and custom content sections * Improved resolution of loading image * Minor bug fix for buttons * Improve UX for collection filters ## Version 5.0 - May 2023 Includes the Shopify section groups feature and focuses on general improvements to design/UX, accessibility, performance, and settings. #### Added * [Predictive search](https://help.shopify.com/en/manual/online-store/storefront-search/predictive-search) * Section groups Shopify feature * New ‘[image banner](broken://pages/QWfCzHbP71fecYqhvfzr)’ section * New '[image](broken://pages/hulzYnn4RHNF9ZCwUXXh)' section * Ability to add promotional blocks to a [featured collection](broken://pages/UziHfecCQKDE9QO5sMe4) * 'Feature' block added to product form #### Changed * Updated button settings and design * Updated collection filtering settings and styling * Product grid swatches show on over when there are more than 5 * The collection list section now has a circle layout option * Typography options for collection filters #### Fixes and other improvements * Improved performance, including video loading * Improved typography options in the custom content section * Improved accessibility * Improved mobile breakpoints * Improved quick buy design * Improved size chart design * Improved font sizing options * Improved color swatch design * Improved sub-collection section * Improved settings flow and visibility * Product grid swatches show on over with there are more than five * Variant labels fixed in quick buy # About 9.1 Release Additional information on recent Palo Alto updates ### Highlighted updates #### Text Opacity Animation Your message matters, make sure your clients don't miss one of your brand's selling points with our text scrolling effect.

{% hint style="info" %} This feature is only available for the "Text" and "Sticky Image Cards" sections. {% endhint %} #### Section Spotlight Spotlight highlights your best collections while making it easy for customers to quickly navigate to the collection they’re looking for.

#### Countdown Timer Create urgency to highlight ongoing sales, launches, or limited-time offers.

#### Product Page - Sticky Add to Cart Bar Never lose a sale, with our sticky add to cart button, your client can add a product to the cart from any part of your product page.

*** ### New Features * New section: Collection links - Spotlight * New section: Header Countdown - Countdown Timer * PDP - Sticky add to cart bar * Text opacity animation - Text and Sticky Image Cards *** ### Improvements * Slideshow/Banner image - Mobile text settings * Custom section - Color schemes added * Header - Sticky header on collection pages * Shop the Look Grid - Hide product title on shop dots * PDP - Separated title and price blocks * PDP - Accordion block new style setting *** ### Fixed * Improved cart page error handling to ensure clearer feedback and smoother checkout experiences. * Resolved an issue where border radius styling was not applied correctly. * Fixed the search icon requiring multiple clicks on iOS and desktop Safari. * Corrected the quick buy button so it now works properly for products without variants. * Addressed layout shift issues on mobile to improve page stability and performance. * Restored the language selector on desktop for larger screen sizes. * Added video popup functionality where it was previously missing. * Corrected button positioning in split image sections. * Fixed automated discounts not displaying correctly in the cart. * Resolved Section and Block Preview issues in the Theme Editor. * Fixed the Shop the Look banner block using incorrect button colors. * Resolved issue with upsell products added from the cart page update immediately without requiring a page refresh. * Fixed search page filters so they now open and close correctly. * Resolved issues affecting Shop Pay functionality. * Fixed an issue where product list was displaying an empty header. * Resolved general Shop the Look display and functionality issues. * Fixed autoplay speed issues for image sections with scrolling text. * Corrected text color issues for transparent headers on touch devices. * Fixed border styling issues in product and collection blocks within Custom Sections. * Resolved unwanted horizontal scrolling on smaller viewport heights. *** ### Try Palo Alto 8.0 For additional examples and to try Palo Alto for free, visit our demo stores and download the latest version of Palo Alto {% embed url="" %} Existing customers can update for free. To preserve your live published theme, use the Shopify Update tool. The update tool will download an additional theme to your theme library and only copy the settings from your live theme. This is the safest and easiest method of updating your theme. # About 8.0 Release Additional information on recent Palo Alto updates ### Cart-level discount codes With Palo Alto 8.0, customers can now add a discount code to the cart drawer or cart page:

Previously, customers were required to navigate to the final Shopify Checkout page to apply a discount. With Palo Alto 8.0, this streamlines the process by bringing the discount field forward, encouraging customers to continue browsing and making it easier for them to add complementary products or meet thresholds for free shipping and tiered discounts. #### How to Enable Find the setting in the **Theme settings → Cart** To activate: 1. In the Theme Customizer, navigate to Theme Settings. 2. Select the Cart settings section. 3. Toggle the option: Enable discounts.

**Save** the changes. Now, the cart drawer or page will display an option for discounts. *** ### Slideshow video block Bring your slideshows to life with video content. Slides can now display video media alongside static images:

#### How to configure Palo Alto uses Shopify-supported MOV and MP4 video formats directly to this section. 1. Highlight the slide block in the Theme Customizer for the Slideshow section. 2. Click on the "**files**" link under the Video background link field:

Click on the files link to open the Files library

3. This will open your Shopify Files library in the main Shopify Admin 4. Copy the link URL, and use the link icon on the far right:

5. Paste the link URL in the slide block:

Paste the URL link under Video background link

**Save** the changes. *** ### Color schemes Palo Alto now includes Shopify's Color Schemes for managing colors throughout your theme:

Color schemes help ensure the consistency of your brand colors across all sections and allow for easy changes. Customize the palettes in the Theme Settings under Colors, then apply a palette or scheme to existing sections. Experiment with gradients and other colors to create visually interesting backgrounds and elements that will enhance your store's aesthetic appeal. {% hint style="info" %} If you're updating from an earlier version of Palo Alto, you can view your site's color choices from the live theme. This will be helpful when you're building the newer version from the drafts folder. The Shopify update tool cannot copy your original color choices. However, you can view them from the live theme and create new color schemes with the latest version. {% endhint %} Find scheme options in the section and block settings throughout the theme:

*** ### Swatches Palo Alto now has all swatch controls in the **Theme settings → Swatches** You can now manage custom HEX colors in the theme settings and also choose the swatch mode and shape:

*** ### Siblings Palo Alto supports metaobjects for the Siblings feature. Along with the Product form, introduced in version 8.0, sibling swatches are also supported in the Product Card:

When using Metaobjects with Palo Alto, Siblings can be easily managed from the Content library in your Shopify Admin:

*** ### Also in this version Additional improvements were made to the theme for performance optimizations. We've also improved the mobile design for the Press/Logo section. ## Try Palo Alto 8.0 For additional examples and to try Palo Alto for free, visit our demo stores and download the latest version of Palo Alto: {% embed url="" %} Existing customers can update for free. To preserve your live published theme, use the Shopify Update tool. The update tool will download an additional theme to your theme library and only copy the settings from your live theme. This is the safest and easiest method of updating your theme. {% content-ref url="/pages/-Miwg\_QeF0L1tlRsPFh0" %} [Updating your theme](/faq/frequently-asked-questions/updating-your-theme) {% endcontent-ref %} # About 6.2 Release Additional information on recent Palo Alto updates ## Mobile menu section Introducing a new mobile menu section for the header. In Palo Alto, you can now use the mobile menu section to display a rich, modern-designed navigation instantly:

* Collection images can automatically added without any customization. * Sub-menu items have a new, clean design. * Easily add your shop logo to the new menu. * Plus, new blocks will be coming soon for greater customization. Customize the mobile menu block with options to choose a menu and text size, toggle images, scale images wide or tall, highlight any menu item with color, and optionally display a tag:

#### Video walk-through: {% embed url="" %} ## Additional header settings In this release of Palo Alto, we've added some additional settings for the header: * Language selector dropdown * Currency chooser dropdown with optional country flags * Border color picker * Border opacity range slider

Find the new options under the Header settings:

## Image with scrolling text Palo Alto has added a new section that features scrolling text over an image banner:

We've combined the powerful Banner Image section with the popular scrolling text feature. This section is optimized to handle scrolling text:

The original Banner Image section is still available and supports split images. The new Image with Scrolling Text section uses one image and offers separate desktop and mobile image options. ## Timer and Fit guide blocks The product template in Palo Alto now includes three new blocks to enhance product page customization further. * Timer - Countdown timer to add urgency. * Fit guide - Visual gauge to help customers know how a product fits.

Timer block with settings to customize the promotion within the product form

Customize the fit chart within the product form

{% hint style="success" %} For best results when using the fit guide block, use metafields to set a value for each individual product. {% endhint %} Here's a video walk-through on how to create a simple metafield for the fit guide feature: {% embed url="" %} ## Quantity selector styles The Palo Alto product form and cart now have two Quantity field styles. You can choose from between the new -/+ style shown below or a dropdown:

To switch between styles, use the **Theme settings -> Product form**:

## Final sale message With Palo Alto, you can display a Final Sale message to inform your customers of the conditions of a final sale. Palo Alto can display a final sale message on all sale items with info-text upon hover:

To configure the final sale feature, use the **Theme settings -> Product form**:

Video walk-through on how to set a custom metafield for the final sale feature: {% embed url="" %} Final Sale metafield configuration {% endembed %} #### Reference from the above video: {% hint style="info" %} Final Sale product metafield: * Namespace: **theme.final\_sale** * Type: **True or false** {% endhint %} ## Soft button style Palo Alto now includes a soft, modern button style to the list of button options:

Combine with colors to see variations of the new soft button style. ## Marquee section text updates We've added a font-picker to the Marquee section in Palo Alto. Now, you can choose any font in your font library for the text message. We've also added a Space between messages slider to customize how much space is shown after messages:

## Sticky inline video Palo Alto now lets you add MP4 and MOV videos to our modern **Sticky image cards** and **Sticky images with text** sections:

Paste the video URL from your Shopify files:

Click on the files link to open your Shopify Files list, and then use the link icon to copy the URL:

## Additional setting options In this release, Palo Alto has increased the number of heading and text sliders within various sections, and we've added a few more settings to these sections: * **Split images** - Heading/text size options. * **Grid** - Added 'top center' and 'bottom center' content positions and heading/text sizes. * **Video** - Option for two buttons, text 'width' options (narrow, normal, wide), and heading/text sizes. * **Text columns with images** - Heading and text size options. * **Custom content** - Heading/text size options. * **Overlapping images** - Subheading option and heading/text sizes. * **Shop the look grid** - Heading/text sizes. * **Slideshow** - Heading/text sizes.

* **Banner** - In the countdown timer block, we added an option to display days/hours/minutes/seconds text **underneath** the digits, similar to the countdown section:

**Stacked** version of timer block in the **Banner** section

*** ## Try Palo Alto 6.2 For additional examples and to try Palo Alto for free, visit our demo stores and download the latest version of Palo Alto: {% embed url="" %} Existing customers can update for free. To preserve your live published theme, use the Shopify Update tool. The update tool will download an additional theme to your theme library and only copy the settings from your live theme. This is the safest and easiest method of updating your theme. {% content-ref url="/pages/-Miwg\_QeF0L1tlRsPFh0" %} [Updating your theme](/faq/frequently-asked-questions/updating-your-theme) {% endcontent-ref %} # About 6.1 Release Additional information on recent Palo Alto updates ### Social Gallery Section Palo Alto has added a new Social gallery" section to help users curate images without using a social media app.

* Use the **section settings** to design the layout of the image carousel and configure the heading and buttons:

* You can customize the image, text, and button with each image block. Use the "**Open link new tab**" toggle for external links. ### Accordions block added to the Image with text section You can now incorporate rich accordions into the "Image with text" section in Palo Alto. Insert images into the accordion to create a modern interactive design:

* Add one or more accordion blocks to build the accordion and rearrange blocks for the perfect layout:

### Accordion with Images Section Palo Alto has added a new super-charged accordion section, "Accordion with images." This section lets you quickly create modern accordion designs with various options and layouts. Add images to the accordions, customize the background with support for gradients, and much more:

**Accordion with Images section - Gradients, images and more**

* Each text block can add the accordion content, including an image. Images can be sized individually and placed inline or above the text:

### Highlight - A new alternate font option The popular "highlight" feature in Palo Alto now includes an alternate font style. You can choose the option from Palo Alto's highlight dropdown and add color to the design:

* Configure the font type in the **Theme settings** under **Typography**:

### Badges over product images The **Product detail page** (default product template) now has an option to display badges in the product gallery:

* Configure the "Badges" block with new toggle options, including "Show images over gallery". * Sale badges can also be displayed over the product image. ### Full-width options The description and accordion blocks can now be placed below the product gallery with a new toggle to "Enable full with":

* When enabled, the accordion or description will be moved from the product form column to a new full-width column below the image gallery. ### Advanced button sizing Palo Alto has introduced new global button sizes to the theme. You can now choose the button size within many sections and blocks.

* To configure the default sizes, use the **Theme settings** under **Buttons.** Scroll down to **Advanced:**

* Adjust the sizes, including the Font size, Width, and Height:

Tip: Experiment with larger and smaller font sizes to see if there is a noticeable difference. At first, the choices may seem subtle. The font size might affect the width of the button. ### More background color choices Palo Alto now includes more background options for sections. You'll find the complete color picker in our sections, giving you flexibility for each section:

The gradient picker is also available as a background overlay with many sections:

*** ### Try Palo Alto 6.1 For additional examples and to try Palo Alto for free, visit our demo stores and download the latest version of Palo Alto: {% embed url="" fullWidth="false" %} Existing customers can update for free. To preserve your live published theme, use the Shopify Update tool. The update tool will download an additional theme to your theme library and only copy the settings from your live theme. This is the safest and easiest method of updating your theme. {% content-ref url="/pages/-Miwg\_QeF0L1tlRsPFh0" %} [Updating your theme](/faq/frequently-asked-questions/updating-your-theme) {% endcontent-ref %} # About 6.0 Release Additional information on recent Palo Alto updates ### Shop the Look Banner Palo Alto 6 now has an interactive hero-style Shop the Look Banner section to help promote your products. Display product cards that point to different items on the banner image. Customers can choose variants and add items to the cart using the Quick Buy button:

Dot placements can be customized for both Desktop and Mobile devices:

Titles can be also be positioned using clock-face positions

Mobile shoppers will see a beautiful pop-up card to choose variants and view product images. ### Custom Sale Badge option for the Header Add an attention-getting sale badge right into the header. Palo Alto includes options to customize and toggle the badge in the header settings:

### Font size sliders for the product page title and price Now, with the product page templates, you can customize the title and price sizes in Palo Alto:

Adjust the sizes with the Title and price block settings

### Width settings for the Banner Image Section and Announcement Bar Modernize your page design with more padding options in Palo Alto:

Build a modern design with new settings for the Announcement bar and Banner section

### Mobile height settings for more sections Promo Row, Custom Content, and the Video sections have new mobile height settings:

### Product count option for the Collection List section When showcasing your collections with the Collection List section, you can now toggle a count of products that are within the collection:

### Increase border-radius setting You can now increase the border radius for many of Palo Alto's sections. This new setting will also make the corners more round. Example when **off**:

Example when toggled **on**:

* Find the new setting in the **Theme Settings**, under **Appearance**. *** ## Palo Alto 6.0.1 A new option to set the payment icons in the footer to grayscale has been added to help shops that want consistency with a gray/mono-themed footer.

# About 5.9 Release Additional information on recent Palo Alto updates ### Empty Cart Drawer Palo Alto now includes new options to promote the empty cart drawer. Add collections, custom buttons, and more to funnel customers into a purchase flow:

Buld an attractive empty cart drawer with easy links to your products

Use the options found under the **Theme settings -> Cart** to customize:

Tip: You can also use a Shopify Navigation menu to auto-generate buttons for the empty cart drawer. ### Icons Row Section New design options with borders and additional layouts for building eye-catching information sections:

**Mobile** layout options to build grid, stacked, and slider versions:

### Multicolumn Section A new section in Palo Alto, “**Multicolumn**”. Design promotion layouts with custom column sizes:

Choose from various block types, including Text, Image, Menu, and Collection:

Customize the **column width** for each block to build unique designs:

### Variant Images Palo Alto has made it simple to add images to your variant options. This feature is designed to help display images for variant choices. Ideal for showing the size, type or can even be used to show colors instead of swatches:

Currently, the feature can be set to only **one** variant type, such as size, style, or color. Multiple types will be supported in future releases. If your shop needs images shown for a particular variant type, this feature will easily link images to your variant options. We suggest using the Siblings feature in Palo Alto for more complex solutions. How to setup: {% content-ref url="/pages/MsxHzp3OMqcXiOWph0O3" %} [Variant images](/products/palo-alto-product-pages/variant-images) {% endcontent-ref %} ### Add to Cart Button - Price The **Add to Cart Button** now has the option to include the **price** inside the button, which helps customers see the cost of the current selection.

Toggle the feature in the **Theme settings -> Product form**:

### Quick Add We've refined the design for the Quick Add feature, making it cleaner on both desktop and mobile.

### Buttons We've introduced "**Font weight**" and "**Accent font**" options to the Buttons:

### Stacked Buttons Slideshow & Image banner - Additional alignment settings and an optional stacked button style:

On mobile designs, the buttons are displayed as stacked. ### Grid Section New design updates for the mobile experience. Items can now be shown in a two-column layout:

Mobile options include two-columns, one-column, and slider.

# About 5.8 Release Additional information on recent Palo Alto updates ### Sticky Image Cards A new modern design in Palo Alto. Now, you can showcase cards with vertical scrolling on desktop and mobile.

This new section is easy to set up. Add up to four blocks that make up the cards. Add a photo, supporting text content, and a call-to-action button to each card. Mobile options include a custom image for mobile devices and a stacked or sticky layout. ### Testimonials with images We have a new, improved testimonials section called Testimonials with images. This section will supercharge your reviews with photos, ratings, and new design elements.

Choose from three block types: Testimonial, Text, and Image:

Each block has new design options:

### Card Scroll Animation Palo Alto now includes a new card scrolling animation effect for the Banner Image and Slideshow sections. The section below will overlap and continue on the scroll:

To use, toggle on the option in the Banner Image section under Animation or under Transition for the Slideshow section:

### Text Highlights We've added two new text highlight animations: A hand-drawn circle and an underline.

#### To use, 1. Highlight the text to apply the effect. 2. Use the Italics format tool to italicize the text. 3. Under Highlight Type, choose the effect type and colors.

### Promotion row section The "Promotion row" section now includes a count-up animation effect:

### Grid section We've added animation improvements for the "Grid" section. The zoom animation of the product grid images appears once the section is mostly in view and on hover.

# About 5.7 Release Additional information on recent Palo Alto updates ### Footer parallax effect In the latest update, Palo Alto 5.7 introduces an engaging visual feature - a parallax scrolling effect for your website's Footer. This feature adds depth and movement to your webpage, creating a more dynamic user experience:

The parallax effect can be applied to both the standard **Footer** and the **Footer minimal** sections for a cohesive aesthetic across your site.

This effect is designed exclusively for **desktop** use to ensure optimal performance without compromising the website's loading speed on mobile devices. ### Mobile column settings Palo Alto version 5.7 enhances mobile settings, offering single and double-column customization options for enhanced flexibility.

We've added **mobile column options** to the following sections: * Blog posts, Buttons list, Collections list, Featured collection, Grid, Promotion row, Product recommendations, Recently viewed products, Shoppable blog posts, Tab collections, Testimonials, and Text columns with images Examples: **One** product per row displayed on the mobile slider with the **Featured collection** section:

**Two** columns per row brings in more assets into the slider viewport:

### Heading tags to customize your SEO requirements Now, in Palo Alto, you can customize the Heading to choose your heading tags:

* Use line-breaks in the Heading editor to create multiple rows for your headings:

### Tab heading styles and size options You can now choose from Heading, Body and Accent styles for your tab headings. Finetune the size of the text with the size slider:

We've added this feature to tabbed sections like: * Product recommendations * Search pages * Size chart drawers Learn more about tabbed sized charts: {% content-ref url="/pages/Jv4RZF8jovZ1O1kV0o1C" %} [Broken mention](broken://pages/Jv4RZF8jovZ1O1kV0o1C) {% endcontent-ref %} ### New marquee animation enhancements We're excited to unveil two innovative layout options for the "Marquee" sections. We've added new parallax scrolling effects, offering modern design elements to improve your messaging elements throughout your store. {% embed url="" %} ### Additional animation improvements We've brought new modern animation design elements to these popular sections in Palo Alto: * Slideshow * Banner image * Split images The animations appear in order as each text block is revealed, resulting in a finetuned animation experience for your content.

In addition, the zoom animation for hover effects has been added to more sections and blocks throughout the theme. ### Buttons list color settings We've added additional color options to the popular "Buttons list" section in Palo Alto 5.7. * The section now contains a set of default colors for the buttons and the section:

* Each block contains override color options for complete customization:

### Upsell design The upsell promotion design has been improved to help with wider layouts. The image has been moved to the left, and the spacing has been optimized for the columns. * Standard image, wide product form:

* Large image, smaller product form:

# About 5.6 Release Additional information on recent Palo Alto updates ### Sticky image with text section Introducing a new sticky version of Image with text. Now you can keep the text message always visible while scrolling through the image blocks:

* Palo Alto provides both **horizontal** and **vertical** layout options for this new section:

### Products with image section Another exciting new section in this version of Palo Alto is **Products with image**. Build a promotional message with an image and include the product line next to it:

* The image remains sticky while scrolling through the product list. ### Footer full-width block New in Palo Alto is the "**Logo full width**" block for building beautiful, rich footers. Showcase your brand for a modern footer design:

* This new block is available in the **Footer** and **Footer minimal** sections. * We've also increased the maximum number of blocks to **six** from four in both sections. ### Overlapping images We've added new scrolling animation effects to the Overlapping images section:

* Customize the animation direction and intensity to enhance your store's scrolling effect. ### Countdown Timer block The "**Banner image**" section now includes a countdown timer block. Now you have even more options to promote flash sales with Palo Alto:

**Hero-style banner section with countdown timer**

### Swatch improvements We've added a **checkmark** to the selected variant option to the **rectangular** swatch design. This visual effect helps customers ensure they have chosen the correct variant option:

### Predictive search In this version of Palo Alto, we've refined the search experience with improved colors, borders and the layout for both the **mobile** and **desktop** dropdown designs:

# About 5.5 Release Additional information on recent Palo Alto updates ### Buttons list - new section Introducing a brand new section to Palo Alto - the buttons list:

This section allows you to add a customizable list of buttons that you can use as a banner to break between content or as an addition to your header. The individual block settings are where you will find the option to change the background, text color, and border color for each block.

In the more general section settings, you will find all of the layout options and general styles for the sections such as: {% hint style="success" %} Enabling grid/carousel layout.\ \ Changing the border style for the buttons.\ \ Changing the size of the buttons.\ \ Changing the number of buttons per row.\ \ Text size and letter spacing. {% endhint %} ### Recently viewed products - new section block A new addition to our product recommendations section is the ability to add a 'Recently viewed' block. The content here will be automatically generated as customers browse trough your store.

You can easily sort them by changing the block order in the theme editor. We've also included an option to show them as tabs or stacked:

### Secondary navigation menu - new option In the header section, you can now add a secondary menu right next to the header icons:

> **Note:** Having too many items in the header can cause the hamburger style navigation to trigger on laptops. ### Labels typography - new setting A new style of typography style, labels, allows you to set a separate style for your tooltips, filter titles, product variants, and form labels. Find these new options in the theme settings tab:

*Label settings are under the "Typography" tab.*

### Product form buttons - new option The 'add to cart' and dynamic checkout buttons, on product pages, have the option to be displayed with either half or full-width:

Change the size of these buttons by going into the theme settings tab (the gears icon on the side of the theme editor) and opening up the product form tab:

### Navigation arrows - new option The announcement bar and marquee sections now have the option to toggle navigation arrows for the slider layout.

### Improved image loading Better optimization for images loading in sections with options for both mobile and desktop images for improved site speed. ### Other fixes and optimization * Improved animations on page load for product pages using exponential delays. * Improved slideshow animation execution and emphasized the different animation styles. * Updated localization form selectors styles in the footer. * Improved countdown inline layout so that the main focus of section content remains in the center. * Fixed tooltips display issues. * Resolved display issues in product form selectors and size guide popups. * Fixed issues with image with title heights to handle collections with lots of descriptions or without any. * Improved featured collection grid layouts for tablet devices. # About 5.4 Release Additional information on recent Palo Alto updates ### Product Grid settings - New options You can now change the **Heading style** for the Product Grid display. Choose between the Heading or Body font styles:

Product Grid is the display used to show Collections

> *To configure these font styles, use the Typography settings and choose which style to use for your Product Grid display.* You can also change the **Text size** to make the heading, price, and description smaller or larger with the Text size slider:

### Heading settings - New options Choose between **Line** or **Dots** for the **Link hover effect** in the navigation:

A new option to display the Search, Account, and Cart as **Text or Icons**:

Uncheck to use icons:

### Text Columns with Images - Build promotions You can now easily build promotions throughout your shop with Text Columns and Images. We've added a **Show borders** option to help you create multiple promotions within one section:

Check the Show borders optoin to add borders between the columns

#### Mobile height We've also added a **Mobile height** option when using images in this section. You can finetune the aspect ratio to match your images for both desktop and mobile devices:

#### Mobile layout Now you can choose from **Grid**, **Stacked**, and **Slider** options for mobile devices:

### Typography - Subheading font options We've added more options to customize font and font styles for subheadings. The **Typography** has a new section for the **Accent** font style which is used throughout the theme including subheadings:

### Slideshow - Add the highlight effect Headings in the Slideshow section can now display the Palo Alto highlight effects:

**To use**, highlight a word or words in the **Heading** area and **italicize** the word or words:

Choose from various effect styles by Palo Alto:

> **Tip**: Styles like circle work best with one word highlighted. Others like Stroke or Highlight will work well with multiple words. Experiment with the styles to match your branding ### Marquee section - New options Add **borders** to the top and/or bottom of the Marquee section:

We've also added more text options - Choose from the **Heading**, **Body,** and **Accent** font styles and also toggle for **uppercase** text:

**Links** are now styled with Palo Alto's hover animation. Use the highlight feature to draw attention to certain words:

### Footer minimal - New quick and easy footer option Build a simple minimal footer instantly with Palo Alto's new **Footer minimal** section. Add the section from the Footer group:

**Pre-configured blocks and settings are included when you add this section**

Palo Alto will build a simple footer with easy-to-configure blocks and settings:

Simply hide the regular footer and only display the Footer minimal section. For more advanced options and flexibility, use the standard Footer. ### Custom Content - Mobile reverse option Blocks are stacked for mobile devices. Now you can **reverse** the order placement on mobile:

Regular block order is used if unchecked:

**Unchecked is stacked with regular block order**

### Download the update from the Shopify Theme Store Current customers can download a free update from the Shopify Theme Store. The update is added to your Theme Library as a draft. You can explore the new features without affecting your live store. If you are new to Palo Alto, you can download a free trial version from the Shopify Theme store. Discover how Palo Alto can help you build the store that's right for your brand, products, and services. Use it for as long as you like as a draft theme. Pay only when you publish: {% embed url="" %} # About 5.3 Release New features and changes in Palo Alto 5.1 - 5.3 ### Introducing Siblings Palo Alto now supports product siblings with metaobjects. With siblings, you can link directly to other products as product swatches. The result is rich product detail pages that only include product images for that style and also include image swatches that are automatically generated by Palo Alto:

**With Siblings, only images for this color option are displayed**

Discover the new features of Siblings with this short video: {% embed url="" %} ### Size chart label Size chart headings can now be customized. Here's a short video on how to customize it: {% embed url="" %} ### Tab collections We've added the ability to adjust the image sizes in this section:

{% embed url="" %} ### Accordion block on product pages The accordion block has been updated to hold individual content and can be placed in different positions on your product pages: {% embed url="" %} ### Marquee section We've improved the options in the scrolling Marquee section and included an image block for creative designs:

**Example of image-based scrolling marquee**

{% embed url="" %} ### Press section Auto-slideshow options have been added along with support for rounded corners for your logos: {% embed url="" %} These are some of the key changes in this release of Palo Alto. You'll also find various speed, UX improvements, and bug fixes. # Sections # Advanced


Custom section	A powerful section that allows for a split view of two unique blocks.	/pages/077KKjCDTgT11vainTwd	/files/Rr02tE2tNeDbrEPF4P7Z
Multi column	Seamless multi column layout.	/pages/In5XZGRRAEcvLYyDPUuY	/files/WCzFUSzvKx4TIDqYBcDB

# Custom section Custom section offers a modular approach to building your website. This section is broken into blocks, each with its own range of settings to fine-tune your content's appearance and functionality.

### Section settings

Settings	Type	Description
Desktop height	`select`	Sets the height of the section on desktop devices.
Enable mobile height	`checkbox`	Toggles custom height for mobile devices.
Mobile height	`select`	Sets the height of the section specifically for mobile devices.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Mobile
Reverse block placement	`checkbox`	Reverses the order of content blocks for layout variation.
Section spacing
Width	`select`	Defines the content container width: `Full width`, `Page width`, `Full width padded`, or `Page width narrow`.
Add spacing	`checkbox`	Adds internal spacing between content blocks.
Padding top and bottom	`range`	Controls the padding at the top and bottom of the section.

# Image Displays a background image with optional overlay text and a call-to-action button for visual impact. {% hint style="warning" %} You can only choose two blocks to be shown at a time. {% endhint %}

Settings	Type	Description
Layout
Content alignment	`select`	Determines the alignment of text and button content within the block: `Top left`, `Center`, `Top right` and etc.
Image
Image	`image_picker`	Upload or select an image to display in the block.
Overlay type	`select`	Add an opacity or text underlay: `Disabled`, `Opacity`, or `Text underlay`.
Text
Heading	`text`	Input for the main headline or title displayed over the image.
Heading size	`range`	Controls the size of the heading text.
Text	`richtext`	Area for adding descriptive or supporting text content.
Text size	`range`	Adjusts the size of the text content.
Colors
Show text background	`checkbox`	Adds a colored background behind text.
Background	`color`	Override color scheme for background.
Text	`color`	Override color scheme for text.
Button
Text	`text`	Label text that appears on the button.
Link	`url`	URL that the button will navigate to when clicked.
Button color	`select`	Defines the visual color theme of the button: `Primary`, `White`, `Black`, or `Secondary`.
Button style	`select`	Sets the visual style of the button: `Solid`, `Outline`, `Text` and etc.
Size	`select`	Controls the button’s size: `Small`, `Medium`, or `Large`.

# Text Presents rich text content with optional images and buttons for storytelling or announcements. {% hint style="warning" %} You can only choose two blocks to be shown at a time. {% endhint %}

Settings	Type	Description
Text position	`select`	Sets the placement of text relative to the image: `Left`, `Right`, or `Center`.
Image
Image	`image_picker`	Upload or choose an image to display alongside the text content.
Custom image width (in pixels)	`range`	Defines a custom width for the image in pixels for more precise layout control.
Text
Subheading	`text`	Adds a smaller heading or introductory line above the main heading.
Heading	`text`	Main title or attention-grabbing headline shown in the block.
Heading size	`range`	Adjusts the size of the heading text.
Text	`richtext`	Area for supporting or descriptive text content.
Text size	`range`	Controls the font size of the paragraph or body text.
Buttons
Button text	`text`	Label shown on the primary button.
Button link	`url`	URL that the primary button directs to when clicked.
Button color	`select`	Sets the color style for the primary button: `Primary`, `White`, `Black`, or `Secondary`.
Button style	`select`	Defines the visual treatment of the primary button: `Solid`, `Outline`, `Text` and etc.
Size	`select`	Controls the size of the primary button: `Small`, `Medium`, or `Large`.
Second button text	`text`	Label shown on the secondary button.
Second button link	`url`	URL that the secondary button will link to.
Second button color	`select`	Sets the color style for the secondary button.
Second button style	`select`	Defines the look of the secondary button: `Solid`, `Outline`, `Soft`, and etc.
Second button size	`select`	Sets the size for the secondary button: `Small`, `Medium`, or `Large`.
Colors
Background	`color`	Sets the background color of the entire block.

# Newsletter Captures email sign-ups with a customizable heading and supporting text. {% hint style="warning" %} You can only choose two blocks to be shown at a time. {% endhint %}

Settings	Type	Description
Heading	`text`	Main title or heading displayed prominently in the block.
Heading size	`range`	Adjusts the size of the heading text, typically as a percentage or pixel value.
Text	`richtext`	Content area for adding detailed text, including formatting and links.
Text size	`range`	Controls the font size of the text content, allowing for better readability.
Colors
Background	`color`	Sets the background color of the block to match your theme or highlight it.

# Testimonial Showcases customer feedback with star ratings, photos, and styled review text. {% hint style="warning" %} You can only choose two blocks to be shown at a time. {% endhint %}

Settings	Type	Description
Text
Alignment	`select`	Sets the alignment of the content: `Center` or `Left`.
Review star rating	`range`	Allows you to visually display a star rating.
Testimonial	`richtext`	Area to add the customer text with formatting options.
Text size	`range`	Adjusts the size of the text for readability and emphasis.
Customer photo	`image_picker`	Upload an image of the customer giving the testimonial.
Image width (in pixels)	`range`	Sets the width of the customer photo to control its visual size.
Customer name	`text`	Displays the name of the customer providing.
Subtitle text	`richtext`	Additional text, such as customer title, company, or location.
Colors
Background	`color`	Sets the background color of the testimonial block.

# Product Highlights a specific product with an optional subheading and custom background. {% hint style="warning" %} You can only choose two blocks to be shown at a time. {% endhint %}

Settings	Type	Description
Subheading	`text`	Optional short text displayed above the product name to introduce the section.
Product	`product`	Selects the product to display.
Style
Background	`color`	Defines the background color of the product block.

# Video Plays a background or popup video with overlay text and buttons for dynamic engagement. {% hint style="warning" %} You can only choose two blocks to be shown at a time. {% endhint %}

Settings	Type	Description
Layout
Content alignment	`select`	Defines the alignment of the content in the block: `Top left`, `Center`, `Top right` and etc.
Video
Video background link	`text`	The link to the video that will be used as the background.
Video popup link	`text`	Link to the video that will appear in a popup when clicked.
Poster image	`image_picker`	Image used as a placeholder before the video starts.
Overlay type	`select`	Add an opacity or text underlay: `Disabled`, `Opacity`, or `Text underlay`.
Video container size	`select`	Select the size of the container holding the video: `Fit` or `Cover`.
Text
Heading	`text`	Title or heading text to display above the video.
Heading size	`range`	Defines the size of the heading text.
Text	`richtext`	The body text or description to be shown below or beside the video.
Text size	`range`	Controls the size of the body text.
Colors
Show text background	`checkbox`	Adds a colored background behind text.
Background	`color`	Override color scheme for background.
Text	`color`	Override color scheme for text.
Button
Text	`text`	Optional additional text, possibly for call-to-action or other purposes.
Link	`url`	Link to be used with the button or the text.
Button color	`select`	Defines the visual color theme of the button: `Primary`, `White`, `Black`, or `Secondary`.
Button style	`select`	Choose the style of the button: `Solid`, `Outline`, `Soft` and etc.
Size	`select`	Selects the size of the button: `Small`, `Medium`, or `Large`.

# Collection Features a chosen product collection with an optional subheading and background color. {% hint style="warning" %} You can only choose two blocks to be shown at a time. {% endhint %}

Settings	Type	Description
Collection	`collection`	Selects the Shopify collection to feature in this block.
Subheading	`text`	Optional subheading text displayed above or below the collection title.
Colors
Background	`color`	Sets the background color of the collection block.

# Multi column The Multi column section is a versatile and customizable layout that allows you to showcase various types of content in a structured format.

This section is perfect for highlighting categories, promotions, or important navigation links, creating a dynamic and user-friendly shopping experience. ## Section settings

Settings	Type	Description
Heading	`text`	Title or main heading for the section.
Heading size	`range`	Adjusts the size of the heading text.
Text	`richtext`	Additional descriptive text.
Text size	`range`	Adjusts the size of the body text.
Layout
Heading alignment	`select`	Align heading `Left` or `Centered`.
Text alignment	`select`	Align text `Left` or `Centered`.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Mobile
Layout	`select`	Choose mobile layout: `Grid`, `Stacked`, or `Slider`.
Section spacing
Width	`select`	`Full width padded` or `Page width`.
Padding top	`range`	Adds spacing above the section.
Padding bottom	`range`	Adds spacing below the section.

# Text Displays a customizable heading, subheading, rich text, and an optional button with full typography, color, and width controls.

Settings	Type	Description
Column width	`range`	Width of the column on desktop only.
Typography
Subheading	`text`	Small heading above the title.
Heading	`text`	Main heading for the block.
Heading size	`range`	Size of the heading text.
Text	`richtext`	Block content or description.
Text size	`range`	Size of the body text.
Button
Text	`text`	Text displayed on the button.
Link	`url`	Destination URL for the button.
Button color	`select`	Choose button theme color: `Black`, `White`, `Primary` or `Secondary`.
Button style	`select`	Choose button style: `Solid`, `Outline`, `Soft`, and etc.
Size	`select`	Choose size of the button: `Small`, `Medium` and `Large`.
Colors
Background	`color`	Background color of the block.

# Image Shows an image with adjustable width, scaling ratios, an optional heading, text, and a button for linked call-to-actions.

Settings	Type	Description
Column width	`range`	Width of the column (desktop only).
Image
Image	`image_picker`	Upload or choose an image.
Image width	`range`	Width of the image.
Image scaling ratio	`range`	Controls image aspect ratio on desktop.
Image scaling ratio (mobile)	`range`	Controls image aspect ratio on mobile.
Typography
Heading	`text`	Heading shown below or over the image.
Heading size	`range`	Size of the heading text.
Text	`richtext`	Description or caption.
Text size	`range`	Size of the body text.
Button
Text	`text`	Text displayed on the button.
Link	`url`	Destination URL for the button.
Button color	`select`	Theme color for the button:`Black`, `White`, `Primary` or `Secondary`.
Button style	`select`	Button style appearance: `Solid`, `Outline`, `Soft`, and etc.
Size	`select`	Choose size of the button: `Small`, `Medium` or `Large`.

# Menu Renders a navigational menu with adjustable text size, column width, and selectable hover effects for links.

Settings	Type	Description
Column width	`range`	Width of the column (desktop only).
Select menu	`link_list`	Choose a navigation menu to display.
Text size	`range`	Font size for menu items.
Link hover effect	`select`	Choose hover animation: `Line` or `Dot`.

# Collection Displays a selected product collection with optional custom image, heading, product count display, and flexible sizing settings.

Settings	Type	Description
Column width	`range`	Width of the column (desktop only).
Collection	`collection`	Choose a Shopify collection to display.
Image	`image_picker`	Optional custom image for the collection.
Image width	`range`	Width of the image.
Image scaling ratio	`range`	Controls image aspect ratio on desktop.
Image scaling ratio (mobile)	`range`	Controls image aspect ratio on mobile.
Heading	`text`	Title for the collection block.
Heading size	`range`	Size of the heading.
Show number of products	`checkbox`	Toggle display of product count in collection.

# Banners


Banner image	Lightweight section perfect for a page banner.	/pages/6pLDHhJO7W6t0Q6nmfYm	/files/nX73N9hAQZUV2C9rIPYi
Banner with text columns	A new way of showing text boxes each with its own background image.	/pages/7v8eWo0eDO7LTN3rhnMH	/files/gYiVLYVSWeGPvpBIWDDG
Image	Static image with powerful options.	/pages/LhMaSSzQlH764jhK9KLR	/files/tylFTL83lxCMTiePtzws
Image with scrolling text	Animated text with a background image.	/pages/dsMg2FCTpr6KdzPKkLop	/files/MweKWNuhqjgE4zv46Dnv
Slideshow	A home page banner with incredible customizability.	/pages/Hf02DgTp9J6cybPYzmvA	/files/5eCIao4x7fp20UNQbwoE
Split images	Create a split view to showcase your products or product images.	/pages/nLnoGXHqjfwNmhzMzrCg	/files/pqSh9JKwJShbuTVNmqLm
Video	A video background section.	/pages/UdQRRCvRXBOfF97QkYLZ	/files/Lt4ZYuiBArTHXzvX4UoE

# Banner image Present a full-width image. Enhance visual appeal while serving functional purposes such as branding, content highlighting, and user engagement. Basic customization options include height settings, colors, text positioning, and button styles.

### **Section settings**

Settings	Type	Description
Layout
Height	`select`	Select the height of the banner section (e.g., `Full screen`, `Image height`, `One fifth of screen`, and others).
Enable mobile height	`checkbox`	Enable a different height setting specifically for mobile devices.
Mobile height	`select`	Choose the height for the banner on mobile screens.
Image
Image	`image_picker`	Upload or select the desktop version of the banner image.
Mobile image	`image_picker`	Upload or select an alternate image for mobile view.
Overlay type	`select`	Adds an overlay: `Disabled` and `Opacity overlay`.
Animations
Loading style	`select`	Choose how the image loads: `Zoom out`, `Fade`, `Wipe`, and `Slide`.
Enable zoom animation on scroll	`checkbox`	Enable a zoom effect on the banner image as the user scrolls.
Enable card scrolling effect	`checkbox`	Enable a parallax-like scrolling effect for the banner content.
Increase border radius	`checkbox`	Apply extra rounding to the banner's corners.
Text
Content width	`range`	Control the maximum width of the content inside the banner.
Text position	`select`	Choose where the text appears over the image (e.g., `Center`, `Left`, `Right`, and other).
Text alignment	`select`	Align text inside the text container: `Left`, `Center`, or `Right`.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Show text background	`checkbox`	Adds a colored background behind text.
Background	`color`	Background color override.
Text	`color`	Text color override.
Section spacing
Width	`select`	Set the full width behavior of the banner: `Full width` and `Full width padded`.
Padding top	`range`	Adjust the top padding of the banner section.
Padding bottom	`range`	Adjust the bottom padding of the banner section.

# Subheading Adds a smaller introductory line of text above the main heading, often used for greetings or taglines.

Settings	Type	Description
Text	`richtext`	The subheading text displayed over the banner image.
Size	`range`	Set the font size of the subheading.

# Heading Displays the primary headline of the banner, with options to highlight key words using various decoration styles.

Settings	Type	Description
Text	`richtext`	The main heading content supports basic formatting like bold and italics.
Size	`range`	Adjusts the font size of the heading text.
Highlight
Type	`select`	Choose a predefined heading style (e.g., `Highlight`, `Text color`, `Alternate font`, `Circle`, and others).
Highlight color	`color`	Sets the color used to highlight part of the heading, if applicable.
Text color	`color`	Defines the primary color of the heading text.

# Text Includes a paragraph or short description below the heading to share supporting content or messaging.

Settings	Type	Description
Text	`richtext`	Main body text content with support for formatting like bold, links, and lists.
Size	`range`	Adjusts the font size of the text block.

{% hint style="info" %} Note: Use text and buttons to comply with best practices for web [accessibility](https://developer.mozilla.org/en-US/docs/Web/Accessibility). {% endhint %} # Timer Shows a live countdown to a specified date and time, useful for sales, launches, or limited-time promotions.

Settings	Type	Description
Style	`select`	Choose between `Inline` or `Stacked` layout for the countdown display (desktop only).
Countdown end date	`text`	Date when the countdown ends (format: `YYYY-MM-DD`, based on the store’s primary timezone).
End time	`text`	Time when the countdown ends (12-hour format: `HH:MM`).
AM/PM	`radio`	Specify whether the end time is in the `AM` or `PM`.
End of timer message	`richtext`	An optional message is shown after the countdown ends. If left blank, the section will be hidden.
Digits size	`range`	Controls the size of the countdown numbers.
Text size	`range`	Adjusts the size of the unit labels.

# Buttons Adds one or two customizable call-to-action buttons, linking to any URL and styled to match your theme.

Settings	Type	Description
Stack buttons on larger screens	`checkbox`	Arrange buttons vertically on larger screens when enabled.
Button 1
Text	`text`	Text label for the first button.
Link	`url`	Link for the first button (if empty, the entire image is clickable).
Button color	`select`	Sets the color scheme for the first button: `White`, `Black`, `Secondary`, and `Primary`.
Button style	`select`	Choose visual styling for the first button: `Soft`, `Solid`, `Outline`, `Solid with border`, and `Text`.
Size	`select`	Defines the size of the first button: `Small`, `Medium`, and `Large`.
Button 2
Text	`text`	Text label for the second button.
Link	`url`	Link for the second button.
Second button color	`select`	Set the color: `White`, `Black`, `Secondary`, and `Primary`.
Second button style	`select`	Choose visual styling: `Soft`, `Solid`, `Outline`, `Solid with border`, and `Text`.
Second button size	`select`	Define the size: `Small`, `Medium`, and `Large`.

{% hint style="info" %} Note: Use text and buttons to comply with best practices for web [accessibility](https://developer.mozilla.org/en-US/docs/Web/Accessibility). {% endhint %} # Video button Displays a button that opens a popup video from YouTube, Vimeo, or a direct MP4 link when clicked.

Settings	Type	Description
Video button
Text	`text`	Text label displayed next to the video button.
Video popup link	`text`	Link to a YouTube, Vimeo, or MP4 file from the store files that opens in a popup when clicked.

# Banner with text columns Create an organized layout with up to four text columns and a prominent banner image, offering flexibility in appearance, colors, button styles, and image configurations for a visually appealing and content-rich webpage.

### Section settings

Settings	Type	Description
Layout
Appearance	`select`	Determines the layout of text: Choose from `Row` and `Columns`.
Content alignment	`select`	Choose from: `Top`, `Center`, or `Bottom`.
Text alignment	`select`	Sets `Center` or `Left` text.
Height	`select`	Sets section height on desktop devices.
Enable mobile height	`checkbox`	Enables custom height settings for mobile devices.
Mobile height	`select`	Sets the section height for mobile when mobile height is enabled.
Color
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Buttons
Button color	`select`	Sets the color scheme for buttons.
Button style	`select`	Defines the button's visual style: `Solid`, `Outline`, `Soft`, etc.
Size	`select`	Sets the size of the buttons: `Small`, `Medium`, or `Large`.
Image control
Show single image	`checkbox`	Displays only the image from the first column.
Heading
Size	`range`	Adjusts the heading text size, expressed as a percentage.
Section spacing
Width	`select`	Sets the overall content width: `Full width padded` or `Page width`.
Padding top	`range`	Sets the top padding of the section.
Padding bottom	`range`	Sets the bottom padding of the section.

# Column These blocks serve as a modular content unit within the Banner with text columns section, allowing you to display a combination of imagery, text, and an optional call-to-action button.

Each block represents one column and supports the following settings:

Settings	Type	Description
Image	`image_picker`	Uploads or selects an image for the column.
Overlay type	`select`	Add an opacity or text underlay: `Disabled` and `Opacity overlay`
Text
Subheading	`text`	Adds a smaller heading above the main heading.
Heading	`text`	Adds the main title text.
Text	`richtext`	Optional body text below the heading supports rich formatting.
Button
Text	`text`	Text for the optional button, leave blank to make the whole column clickable.
Link	`url`	URL the button or entire block should link to.

# Image Images play a pivotal role in capturing the attention of your audience and conveying your brand's message. Our image section offers a versatile set of tools to help you curate and display images effectively on your website.

### Section settings

Settings	Type	Description
Image	`image_picker`	Upload or select an image to display.
Layout
Height	`select`	Sets image height on desktop. Options include: `Full screen`, `Image height`, `750px`, `450px` and etc.
Enable mobile height	`checkbox`	Allows setting a separate height for mobile devices.
Mobile height	`select`	Sets image height on mobile. Options include `Full screen`, `Image height`, `750px`, `450px` and etc.
Stretch image	`checkbox`	Stretches the image to fill its container on the desktop.
Image position	`select`	Aligns the image if not stretched: `Left`, `Center`, or `Right`.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Section spacing
Width	`select`	Controls the section’s container width: `Full width,` `Full width padded`, `Page width narrow`, or `Page width`.
Padding top	`range`	Top spacing in pixels.
Padding bottom	`range`	Bottom spacing in pixels.

# Image with scrolling text The Image with scrolling text section is a mix of our Banner image and Marquee sections. It's designed to display an image with overlaid text that scrolls across the screen.

## Section settings

Settings	Type	Description
Image
Image	`image_picker`	Desktop image. Recommended width: 2048px.
Mobile image	`image_picker`	Optional image shown on mobile devices.
Overlay type	`select`	Add an opacity or text underlay: `Disabled` and `Opacity overlay`.
Space between messages	`range`	Space between scrolling messages.
Autoplay speed	`range`	Speed of scrolling text.
Layout
Height	`select`	Choose the image section height.
Enable mobile height	`checkbox`	Toggles separate height for mobile.
Mobile height	`select`	Height for mobile view.
Animations
Loading style	`select`	Entrance animation: `Slide`, `Fade`, `Zoom out`, or `Wipe`.
Enable zoom animation on scroll	`checkbox`	Zooms image on scroll.
Enable card scrolling effect	`checkbox`	Creates an overlapping card effect with the next section.
Increase border radius	`checkbox`	Around the top corners of the next section, when the card scrolling is on.
Text
Text alignment	`select`	Align text vertically: `Top`, `Center`, or `Bottom`.
Scrolling text color	`color`	Choose a color for the scrolling text.
Scrolling text
Uppercase text	`checkbox`	Converts text to uppercase.
Font	`font_picker`	Font family selection.
Size	`range`	Font size (50–300%).
Mobile size
Letter spacing	`range`	Adjust the spacing between letters.
Position	`select`	Alignment of scrolling text: `Top`, `Center` and `Bottom`.
Text direction	`select`	`Left to right` or `Right to left` scrolling.
Color
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Section spacing
Padding top	`range`	Space above section.
Padding bottom	`range`	Space below section.

# Scrolling text Displays a scrolling announcement or message across the section.

Settings	Type	Description
Text	`richtext`	Text to display as scrolling content.

# Subheading Adds a smaller subheading text with adjustable size to the section.

Settings	Type	Description
Text	`richtext`	Subheading text.
Size	`range`	Font size (50–300%).

# Heading Displays a main heading with optional text highlights and size adjustments.

Settings	Type	Description
Text	`richtext`	Main heading. Italicize for highlight.
Size	`range`	Font size (50–300%).
Highlight
Type	`select`	Choose highlight style: `Underline`, `Color`, `Alternate font`, and etc.
Highlight color	`color`	Color for highlight element.
Text color	`color`	Color of highlighted text.

# Text Shows a block of descriptive or informational text with adjustable size.

Settings	Type	Description
Text	`richtext`	Additional descriptive or paragraph content.
Size	`range`	Font size (50–300%).

# Timer Adds a countdown timer with customizable end date, time, and style.

Settings	Type	Description
Style	`select`	Layout style: inline or stacked.
Countdown end date	`text`	Use format `YYYY-MM-DD`.
End time	`text`	Use 12-hour format: `HH:MM`.
AM/PM	`radio`	Choose between `AM` or `PM`.
End of timer message	`richtext`	Optional message after timer expires.
Digits size	`range`	Size of countdown numbers.
Text size	`range`	Size of labels.

# Buttons Displays up to two customizable buttons linking to different pages or actions.

Settings	Type	Description
Stack buttons on larger screens	`checkbox`	Stacks buttons vertically on large screens.
Button 1
Text	`text`	Label for button 1.
Link	`url`	URL destination for button 1.
Button color	`select`	Choose from predefined color styles.
Button style	`select`	Choose from `Solid`, `Outline`, `Soft`, `Text`, and etc.
Size	`select`	Choose size from `Small`, `Medium`, or `Large`.
Button 2
Text	`text`	Label for optional second button.
Link	`url`	URL destination for button 2.
Second button color	`select`	Color styling for second button.
Second button style	`select`	Visual style for second button.
Second button size	`select`	Size for second button.

# Video button Adds a button that opens a linked video popup from YouTube, Vimeo, or MP4.

Settings	Type	Description
Text	`text`	Label for the video button.
Video popup link	`text`	URL from YouTube, Vimeo, or MP4 from Shopify Files.

# Slideshow This is the perfect hero section for most stores. Use the slideshow to create a home page banner with incredible customizability.

### **Section setting**

Settings	Type	Description
Layout
Height	`select`	Choose height of the slideshow on desktop: `Full screen`, `750px`, `One third of screen`, and etc.
Enable mobile height	`checkbox`	Enable a different slide height for mobile devices.
Mobile height	`select`	Choose height for slideshow on mobile devices.
Show slide navigation dots	`checkbox`	Toggles the visibility of navigation dots.
Show slide navigation arrows	`checkbox`	Toggles the visibility of navigation arrows.
Show down arrow	`checkbox`	Displays a down arrow below the slideshow.
Autoplay
Autoplay slideshow	`checkbox`	Automatically rotate slides.
Change slides every	`range`	Set interval for changing slides during autoplay.
Transition
Style	`select`	Choose slide transition style: `Slide`, `Fade`, `Zoom out`, or `Wipe`.
Enable zoom animation on scroll	`checkbox`	Enables zoom animation effect when scrolling.
Enable card scrolling effect	`checkbox`	Overlaps next section slightly for visual card effect.
Increase border radius	`checkbox`	Rounds upper corners of next section when card scrolling is enabled.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.

# Slide This **Slide block** displays an image with optional text, buttons, and video overlay to create a full-width interactive banner section.

Each block in the slideshow represents an individual slide.

Settings	Type	Description
Image
Image	`image_picker`	Main background image (2048px width recommended).
Mobile image	`image_picker`	Optional image for mobile view.
Overlay type	`select`	Adds an overlay: `Disabled`, `Opacity overlay`, and `Text underlay`.
Video
Video background link	`text`	MP4 file used as the background video. Only accepts files uploaded in admin.
Text
Content width	`range`	Width of text container as percentage.
Text position	`select`	Placement of text on the slide: `Top-left`, `Bottom-center`, `Right`, `Center`, and etc.
Text alignment	`select`	Align text `Left`, `Center`, or `Right`.
Subheading	`text`	Small heading text.
Heading	`richtext`	Main heading text. Can include HTML.
Heading size	`range`	Adjust size of the heading.
Highlight
Type	`select`	Choose highlight style: `Underline`, `Squiggle`, `Highlight-color`, and etc.
Highlight color	`color`	Background or accent color used for highlighting.
Text color	`color`	Text color inside the highlight (when applicable).
Text	`textarea`	Paragraph or description content.
Text size	`range`	Adjust size of paragraph text.
Colors
Show text background	`checkbox`	Adds a colored background behind text.
Background	`color`	Background color override.
Text	`color`	Text color override.
Buttons
Stack buttons on larger screens	`checkbox`	Arrange buttons vertically on desktop.
Button 1
Text	`text`	Button label, blank - full image is clickable.
Link	`url`	Destination link for the button.
Color	`select`	Button color theme.
Style	`select`	Visual style of the button: `Outline`, `Solid`, `Soft`, and etc.
Size	`select`	Button size: `Small`, `Medium`, or `Large`.
Button 2
Text	`text`	Button label.
Link	`url`	Destination link.
Color	`select`	Button color theme.
Style	`select`	Visual style of the button.
Size	`select`	Button size.
Video Button
Text	`text`	Label for the video play button.
Video popup link	`text`	Paste link to YouTube, Vimeo, or MP4 for popup video.

# Split images Split images section offers a creative and engaging way to present your content. This section allows you to showcase two images side by side, providing a dynamic visual contrast.

### **Section settings**

Settings	Type	Description
Layout
Height	`select`	Choose the desktop image height: `Full screen`, `750px`, `One half of screen`, and etc.
Enable mobile height	`checkbox`	Enable custom mobile height settings.
Mobile height	`select`	Choose image height for mobile devices.
Mobile layout	`select`	Select how both images are displayed on mobile: `Split`, `Inline`, `First block image`, or `Second block image`.
Content alignment	`select`	Position the text block within the image area: `Top left`, `Center`, `Bottom right`, and etc.
Images
Overlay type	`select`	Adds an overlay: `Disabled`, `Opacity overlay`, and `Text underlay`.
Text
Width	`select`	Set the content container width: `Full width padded`, `Page width`, or `Page width narrow`.
Heading	`richtext`	Add styled heading text with optional emphasis using italics.
Heading size	`range`	Adjust heading size.
Highlight
Type	`select`	Select a style for highlighted words: `Underline`, `Circle`, `Stroke`, and etc.
Highlight color	`color`	Background or decoration color for highlighted text.
Text color	`color`	Text color of highlighted words.
Text	`textarea`	Add supporting text below the heading.
Text size	`range`	Adjust body text size.
Button 1
Text	`text`	Text for the first button. Leave blank to make the whole image clickable.
Link	`url`	Destination URL for button 1.
Color	`select`	Button color: `Primary`, `Secondary`, `White`, or `Black`.
Button style	`select`	Choose visual style: `Solid`, `Outline`, `Border`, `Soft`, or `Text`.
Size	`select`	Button size: `Small`, `Medium`, or `Large`.
Button 2
Text	`text`	Text for the second button.
Link	`url`	Destination URL for button 2.
Second button color	`select`	Choose color for the second button.
Second button style	`select`	Style for the second button.
Second button size	`select`	Size for the second button.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Show text background	`checkbox`	Adds a colored background behind text.
Background	`color`	Background color override.
Text	`color`	Text color override.

# Image Displays an image with an optional separate version for mobile devices.

Each block represents an image with options to upload both desktop and mobile-specific images.

Settings	Type	Description
Image	`image_picker`	Select the main image for desktop and larger screens.
Mobile
Image	`image_picker`	Optional mobile optimized image.

# Video A powerful all-in-one video section for banners and building attention-grabbing promotions With Palo Alto's video section, you can create affluent, modern, video-based promotional sections to enhance and showcase your brand, products, and services.

Looping MP4 or MOV video in the Video section

### Flexible The video section can loop **MP4** or **MOV** format videos from your Shopify content library. Videos can also appear with a pop-up player, ideal for longer video content. Palo Alto presents a clean branded experience for shoppers, including options to add separate poster images for desktop and mobile devices. These images will load first while your video is loading into the browser and then be replaced by the video content. Adding videos to your store is perfect for creating attractive promotions. You can easily incorporate them into any page of your store. ### YouTube and Vimeo YouTube and Vimeo videos can only be displayed as **Popup** videos. Shopify can't control the ads and linked videos that YouTube or Vimeo display in the video, resulting in a very unprofessional background section. If you need to use a YouTube or Vimeo video, we have a couple of recommendations: * To use as a background video, download the YouTube or Vimeo video and convert it to MP4 or MOV format. Then, you can simply add it to your Shopify library. * In the Popup section, you can add the YouTube or Vimeo URL for a Popup video. To represent the video, use a branded image or a still frame from the video. ### Customize Use the section settings to configure all the options for the video section. * To **loop** an MP4 or MOV video, select a supported video from your content library into the video option. * To use the optional **popup** feature, check the toggle option and select a video from your content library or a **YouTube/Vimeo** link address. In the section settings, lower down, find, and adjust the button style and colors to modify the play icon. * In the image section, add a branded image or still frame image for desktop and mobile options. These images will be used while your video is loading into the browser. The mobile version is optional but recommended with a taller portrait-style image. For desktop, we recommend a **16:9** aspect ratio image, and for mobile, an **18:9** or **19:9** aspect ratio image. * Under Layout, use the desktop and mobile height options to find the right size for the **video** and poster **image**. Desktop and mobile controls are available. * For a banner-style image, choose the full-width option or add padding when using it to promote a page that incorporates padding on the sides. * Add any optional text content with the heading and text settings. You can adjust the size for each of them. * You can configure a call-to-action **button** or use the button settings to customize the popup play button style. Two buttons can be displayed. ### Settings Watch this walkthrough video to learn how the settings and features work, including the popup and looping background video: {% embed url="" %}

Settings	Type	Description
Layout
Desktop height	`select`	Sets the section height on desktop. Options include `Full screen`, `Fractions of screen`, or `Fixed px values`.
Enable mobile height	`checkbox`	Toggles custom height for mobile view.
Mobile height	`select`	Sets the section height on mobile devices if enabled.
Width	`select`	Controls the content width: `Narrow`, `Normal`, or `Wide`.
Content alignment	`select`	Aligns content within the video area. Positions include: `Top right`, `Bottom left`, `Center`, etc.
Video
Video background link	`text`	MP4 file used as the background video. Only accepts files uploaded in admin.
Video popup link	`text`	Link to popup video (YouTube, Vimeo, or MP4).
Image	`image_picker`	Placeholder image shown while video loads.
Overlay type	`select`	Adds an overlay: `Disabled`, `Opacity overlay`, and `Text underlay`.
Text
Heading	`richtext`	Main heading text. Supports HTML with optional emphasis.
Heading size	`range`	Adjusts heading size.
Highlight
Type	`select`	Style for emphasized words: `Underline`, `Squiggle`, `Alternate font`, etc.
Highlight color	`color`	Background or line color for the highlight style.
Text color	`color`	Text color within highlighted area.
Text	`textarea`	Optional descriptive text below heading.
Text size	`range`	Adjusts size of the supporting text.
Button 1
Text	`text`	Label for the first button.
Link	`url`	URL the button should link to.
Color	`select`	Button color theme: `Primary`, `Secondary`, `White`, or `Black`.
Button style	`select`	Style of the button: `Solid`, `Outline`, `Text`, or `Solid with border`.
Size	`select`	Size of the button: `Small`, `Medium`, or `Large`.
Button 2
Text	`text`	Label for the second button.
Link	`url`	URL the second button links to.
Color	`select`	Color theme for the second button.
Button style	`select`	Style of the second button.
Size	`select`	Size of the second button.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Show text background	`checkbox`	Adds a colored background behind text.
Background	`color`	Override color scheme for background.
Text	`color`	Override color scheme for text.

# Collections


Collection list	Аdd links to collections you want to highlight on your store pages.	/pages/t6aETuqNOXWJtWySu7hw	/files/3Vx6G9ePSu9BTc1i9YEC
Featured collection	Generate blocks with links to each product page.	/pages/Xv3ZlLeWOTE1TZXyOyBB	/files/fIpEsWU1GfgbCTeoMtyC
Tab collections	Showcase up to three collections on your store pages.	/pages/6QPPlImTmJ38LMvF2C4k	/files/OM3NLIzuJU4Qa856hVBh

# Collection list The collection list is an interactive showcase for your handpicked collections. With rich customization options, you can captivate your audience and urge them to explore more.

### Section settings

Settings	Type	Description
Heading	`text`	Section title shown above the collection list.
Heading size	`range`	Adjusts the font size of the section heading.
Layout
Layout	`select`	Choose between `Grid` or `Carousel` for desktop view.
Alignment	`select`	Aligns the heading `Left` or `Center`.
Collections per row on desktop	`range`	Sets how many collections appear in a row on desktop devices.
Collections per row on mobile	`select`	Sets how many collections display per row on smaller screens: `1` or `2`.
Image shape	`select`	Choose between `Circles` or `Squares` images.
Image aspect ratio	`range`	Adjusts the height-to-width ratio of the collection image display.
Collections
Enable product count	`checkbox`	Displays how many products are in each collection.
Text size	`range`	Adjusts the font size for collection titles.
Overlay text	`checkbox`	Enables text to overlay directly on top of collection images.
Mobile layout
Enable slider	`checkbox`	Converts mobile layout to a horizontal slider.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Text	`color`	Sets the text color for the section.
Section spacing
Width	`select`	Choose between `Full width padded` or `Page width` content area.
Padding top and bottom	`range`	Adds vertical spacing above and below the section.

# Collection Each Collection block represents one collection tile. Add up to 12 blocks.

Settings	Type	Description
Collection	`collection`	Select a Shopify collection to display.
Image	`image_picker`	Optionally override the default collection image.
Heading	`text`	Custom title shown instead of the collection title.
Colors
Text	`color`	Override the text color for this collection block.
Background	`color`	Set a custom background color for this block.
Overlay type	`select`	Adds an overlay: `Disabled` and `Opacity overlay`.

# Featured collection Allows you to showcase products from a selected collection with optional promotional blocks and rich customization. This section supports grid and carousel layouts, responsive settings, highlighted text styles, and optional promotional content. > Note: The mobile view of this section is always a grid unless the mobile slider option is enabled.

### Section settings

Settings	Type	Description
Collection	`collection`	Selects the collection to feature in the section.
Layout	`select`	Chooses how products are displayed: `Grid` or `Carousel`.
Products	`range`	Sets the number of products to display.
Products per row on desktop	`range`	Determines how many products appear per row on desktop. Applies to both grid and carousel layouts.
Products per row on mobile	`select`	Controls product layout on mobile (1 or 2 per row).
Text
Text alignment	`select`	Sets alignment for the heading and text: `Left`, `Center`, or `Right`.
Heading	`richtext`	Displays the main heading. Italicized words can be styled using the highlight settings.
Heading size	`range`	Adjusts heading font size as a percentage of the base size.
Highlight
Type	`select`	Selects the visual style to apply to highlighted (italicized) words in the heading.
Highlight color	`color`	Sets the background or underline color for highlighted text.
Text color	`color`	Sets the color of highlighted words (if applicable).
Text	`richtext`	Displays descriptive content about the collection.
Text size	`range`	Adjusts text font size as a percentage of the base size.
Button
Button position	`select`	Positions the button at the `Top` or `Bottom`.
Text	`text`	Text label for the call-to-action button.
Button color	`select`	Sets the button’s color style. Options include `Primary`, `Secondary`, `White`, or `Black`.
Button style	`select`	Visual styling for the button: `Solid`, `Outline`, `Soft`, and etc.
Size	`select`	Sets the size of the button: `Small`, `Medium`, or `Large`.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Mobile layout
Enable slider	`checkbox`	Enables horizontal sliding on mobile layout.
Section spacing
Width	`select`	Sets section width: `Page width` or `Full width padded`.
Padding top and bottom	`range`	Controls top and bottom spacing in pixels.

# Promo Displays a promotional image with optional heading, text, and button to advertise offers or highlight content within your store grid layout. {% hint style="warning" %} You can add up to 5 promo blocks to appear within the product grid. {% endhint %}

Settings	Type	Description
Image	`image_picker`	Uploads an image to display in the promo.
Layout
Show in position	`range`	Determines the product slot in which the promo should appear.
Width	`select`	Sets promo block width: `Full width`, `2 grid items`, or `Grid item`.
Text
Heading	`richtext`	Promo headline with support for highlight styling.
Heading size	`range`	Adjusts promo headline size.
Highlight
Type	`select`	Applies special style (`Underline`, `Circle`, etc.) to italicized heading words.
Highlight color	`color`	Sets the decoration color for highlighted words.
Text color	`color`	Sets the color of highlighted text.
Text	`textarea`	Adds short descriptive promo content.
Text size	`range`	Controls promo text size.
Text color	`select`	Sets promo text color to `Light` or `Dark`.
Content position	`select`	Positions the text over the image: `Top left`, `Center`, `Bottom right`, and etc.
Content layout	`select`	Choose a layout style: `Stacked` or `Inline`.
Colors
Overlay type	`select`	Add an opacity or text underlay: `Disabled`, `Opacity`, or `Text underlay`.
Background color	`color`	Fallback background color if no image is used.
Show text background	`checkbox`	Adds a colored background behind text.
Background	`color`	Override color scheme for background.
Text	`color`	Override color scheme for text.
Button
Button text	`text`	Sets the button text. Leave blank to make entire image clickable.
Button URL	`url`	Destination link for the promo button or image.
Button color	`select`	Sets button color. Options: `Primary`, `Secondary`, `White`, or `Black`.
Button style	`select`	Select a style: `Solid`, `Outline`, `Soft`, `Text`, or `Solid with border`.
Size	`select`	Sets button size: `Small`, `Medium`, or `Large`.

# Tab collections The 'Tab collections' section is here to help you present your *best sellers*, *new arrivals*, and *more* with a modern and customizable design.

### Section settings

Settings	Type	Description
Layout
Products per row on mobile	`select`	Choose number of products per row on mobile: `1` or `2`.
Image aspect ratio	`range`	Control image aspect ratio.
Content alignment	`select`	Align content `Center` or `Left`.
Heading	`text`	Section title.
Heading size	`range`	Size of section heading.
Text	`text`	Subheading or description text.
Text size	`range`	Size of the subtext.
Tab heading style	`select`	Font style of tab headings.
Tab heading size	`range`	Size of tab headings.
Buttons
Button position	`select`	Position of collection buttons: `Top`, or `Bottom` (only for centered text).
Show collection link buttons	`checkbox`	Toggle visibility of buttons.
Text	`text`	Button label text.
Color	`select`	Button color: `Primary`, `Secondary`, `White`, or `Black`.
Style	`select`	Visual style: `Solid with borders`, `Outline`, `Solid`, `Soft`, or `Text`.
Size	`select`	Button size: `Small`, `Medium`, or `Large`.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Section spacing
Width	`select`	Choose between `Full padded width` or `Page width`.
Padding top	`range`	Top spacing in pixels.
Padding bottom	`range`	Bottom spacing in pixels.

# Collection

Allows you to display a collection of products. Each collection can have the following settings:

Settings	Type	Description
Collection
Tab heading	`text`	The label shown on the tab.
Collection	`collection`	Shopify collection to display.
Products	`range`	Number of products to show.
Image
Show image	`checkbox`	Toggle to show/hide a featured image.
Featured image	`image_picker`	Upload a custom image for the tab.
Overlay
Overlay type	`select`	Adds an overlay: `Disabled` and `Opacity overlay`.
Content
Heading	`richtext`	Overlay heading text.
Heading size	`range`	Size of heading text.
Colors
Text	`color`	Override color scheme for text.
Button
Text	`text`	Optional button label. If left blank, entire image becomes link.
Link	`url`	URL for the button.
Color	`select`	Button color: `Primary`, `Secondary`, `White`, or `Black`.
Button style	`select`	Style for button: `Solid with border`, `Outline`, `Solid`, `Soft`, or `Text`.
Size	`select`	Button size: `Small`, `Medium`, or `Large`.

# Forms


Contact form	Give your costomers a platform to reach out.	/pages/i8hyzJH43xEknNxrzIP8	/files/fEnnKykBY6p1h5SiRlTF
Newsletter	Display a small-sized newsletter signup message.	/pages/dtJBRiQdIVsCbe0zIDJV	/files/VZzGB14q1IyvRrSgAPXo

# Contact form The contact form section is a versatile tool for enhancing communication on your website, making it easier for your customers to reach you.

### Section settings

Settings	Type	Description
Button
Color	`select`	Sets the button color. Options: `Primary`, `Secondary`, `White` or `Black`.
Button style	`select`	Choose the button appearance: `Solid`, `Outline`, `Solid with border`, `Soft` or `Text`.
Size	`select`	Choose the button size: `Small`, `Medium` or `Large`.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Section spacing
Width	`select`	Controls the section container width. Options: `Full width padded,` `Page width` or `Page width narrow`.
Padding top	`range`	Adds spacing above the section.
Padding bottom	`range`	Adds spacing below the section.

# Form heading Adds a customizable heading to the form section for context or titles.

Settings	Type	Description
Form heading	`text`	Heading text displayed above the form. Limited to 1 per form.

# Email Adds an email input field with an optional required setting for collecting customer email addresses.

Settings	Type	Description
Label	`text`	Label for the email field.
Required	`checkbox`	Marks the email field as required.

# Message Adds a multiline text area field for users to enter messages or detailed enquiries.

Settings	Type	Description
Label	`textarea`	Label for the message textarea.
Required	`checkbox`	Marks the message field as required.

# Text line Use a text line to collect additional data such as your customer's first and last names.

Settings	Type	Description
Label	`text`	Label for the input (e.g., 'Name').
Required	`checkbox`	Marks the field as required.

# Telephone This block is set to a telephone input field.

Settings	Type	Description
Label	`text`	Label for the phone number input.
Required	`checkbox`	Marks the phone field as required.

# Divider Inserts a visual divider line to separate form sections for clarity.

Settings	Type	Description
Show line	`checkbox`	Toggles a horizontal line divider.

# Single checkbox Customize the label and mark it as required. Multiple checkboxes can be checked at the same time.

Settings	Type	Description
Label	`text`	Label for the checkbox (e.g., 'Subscribe to newsletter').
Required	`checkbox`	Marks the checkbox as required.

# Select dropdown Dropdown field with up to six customizable options.

Settings	Type	Description
Heading	`text`	Label shown above the dropdown.
Include up to six options
Option one to Optional six	`text`	Text for up to six dropdown options. Leave blank to exclude.

# Radio buttons Buttons with customizable options. Unlike checkboxes, only one radio button can be selected at a time.

Settings	Type	Description
Heading	`text`	Heading for the group of radio options.
Required	`checkbox`	Marks the radio field as required.
Include up to six options
Option one to Optional six	`text`	Text for up to six radio button options. Leave blank to exclude.

# Newsletter The newsletter section is a valuable addition to your website, helping you connect with your audience and build a loyal subscriber base.

### Section settings

Settings	Type	Description
Layout
Position	`select`	Aligns content: `Left`, `Center`, `Right`, or `Split` layout.
Text
Heading	`text`	The main heading text for the newsletter section.
Text	`richtext`	Supporting text with rich formatting.
Additional field
Additional fields	`select`	Adds extra input fields: `None`, `Name`, or `First and last name`.
Button text	`text`	Label for the submission button.
Background
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Image	`image_picker`	Optional background image.
Height	`select`	Sets section height: `250px`, `Full screen`, `350px`, and etc.
Overlay
Overlay type	`select`	Adds an overlay: `Disabled` and `Opacity overlay`.
Section spacing
Width	`select`	Width options: `Full width padded`, `Page width narrow`, or `Page width`.
Padding top	`range`	Top spacing of the section.
Padding bottom	`range`	Bottom spacing of the section.

# Layout


Custom Code	Add custom code snippets.	/pages/qXW45jb00XCOSSX8VYtV	/files/wIH6kdG9tBkrSfAej6eu
Divider	A simple way to separate sections.	/pages/gcNQYGRI1RBCfrBTtKFT	/files/hZjOo8P1XnpCoiB10y04

# Custom code Implement your own HTML or liquid code into your website. The custom code section is also a great tool to integrate older apps or embed custom elements.

### Section settings

Settings	Type	Description
Custom code	`liquid`	Add custom HTML or Liquid code. Useful for app snippets or advanced customization.
Section spacing
Width	`select`	Controls the content width: `Full width`, `Full width padded`, `Page width`, or `Page width narrow`.
Padding top	`range`	Adjusts the top padding.
Padding bottom	`range`	Adjusts the bottom padding.

# Divider The divider section is a powerful tool to toggle a sleek line. This section offers a clean and sophisticated design, making it ideal for creating a modern look.

### Section settings

Settings	Type	Description
Show line	`checkbox`	Toggles the visibility of a horizontal divider line in the section.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Section spacing
Width	`select`	Controls the content width: `Full width`, `Full width padded`, `Page width`, or `Page width narrow`.
Padding top and bottom	`range`	Sets the top and bottom padding space for the section, in pixels.

# Products


Featured product	Bring a product gallery and form to your store pages.	/pages/LN5pUfmL2zoKE0TKa07I	/files/2Vm14lhIwLMGb7LjeSaF
Product list	Show products or collections.	/pages/n95oFyzA3q6zSt5GLfUy	/files/McOxtpMmZL4L42moJXrh
Products with image	Visual product showcase.	/pages/3OehM0XrJDwrMxT3bXNq	/files/oeD5OwExjwkS08kbYVIj
Recently viewed products	Showcase last viewed items.	/pages/cNaPukmILEhhVKAzaxG2	/files/lFV2hfo8qIN1bmLiyndF
Shop the Look Banner	Showcase a curated collection of products.	/pages/E8lUy0KD2xZnDQyTlKeu	/files/x9GQlcW22qXOZP8q1j11
Shop the Look Grid	Products in a customizable grid with interactive hotspots.	/pages/PKQnh0mjz5kgvi2Admat	/files/y94QCAoTIM3TLWRLSmCp

# Featured product Versatile and dynamic component that allows you to showcase a single product prominently in your store. This section is designed to enhance the visual appeal of a product while providing a seamless shopping experience for your customers.

{% hint style="info" %} Shopify has a limit of showing up to 20 unique product handles per page. Please keep this in mind when using sections with a product select option, such as the Featured Product section. {% endhint %} {% hint style="warning" %} All blocks for this section can be seen [here](/products/blocks/product-blocks). {% endhint %} ### **Section settings**

Settings	Type	Description
Product	`product`	Choose a specific product to be featured in this section.
Product description
Enable sticky form	`checkbox`	When enabled, the product form (e.g., add to cart button) will stick to the screen as the user scrolls, keeping it visible for easy access.
Image layout
Desktop layout	`select`	Choose the layout for product images on desktop: `Grid`, `Carousel with thumbnails`, or `Stacked`.
Image width	`select`	Adjust the width of the product image for the desktop layout: `Standard` or `Large`.
Hide product thumbnails (carousel layout only)	`checkbox`	Hides the product thumbnails when using the carousel layout.
Equal image aspect ratio	`checkbox`	Ensures all images in the grid layout have the same aspect ratio, creating a more uniform look.
Media
Enable zoom	`checkbox`	Allows users to zoom in on the product image when hovered over for a closer look.
Enable video looping	`checkbox`	When enabled, any product videos will loop continuously when played.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Section spacing
Width	`select`	Adjust the width of the section: `Full width padded` or `Page width`.
Padding top and bottom	`range`	Adjust the top and bottom padding for the section, controlling the space above or below the product.

# Products list The products list section is a flexible Shopify section designed to showcase a curated group of collections or individual products with customizable styling, layout, and interactivity.

### Section settings

Settings	Type	Description
Title	`text`	Heading for the section.

Heading size	`range`	Adjusts the heading font size.
Button
Color	`select`	Defines button color: `Primary`, `Secondary`, `White`, or `Black`.
Button style	`select`	Choose between: `Solid`, `Outline`, `Soft`, and etc. styles.
Size	`select`	Controls button size: `Small`, `Medium`, or `Large`.
Image
Image aspect ratio	`range`	Adjusts image proportions.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Section spacing
Width	`select`	Controls section width: `Full padded`, or `Page width.`
Padding top	`range`	Top padding in pixels.
Padding bottom	`range`	Bottom padding in pixels.

# Collection Displays a selected collection with its products, optional heading override, button text, and customizable rotating circle text or image badge.

> It supports up to 3 blocks, either *Product* or *Collection* type.

Settings	Type	Description
Collection	`collection`	Select a Shopify collection (shows 5 products).
Heading	`text`	Optional title override.
Button text	`text`	Text for the button.
Circle text
Show circle text	`checkbox`	Toggle display of circular text.
Hide on mobile	`checkbox`	Hides circle text on smaller screens.
Color	`color`	Circle text color.
Rotate animation	`select`	Rotation behavior: `None`, `Rotate`, or `Rotate on scroll`.
Text	`text`	Circle message.
Word spacing	`range`	Adjust spacing between circle words.
Size	`range`	Adjust circle font/image size.
Custom image	`image_picker`	Replaces circle text with a custom image.

# Product Displays a specific product with options to override title, description, images, add a second variant image, and include customizable rotating circle text or image badge.

> It supports up to 3 blocks, either *Product* or *Collection* type.

Settings	Type	Description
Product	`product`	Select a Shopify product.
Title	`text`	Optional title override.
Description	`richtext`	Optional description override.
Button text	`text`	Text for the button.
Show second variant image	`checkbox`	Displays an alternate product image.
Custom image 1	`image_picker`	Overrides product image with a custom one.
Custom image 2	`image_picker`	Second custom image (used if enabled).
Circle text
Show circle text	`checkbox`	Enables circle overlay text.
Hide on mobile	`checkbox`	Hides circle text on small screens.
Color	`color`	Circle text color.
Rotate animation	`select`	Rotation animation: `None`, `Rotate`, or `Rotate on scroll`.
Text	`text`	Circle message.
Word spacing	`range`	Space between words in circle text.
Size	`range`	Circle text/image size.
Custom image	`image_picker`	Replaces circle text with an image.

# Products with image The products with image section can help you display a collection of products.

## Section settings

Settings	Type	Description
Collection	`collection`	Select a product collection to feature.
Product list	`product_list`	Manually select specific products to display.
Image position	`select`	Position of the background image relative to products: `Image left,` or `Image right`.
Products	`range`	Number of products to display.
Products per row on desktop	`select`	Number of products per row on desktop: `1` or `2`.
Products per row on mobile	`select`	Number of products per row on mobile: `1` or `2`.
Background image
Desktop image	`image_picker`	Upload background image for desktop view.
Mobile image	`image_picker`	Upload background image for mobile view.
Overlay opacity	`range`	Set overlay darkness.
Text
Position	`select`	Text block alignment over image: `Top left`, `Middle center`, `Bottom center`, and etc.
Heading	`richtext`	Main heading (supports HTML, including italic highlights).
Heading size	`range`	Adjust heading size.
Highlight
Type	`select`	Highlight style for emphasized words in the heading: `Circle`, `Underline`, `Stroke`, and etc.
Highlight color	`color`	Color used for highlight.
Text color	`color`	Color of the highlighted text.
Text	`richtext`	Descriptive or promotional content under the heading.
Text size	`range`	Adjust supporting text size.
Button
Text	`text`	Button label. Leave blank to link the whole image area.
Link	`url`	URL to navigate to on button click.
Button color	`select`	Choose button color style: `Primary`, `Secondary`, `Black`, or `White`.
Button style	`select`	Button design: `Solid`, `Outline`, `Text`, and etc.
Size	`select`	Choose button size: `Small`, `Medium`, or `Large`.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Show text background	`checkbox`	Adds a colored background behind text.
Background	`color`	Set section background color.
Text	`color`	Text color override.
Mobile layout
Enable slider	`checkbox`	Enable horizontal scrolling slider for mobile devices.
Section spacing
Width	`select`	Section width: `Full width padded` or `Page width`.
Padding top	`range`	Top spacing in pixels.
Padding bottom	`range`	Bottom spacing in pixels.

# Recently viewed products This section displays a list of recently viewed products with customization options for product limit, layout, and spacing.

### **Section settings**

Settings	Type	Description
Product limit	`range`	Maximum number of recently viewed products to display.
Display threshold	`range`	Minimum number of products required to show the section. Helps avoid showing an empty or sparse layout.
Title	`text`	Section heading text.
Layout
Layout	`select`	Choose between `Grid` or `Carousel` layout.
Products per row on mobile	`select`	Number of products shown per row on mobile devices. Options:`1` or `2`.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Section spacing
Width	`select`	Section width. Options: `Full width padded` or `Page width`.
Padding top	`range`	Space above the section.
Padding bottom	`range`	Space below the section.

# Shop the Look Banner This section allows you to add a prominent image with interactive product hotspots. It’s ideal for showcasing popular products visually appealingly with customization. [**View Shop the Look Grid section.**](/sections/sections/products/shop-the-look-grid)

### Section settings

Settings	Type	Description
Image
Image	`image_picker`	Upload the main banner image.
Layout
Image scaling ratio	`range`	Adjusts the banner image’s aspect ratio (width to height).
Show product titles arrow	`checkbox`	Toggles arrows for hotspot product titles.
Default to open	`checkbox`	Opens the first product card by default.
Product card image aspect ratio	`range`	Adjusts product image size within the hotspot card.
Button color	`select`	Sets button color. Options: `Primary`, `Secondary`, `White`, or `Black`.
Button style	`select`	Choose from `Solid`, `Outline`, `Solid with border`, or `Soft`.
Text
Heading	`text`	Main heading for the section.
Heading size	`range`	Adjust heading font size.
Text	`richtext`	Subheading or description.
Text size	`range`	Adjusts body text size.
Text alignment	`select`	Choose `Left` or `Center` alignment.
Mobile
Mobile image	`image_picker`	Optional alternate image for mobile view.
Image scaling ratio	`range`	Adjust mobile image aspect ratio.
Popup heading	`text`	Title shown on popup card.
Show free shipping message	`checkbox`	Displays a message indicating free shipping.
Colors
Section
Hotspot color	`color`	Sets color for the product hotspot.
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Hotspot contents
Background	`color`	Background color inside hotspot popups.
Section spacing
Width	`select`	Section width. Options: `Full width`, or `Full width padded`.
Padding top	`range`	Space above section.
Padding bottom	`range`	Space below section.

# Product This block is designed to visually display a single product with a customizable hotspot and title positioning on both desktop and mobile views. It includes settings to fine-tune the placement of interactive or informative elements over a product image.

Settings	Type	Description
Product	`product`	Select a product to display at this hotspot.
Hotspot position
Desktop
Horizontal	`range`	X-axis hotspot placement on desktop.
Vertical	`range`	Y-axis hotspot placement on desktop.
Mobile
Horizontal	`range`	X-axis hotspot placement on mobile.
Vertical	`range`	Y-axis hotspot placement on mobile.
Product title position
Desktop
Placement	`range`	Title placement around the hotspot for desktop.
Mobile
Placement	`range`	Title placement around the hotspot for mobile.

# Shop the Look Grid The **Shop the Look Grid** section is designed to display a grid layout of products in an interactive format, where users can view products linked to specific 'looks' in a visually appealing way. [**View Shop the Look Banner section.**](/sections/sections/products/shop-the-look-banner)

### Section settings

Settings	Type	Description
Products per row on desktop	`range`	Set how many products appear per row.
Image	`image_picker`	Upload the main image for the section.
Image position	`select`	Choose image alignment: `Left` or `Right`.
Set custom aspect ratio	`checkbox`	Toggle to enable a custom aspect ratio.
Aspect ratio	`range`	Define image aspect ratio.
Heading	`text`	Title of the section.
Heading size	`range`	Scale the heading size.
Text	`richtext`	Rich text content under the heading.
Text size	`range`	Scale the paragraph text size.
Text alignment	`select`	Align text `Left` or `Center` (desktop only).
Show hotspots	`checkbox`	Toggle to display product hotspots.
Show buttons arrow	`checkbox`	Show/hide arrow in buttons.
Popup heading	`text`	Title shown in the product popup.
Show free shipping message	`checkbox`	Toggle visibility of free shipping text.
Colors
Hotspot color	`color`	Color for product hotspot markers.
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Hotspots contents
Background	`color`	Background color for popup content.
Button
Text	`text`	Button label text.
Link	`url`	URL the button should link to.
Color	`select`	Choose button color style.
Style	`select`	Choose button appearance style.
Size	`select`	Choose button size: `Small`, `Medium`, or `Large`.
Section spacing
Width	`select`	Set section width: `Full width padded` or `Page width`.
Padding top	`range`	Padding above the section.
Padding bottom	`range`	Padding below the section.

# Product Displays a selected product with configurable hotspot position and product title placement for both desktop and mobile views, allowing precise alignment of interactive product markers on imagery.

Settings	Type	Description
Product	`product`	Select the product to feature.
Hotspots position
Desktop
Horizontal	`range`	X-axis hotspot position.
Vertical	`range`	Y-axis hotspot position.
Mobile
Horizontal	`range`	X-axis position on mobile.
Vertical	`range`	Y-axis position on mobile.
Product title position
Desktop
Placement	`range`	Angle position of the info bubble.
Mobile
Placement	`range`	Angle position for mobile view.

# Storytelling


Accordions with images	FAQ section with images.	/pages/5RRENfJheNoLHz86d8qx	/files/8v4GZVwOIIQHAwtODlqk
Blog posts	Showcase the latest posts from one of your blogs on your store pages.	/pages/NA0JsgaWD1fjOBp3UWOc	/files/sm4O1j1GYEGkGM14m0iM
Grid	Add a mix of collections, products, images, and text to make this section your own.	/pages/GPzUYxLh5ExiKW17crPR	/files/K9EILVFFo7xXGjxn9Sor
Image accordions	Set a unique look and showcase multiple images.	/pages/nRF5x7PbSnsfOfGuNUoh	/files/OLe3ImAQNTqeK3aC8yxT
Image with text	Use this more striking design to grab your customer's attention.	/pages/3NXIbY14dNdHPIrZfKBo	/files/atD7PgepaplMndhzpm33
Locations	Let people know about your physical locations.	/pages/jwWpzCc23sP30CszyLPZ	/files/GP40IDcnrPYC6swrioyR
Overlapping images	A small section perfect for a brief summary with the ability to use images and showcase your products.	/pages/2MVDrNJKO1RoZX8Qb3DC	/files/mji15LGcPWBvxdIQOvlK
Press/Logo	Used to present short bursts of information to your customers.	/pages/xTxsT1fZZRiZ2jKmWctC	/files/dXiDuocHHW734b8WYRLr
Promotion row	Show information about current promotions.	/pages/tcJPLWTj8sakohueDqbF	/files/WUOFYDu1VPbbDmqaIbXs
Shoppable blog posts	Generate traction and bring exposure to your blogs on any store page.	/pages/ItIMNUcHyaTTpbKei3dv	/files/zA9J533J651fEQy5yYiP
Social gallery	Lets you upload images, add text, and set button links.	/pages/I7lsbMGV8c0JDlUaf8Ln	/files/4c4xnwuOhqNw3IBqKBKq
Sticky image cards	The section displays images with customizable text and buttons.	/pages/L11Wj00NRJZ45QVpOmpi	/files/NQ9gyl433RurB7EaQG5b
Sticky images and text	Section with images, text, and buttons, available in both vertical and horizontal layouts.	/pages/FGmX6ThmOeBsMBda6oI2	/files/0cQ7qm2zfUlCSKFwrlrO
Testimonials	Add quotes from business partners and client testimonials to your store pages.	/pages/FHnlVhp2U5kGkPtRJN6o	/files/2jnq40NPOBIkZJWNip7f
Testimonials with images	Customer reviews with customizable text and image.	/pages/nQGeeV69HeLITUIA6PUW	/files/5wtgg0bmRdFish0LFUZH
Text columns with images	Create your own highlights from the theme editor without having the need to create blog posts.	/pages/oCDsnbouiR9Uia75Gq8e	/files/MVnyMUfjj9hNpDlszhA4

# Accordions with images This section works like a regular FAQ accordion but lets you add an image or icon to each item.\ Use it to create visual FAQs, policy guides, or support steps where a quick image cue helps readers. [**View the Accordion section.**](/sections/sections/text/accordions)

## Section settings

Settings	Type	Description
Layout
Layout	`select`	Choose between a `One column` or `Two columns` layout.
Show divider lines	`checkbox`	Adds border lines between accordion items (helpful for transparent backgrounds).
Border thickness	`select`	Select either `Normal` or `Bold` border weight.
Text
Content alignment	`select`	Align text content: `Center` or `Left`.
Subheading	`text`	Optional subheading above the main section title.
Heading	`text`	Main heading of the section.
FAQ heading style	`select`	Choose text styling: `Heading`, `Body`, or `Accent`.
FAQ heading size	`range`	Scale heading size from 100% to 200%.
Text	`richtext`	Optional introductory or descriptive text under the heading.
Colors
Tabs	`color`	Background color of each accordion tab.
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Border color	`color`	Customize the color of the accordion dividers.
Section spacing
Width	`select`	Adjust container width: `Full width padded`, `Page width`, or `Page width narrow`.
Padding top	`range`	Control top padding.
Padding bottom	`range`	Control bottom padding.

# Text Perfect for quick answers with personality - combine rich text and an optional icon to make FAQs both clear and visually engaging

Settings	Type	Description
Heading	`text`	Title of the accordion item (typically a question).
Text	`richtext`	Expandable answer content (supports rich text).
Image	`image_picker`	Optional image/icon to display with the accordion title.
Image width	`range`	Set icon width between 20px - 100px.
Image position	`select`	Position the image: `Inline left` (beside heading) or `Above left`.

# Page Ideal when you want to pull in full, reusable content from a Shopify page great for size guides, policy pages, or detailed resources.

Settings	Type	Description
Heading	`text`	Heading shown for this accordion item.
Content	`page`	Pulls content directly from a selected Shopify page.

# Blog posts This section allows for the display of blog articles in a customizable layout. Provides flexibility in blog styles, image configurations, text options, and button customization to enhance user engagement.

### Section settings

Settings	Type	Description
Layout
Blog	`blog`	Select the blog source to display posts from.
Blog style	`select`	Choose between `Standard` or `Photo background` styles.
Image aspect ratio	`range`	Controls the width-to-height ratio of images, from wide to tall.
Number of rows	`range`	Defines how many rows of articles are shown.
Articles per row on desktop	`range`	Sets the number of blog posts per row on desktop screens.
Articles per row on mobile	`select`	Sets the number `1` or `2` of blog posts per row on mobile devices.
Show tags	`checkbox`	Enables or disables display of post tags.
Show author	`checkbox`	Displays the author of each blog post.
Show date	`checkbox`	Displays the publish date of each post.
Show comment count	`checkbox`	Displays the number of comments for each post.
Image
Default blog image	`image_picker`	Image used if the blog post has no featured image.
Image replacement color	`select`	Select a fallback background color for posts without images.
Text
Heading	`text`	Optional section heading above the blog posts.
Button
Text	`text`	Text label for the CTA button.
Button color	`select`	Color theme for the button.
Button style	`select`	Choose from `Solid`, `Outline`, `Soft`, `Solid with border` or `Text` styles.
Size	`select`	Defines the button size: `Small`, `Medium` or `Large`.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Overlayed text	`color`	Color of any text overlay on images.
Section spacing
Width	`select`	Choose between `Page width,` `Page width narrow`, or `Full width padded`.
Padding top	`range`	Controls spacing above the section.
Padding bottom	`range`	Controls spacing below the section.

# Grid Create a grid of customizable blocks of different sizes. The grid section is a great way to break up the look of your page and set apart your store.

### Section settings > Using one 33% and one 66% wide block will fill out a row perfectly.

Settings	Type	Description
Layout
Desktop height	`select`	Sets the height of the grid section on desktop devices.
Enable mobile height	`checkbox`	Enables a custom height setting for mobile devices.
Mobile height	`select`	Sets the height of the grid section on mobile devices.
Text
Heading size	`range`	Adjusts the font size of the heading text within the grid section.
Text size	`range`	Adjusts the font size of the paragraph or body text within the grid section.
Buttons
Button color	`select`	Select the button color: `White`, `Black`, `Primary`, or `Secondary`.
Button style	`select`	Choose the visual style of the primary button: `Solid`, `Outline`, `Soft`, and etc.
Size	`select`	Sets the size of the primary button: `Small`, `Medium`, or `Large`.
Secondary button color	`select`	Selects the color theme for the secondary button:`White`, `Black`, `Primary`, or `Secondary`.
Button style	`select`	Choose the visual style of the secondary button:`Solid`, `Outline`, `Soft`, and etc.
Size	`select`	Sets the size of the secondary button: `Small`, `Medium`, or `Large`.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Overlayed text	`color`	Color of any text overlay on images.
Mobile
Enable slider	`checkbox`	Enables slider functionality, allowing grid items to scroll horizontally like a carousel.
Items per row	`select`	Determines how many grid items are displayed per row on desktop: `1` or `2`.
Overlay text on images	`checkbox`	Displays text over the images instead of below them.
Section spacing
Width	`select`	Controls the overall content width of the section: `Full width`, `Page width`, `Full width padded`, `Page width narrow`.
Add spacing	`checkbox`	Adds internal spacing between items in the grid.
Padding top and bottom	`range`	Sets the amount of space above or below the grid section.

# Collection Displays a collection with customizable layout, image, text, buttons, and colors.

Settings	Type	Description
Layout
Width	`select`	Sets the block width within the section layout:`25%`, `33%`, `50%`, `66%`, `100%`.
Collection	`collection`	Selects the Shopify collection to display in this block.
Replacement image	`image_picker`	Provides a fallback image if the collection has no featured image.
Overlay type	`select`	Adds an overlay: `Disabled` and `Opacity overlay`.
Text
Content position	`select`	Sets the position of text over the image: `Center`, `Left`, `Top left`, and etc.
Subheading	`text`	Adds a small heading or label above the main title.
Show description	`checkbox`	Toggles the display of the collection's description text.
Buttons
Button text	`text`	Sets the label for the call-to-action button.
Colors
Show text background	`checkbox`	Adds a colored background behind text.
Background	`color`	Background color override.
Text	`color`	Text color override.

# Product Highlights a single product with flexible layout, content placement, pricing visibility, and styling controls.

Settings	Type	Description
Layout
Width	`select`	Sets the width of the block within the section layout: `25%`, `33%`, `50%`, `66%`, `100%`.
Product	`product`	Selects a specific Shopify product to feature in the block.
Overlay type	`select`	Adds an overlay: `Disabled` and `Opacity overlay`.
Text
Content position	`select`	Determines the position of text content over the image: `Center`, `Left`, `Bottom center`, `Right` and etc.
Subheading	`text`	Adds a smaller line of text above the main product text, often used as a label.
Text	`text`	Main text content, typically used for product description or custom copy.
Show price	`checkbox`	Toggles whether the product price is displayed in the block.
Buttons
Button text	`text`	Label for the call-to-action button (e.g., 'Shop now').
Colors
Show text background	`checkbox`	Adds a colored background behind text.
Background	`color`	Background color override.
Text	`color`	Text color override.

# Image Showcases an image with customizable overlay type, heading, colors, description, and optional buttons with links.

Settings	Type	Description
Layout
Width	`select`	Determines the block's width: `25%`, `33%`, `50%`, `66%`, `100%`.
Image	`image_picker`	Allows you to upload or select an image.
Overlay type	`select`	Adds an overlay: `Disabled` and `Opacity overlay`.
Text
Content position	`select`	Sets the position of the text content over the image: `Center`, `Left`, `Right`, etc.
Subheading	`text`	Adds a smaller title or label above the main heading.
Heading	`text`	Sets the main heading text for the block.
Description	`text`	Adds descriptive body text or supporting content below the heading.
Buttons
Button text	`text`	Defines the label for the primary button.
Button link	`url`	URL the primary button will link to.
Second button text	`text`	Label for the optional secondary button.
Second button link	`url`	URL the secondary button will link to.
Colors
Show text background	`checkbox`	Adds a colored background behind text.
Background	`color`	Background color override.
Text	`color`	Text color override.

# Text Presents a customizable text section with headings, descriptions, buttons, and background color options.

Settings	Type	Description
Layout
Width	`select`	Sets the width of the text block: `25%`, `33%`, `50%`, `66%`, `100%`.
Text
Content position	`select`	Defines the alignment of the content within the block: `Left`, `Center`, `Top left`, `Bottom right`, and etc.
Subheading	`text`	Optional smaller heading above the main heading.
Heading	`text`	Main headline text for the block.
Description	`text`	Body text or paragraph for additional content.
Buttons
Button text	`text`	Text for the primary call-to-action button.
Button link	`url`	URL the primary button will link to.
Second button text	`text`	Text for the secondary call-to-action button.
Second button link	`url`	URL the secondary button will link to.
Colors
Background	`color`	Background color override.
Text	`color`	Text color override.

# Image accordions With the image accordions section, you can effortlessly create immersive and engaging experiences for your website visitors. This dynamic section combines stunning images, customizable text, and interactive elements to showcase your content in a unique way.

### Section settings {% hint style="warning" %} These global settings affect the overall layout, height, spacing, and typography of the entire accordion section. {% endhint %}

Settings	Type	Description
Layout
Height	`select`	Sets overall height of the accordion section.
Enable mobile height	`checkbox`	Enables separate height setting for mobile devices.
Mobile height	`select`	Sets section height on mobile.
Heading
Size	`range`	Adjusts the size of the section heading.
Colors
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Section spacing
Width	`select`	Controls the section width: `Full width`, `Full width padded`, or `Page width`.
Padding top	`range`	Top spacing in pixels.
Padding bottom	`range`	Bottom spacing in pixels.

# Image block Each block in this section represents one image accordion panel. You can add up to 4 panels.

Settings	Type	Description
Image	`image_picker`	Upload desktop image.
Mobile image	`image_picker`	Optional image for mobile view.
Overlay type	`select`	Adds an overlay: `Disabled`, `Opacity overlay` and `Text underlay`.
Text
Width	`select`	Width of text area: `Narrow`, `Normal`, or `Wide`.
Position	`select`	Positions text within the image area: `Left`, `Right`, `Center`, and etc.
Heading	`textarea`	Main heading text displayed on the image.
Text	`textarea`	Supporting text beneath the heading.
Button 1
Text	`text`	Label for the first button. Leave blank to link entire image.
Link	`url`	URL for the first button.
Button color	`select`	Choose from `Primary`, `Secondary`, `White`, or `Black`.
Button style	`select`	Visual style: `Solid`, `Outline`, `Solid with border`, `Soft`, or `Text`.
Size	`select`	Size of button: `Small`, `Medium`, or `Large`.
Button 2
Text	`text`	Label for the second button.
Link	`url`	URL for the second button.
Button color	`select`	Choose from `Primary`, `Secondary`, `White`, or `Black`.
Button style	`select`	Visual style: `Solid`, `Outline`, `Solid with border`, `Soft`, or `Text`.
Size	`select`	Size of button: `Small`, `Medium`, or `Large`.

# Image with text The image with text allows you to configure a section in your website that includes a combination of images, text, and buttons. This section is highly customizable, providing options for layout, styling, colors, padding, and spacing.

### Section settings

Settings	Type	Description
Layout
Show divider lines	`checkbox`	Displays divider lines within transparent background accordions.
Increase border radius	`checkbox`	Applies more rounded corners to images and content blocks with background color.
Desktop Height	`select`	Controls section height on desktop with multiple fixed and full-screen options.
Enable mobile height	`checkbox`	Enables height settings specifically for mobile devices.
Mobile height	`select`	Sets height for the section on mobile view.
Layout style	`select`	Choose between `Inline` or `Overlay` layout style for image and text arrangement.
Image position	`select`	Determines if the image appears on the `Left` or `Right`.
Image width	`select`	Controls the width of the image when using inline layout.
Image
Image	`image_picker`	Uploads the image to display in the section.
Colors
Block background	`color`	Sets a background color behind content blocks.
Color scheme	`color_scheme`	Applies a predefined theme color scheme to the section.
Section spacing
Width	`select`	Controls the maximum width of the content container.
Add spacing	`checkbox`	Adds spacing around the section content.
Padding top	`range`	Sets padding at the top of the section.
Padding bottom	`range`	Sets padding at the bottom of the section.

--- [Next Page](/llms-full.txt/1)