{ "componentChunkName": "component---src-templates-manual-jsx", "path": "/shopify-themes/allure/manual/", "result": {"pageContext":{"manual":{"page_header":{"background":null,"backgroundOpacity":100,"color":"#000000","fieldGroupName":"page_header","title":"Allure Theme manual from UTD ","opacity":100,"position":"on","size":{"desktop":64,"tablet":48,"mobile":32},"spaces":{"top":null,"bottom":null,"leftright":null,"units":"em"}},"slug":"__trashed","title":"Allure Theme manual","id":"cG9zdDoxNjQ3OA==","modifiedGmt":"2026-10-20T11:51:58","acfManual":{"postType":{"title":"Allure Theme","uri":"/shopify-themes/allure/"},"metaData":{"title":"Allure Shopify Theme Manual","description":"Learn how to set up, customize, and manage the Allure Shopify theme with step-by-step guides, section settings, and troubleshooting tips"},"sections":[{"fieldGroupName":"manual_Acfmanual_Sections_Manual","manualCategory":[{"fieldGroupName":"manual_category","manualCategoryTitle":"General ","manualCategoryBlocks":[{"blockContent":"

This settings block is intended for general Typography settings on the site.

\n

In order to get to the Typography settings block, you need to go to Customizer → Theme Settings → Typography.

\n
\n
\n
\n
\n
\n

\"Typography\"

\n

Settings

\n

Base and heading fonts

\n

\"fonts\"

\n
    \n
  1. \n

    Base font – font picker for plain text throughout the store;

    \n
    2. \n
  2. \n

    Heading font – font picker for headings throughout the store;

    \n
    3. \n
  3. \n

    Uppercase – setting allows you to set text for headings in uppercase;

    \n
    4. \n
  4. \n

    Base font size – plain text size;

    \n
    5. \n
  5. \n

    Heading font size – heading text size.

    \n
    6. \n
\n","blockTitle":"Typography","fieldGroupName":"manual_category_blocks","hash":"general-typography"},{"blockContent":"

Color Schemes Guide

\n

\"color

\n

The Color Schemes section allows you to customize the appearance of your Shopify store by defining a color palette and assigning it to various elements of the theme. Below is a step-by-step guide to help you configure this section effectively.

\n

Main Scheme Selection

\n

\"color

\n

Main Scheme – choose a predefined color scheme for your store. Select a scheme that best matches your branding. The colors in the selected scheme will be applied to the store globally. Default Value: scheme-1

\n

Color Scheme Group

\n
\n
\"edit
\n
\n

The Color Scheme Group provides detailed customization for text, backgrounds, buttons, borders, and other elements.

\n

Text Colors

\n

Customize the colors for various text types:

\n\n

Backgrounds

\n

Control the background colors for different sections of the site:

\n\n

Button Colors

\n

Primary Buttons

\n\n

Secondary Buttons

\n\n

Border Colors

\n

Define borders for elements:

\n\n

Support Colors

\n\n

Overlay

\n\n

Social Buttons

\n

Customize the appearance of social media buttons:

\n\n

Preloader

\n\n

Slider Arrows

\n\n

Icons

\n\n

Color Scheme Inheritance in Sections

\n

\"additional

\n
\n
\n
\n
\n
\n
\n
\n
\n

By default, all sections in your theme inherit the color scheme from the global theme settings. However, each section can be customized individually with the following options:

\n

Settings for Sections

\n

Color Scheme Inheritance – enable color scheme inheritance to automatically use the color scheme defined in the global theme settings. Default Value: Enabled (true)

\n

Custom Color Scheme – choose a custom color scheme for this specific section. This overrides the inherited scheme. Default Value: scheme-1

\n

How to Use

\n
    \n
  • \n

    If you want all sections to follow the global theme color scheme, ensure Color Scheme Inheritance is enabled.

    \n
    • \n
  • \n

    To set a unique color scheme for a section, disable Color Scheme Inheritance and select a custom scheme from the dropdown.

    \n
    • \n
\n
\n

Recommendations

\n

Here’s the list of recommendations based on additional insights from your manual:

\n
    \n
  1. \n

    Ready-to-use color scheme examples:

    \n
    2. \n
\n
    \n
  • \n

    Utilize the provided templates of color combinations for a quick start.

    \n
    • \n
\n
    \n
  • \n

    This helps reduce the time spent creating a unique palette.

    \n
    • \n
\n
    \n
  1. \n

    Contrast and readability:

    \n
    2. \n
\n
    \n
  • \n

    Always ensure text is clearly visible against the background.

    \n
    • \n
\n
    \n
  • \n

    Verify that the contrast adheres to accessibility standards (e.g., WCAG).

    \n
    • \n
\n
    \n
  1. \n

    Color scheme testing:

    \n
    2. \n
\n
    \n
  • \n

    Test the color palette on various devices and screen resolutions.

    \n
    • \n
\n
    \n
  • \n

    Check how colors appear at different brightness levels.

    \n
    • \n
\n
    \n
  1. \n

    Optimization tools:

    \n
    2. \n
\n
    \n
  • \n

    Use online tools like WebAIM Contrast Checker to verify contrast ratios.

    \n
    • \n
\n
    \n
  • \n

    Simulate colorblindness scenarios with appropriate tools to enhance theme accessibility.

    \n
    • \n
\n

These tips can improve the quality and adaptability of the color schemes. Let me know if you’d like to dive deeper into any of these topics!

\n
\n

This guide ensures you can fully leverage the Color Schemes section to personalize your Shopify theme. If you need additional help, contact your theme developer or refer to Shopify’s official documentation.

\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n","blockTitle":" Color Schemes","fieldGroupName":"manual_category_blocks","hash":"general-color-schemes"},{"blockContent":"

This settings block is intended for general Colors settings on the site.

\n

In order to get to the Colors settings block, you need to go to Customizer → Theme Settings → Colors.

\n
\n
\n
\n
\n
\n

\"colors

\n

Settings

\n

Scrollbar

\n

\"scrollbar

\n
    \n
  1. \n

    Thumb – scrollbar thumb color;

    \n
    2. \n
  2. \n

    Track – scrollbar track color;

    \n
    3. \n
  3. \n

    Thumb opacity – transparency of the scrollbar thumb as a percentage of black;

    \n
    4. \n
  4. \n

    Track opacity – transparency of the scrollbar track as a percentage of black.

    \n
    5. \n
\n","blockTitle":"Colors","fieldGroupName":"manual_category_blocks","hash":"general-colors"},{"blockContent":"

This settings block is intended for general Buttons settings on the site.

\n

In order to get to the Buttons settings block, you need to go to Customizer → Theme Settings → Buttons.

\n
\n
\n
\n
\n
\n

\"buttons

\n

Settings

\n

Button font settings

\n

\"font

\n
    \n
  1. \n

    Font – font family for all buttons, default: Inter;

    \n
    2. \n
  2. \n

    Font size – font size for all buttons, default: 16px;

    \n
    3. \n
  3. \n

    Uppercase – button text transform to uppercase.

    \n
    4. \n
\n","blockTitle":"Buttons","fieldGroupName":"manual_category_blocks","hash":"general-buttons"},{"blockContent":"
\n
\n
\n
\n
\n
\n
\n
\n

This settings block is intended for general Favicon settings on the site.

\n

In order to get to the Favicon settings block, you need to go to Customizer → Theme Settings → Favicon.

\n
\n
\n
\n
\n
\n

\"favicon

\n

Settings

\n

\"image

\n
    \n
  1. \n

    Image – the setting is responsible for the store icon that is displayed in the browser tab.

    \n
    2. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n","blockTitle":"Favicon","fieldGroupName":"manual_category_blocks","hash":"general-favicon"},{"blockContent":"

This settings block is intended for general Layout settings on the site.

\n

In order to get to the Layout settings block, you need to go to Customizer → Theme Settings → Layout.

\n
\n
\n
\n
\n
\n

\"layout

\n

Settings

\n

\"container

\n
    \n
  1. \n

    Container width – by default, most sections use this setting to determine their width.

    \n
    2. \n
\n","blockTitle":"Layout","fieldGroupName":"manual_category_blocks","hash":"general-layout"},{"blockContent":"
\n
\n
\n
\n
\n
\n
\n

This settings block is intended for general Cart settings on the site.

\n

In order to get to the Cart settings block, you need to go to Customizer → Theme Settings → Cart.

\n

\"cart

\n
\n
\n
\n
\n
\n

Settings

\n

Cart general

\n

\"general

\n
    \n
  1. \n

    Cart type – the setting is responsible for the type of cart. It has two values: drawer, page;

    \n
    2. \n
  2. \n

    Show product vendor – the setting is responsible for showing/hiding the product vendor;

    \n
    3. \n
  3. \n

    Show cart notes – the setting is responsible for showing/hiding cart notes;

    \n
    4. \n
  4. \n

    Show tax and shipping message – the setting is responsible for showing/hiding the tax and shipping message;

    \n
    5. \n
  5. \n

    Show dynamic checkout buttons – the setting is responsible for showing/hiding dynamic checkout buttons;

    \n
    6. \n
  6. \n

    Checkout button label – label for the Checkout button

    \n
    7. \n
\n

Cart notification

\n

\"cart

\n
    \n
  1. \n

    Show cart notification – the setting is responsible for showing/hiding the “Cart notification“ popup when adding to the cart. This setting does not affect the “Cart notification error” popup, it is always enabled.

    \n
    2. \n
  2. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings.

    \n
    3. \n
  3. \n

    Color scheme – the setting allows you to choose a scheme.

    \n
    4. \n
\n

Cart notification popup

\n

\"cart
\nCart notification | Desktop

\n

 

\n

\"cart
\nCart notification | Mobile

\n
\n

Cart notification error popup

\n

\"cart
\nCart notification error | Desktop

\n

 

\n

\"cart
\nCart notification error | Mobile

\n
\n

Cart empty

\n

\"empty

\n
    \n
  1. \n

    Empty cart heading – the setting allows you to add a header when the shopping cart is empty;

    \n
    2. \n
  2. \n

    Empty cart text – the setting allows you to add a text when the shopping cart is empty;

    \n
    3. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n","blockTitle":"Cart","fieldGroupName":"manual_category_blocks","hash":"general-cart"},{"blockContent":"

This settings block is intended for general Color swatches settings on the site.

\n

In order to get to the Color swatches settings block, you need to go to Customizer → Theme Settings → Color swatches.

\n

\"color

\n

Settings

\n

\"color

\n
    \n
  1. Enable color swatches – the setting is responsible for whether color swatches will be displayed on the product card. By default, Shopify swatches will be used. Learn more about setup swatches for product options – Shopify’s Standard Product Taxonomy. If Shopify swatches are not added, then theme swatches will work. Color swatches depend on the Color option. If the name of the color is split, then the last word is taken and substituted into the CSS palette. There is a chance that this color will not be in the CSS palette, then it will just be a white swatch. In this case, you must add an image to Shopify files of 50*50 px size in .png format with swatch- prefix. For example, the image name for banana-yellow would be swatch-banana-yellow.png;
    2. \n
  2. Swatch option – the setting is intended for stores that have a different option for color swatches than color. For example, a user has a purely German store, whose color option is called – Farbe, thus the user will need to specify a name for this setting. The default value is Color. NOTE: This setting works only for the theme swatches, not for the Shopify swatches.
    3. \n
\n","blockTitle":"Color swatches","fieldGroupName":"manual_category_blocks","hash":"general-color-swatches"},{"blockContent":"

These settings are intended for general Product settings on the site.

\n

In order to get to the Product settings block, you need to go to Customizer → Theme Settings → Product.

\n

\"general

\n
\n
\n
\n
\n
\n
\n
\n

General

\n

\"default\"

\n
    \n
  1. \n

    Default product image – the setting allows you to set the default product image if the product has no image at all;

    \n
    2. \n
  2. \n

    Show unit price – the setting allows you to display the Unit price. More information here – Displaying unit prices.

    \n
    3. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n","blockTitle":" Product","fieldGroupName":"manual_category_blocks","hash":"general-product"},{"blockContent":"

These settings are intended for general Product labels settings on the site.

\n

In order to get to the Product labels settings block, you need to go to Customizer→Theme Settings→Product labels.

\n

\"general

\n

General

\n

\"labels\"

\n

\"labels

\n
    \n
  1. \n

    Enable labels – the setting allows you to show labels. For the label to be displayed, a tag must be added to the product, for example, label__new is the base label that will display NEW with the base color. To change the type of a label, you need to add a :type, such as label__new:primary or label__new:secondary. The number of displayed labels is limited to 3, as well as a soldout label in case the product is not available or a sale % label label in case product is available and compare at price > price;

    \n
    2. \n
  2. \n

    Enable Sale % label – the setting allows you to show Sale % label. Enable labels must be enabled. Label is displayed if compare at price > price and product is not sold out;

    \n
    3. \n
  3. \n

    For each type of label, there are color settings. This way you can change the color for the label text: primary, secondary, base, soldout, sale % label;

    \n
    4. \n
  4. \n

    The background is specified for each label;

    \n
    5. \n
  5. \n

    The border color is specified for each label;

    \n
    6. \n
  6. \n

    Background transparency is specified for each label using a range step range of 10%. The minimum value is 10% and the maximum is 100%.

    \n
    7. \n
\n","blockTitle":"Product labels","fieldGroupName":"manual_category_blocks","hash":"general-product-labels"},{"blockContent":"

These settings are intended for general Product card settings on the site.

\n

In order to get to the Product card settings block, you need to go to Customizer→Theme Settings→Product card.

\n

\"prod

\n

General

\n

\"prod

\n
    \n
  1. \n

    Show vendor – the setting allows you to show/hide the product vendor;

    \n
    2. \n
  2. \n

    Enable quick view – the setting allows you to enable the quick view feature;

    \n
    3. \n
  3. \n

    Show currency code – the setting allows you to show currency code;

    \n
    4. \n
  4. \n

    Enable image change on hover – the setting allows you to show the second image (video) on hover. By default, the second product image will be used for the hover. To add an image (video), you need to add the product_card.hover_image metafield, where product_card is the namespace and hover_image is the field name. The Content type must be a file.

    \n\n
    5. \n
  5. \n

    Image aspect ratio – the setting allows you to choose the aspect ratio of the image. Can be Square or Portrait;

    \n
    6. \n
  6. \n

    Object fit image – the setting allows you to stretch the image. If Cover(default) is selected – the image will take all the space available for it, that is, it will stretch as much as possible, and if Contain – it will retain its proportions;

    \n
    7. \n
\n

Colors

\n

\"product

\n
    \n
  1. \n

    Quick view button color – the setting allows you to specify the text color of quick view button;

    \n
    2. \n
  2. \n

    Quick view button background – the setting allows you to specify the background color of quick view button;

    \n
    3. \n
  3. \n

    Quick view button background opacity – the setting allows you to specify the background opacity of the quick view button;

    \n
    4. \n
  4. \n

    Quick view button enables blur – the setting allows you to specify the blur effect of quick view button background.

    \n
    5. \n
\n","blockTitle":"Product card","fieldGroupName":"manual_category_blocks","hash":"general-product-card"},{"blockContent":"

This block of settings is intended for general settings of the Article card on the site.

\n

In order to get to the Article card settings block, you need to go to Customizer → Theme Settings → Article card.

\n

\"article

\n

Settings

\n
\n
\"All
\n
\n
    \n
  1. \n

    Default article image – the setting is used to add a default image if the article does not have one;

    \n
    2. \n
  2. \n

    Read more label – link text for the read more link in the article card;

    \n
    3. \n
  3. \n

    Show blog post date – the setting is responsible for showing/hiding the publication dates of the article;

    \n
    4. \n
  4. \n

    Strip title to 2 line – the setting is responsible for trimming the title of the article to 3 lines;

    \n
    5. \n
  5. \n

    Strip content to 2 line – the setting is responsible for trimming the content of the article to 3 lines;

    \n
    6. \n
  6. \n

    Show content – the setting is responsible for article content output.

    \n
    7. \n
\n
\n
\n","blockTitle":"Article card","fieldGroupName":"manual_category_blocks","hash":"general-article-card"},{"blockContent":"

\"Quick

\n

This block of settings is intended for general settings of the Quick view on the site.

\n

In order to get to the Quick view settings block, you need to go to Customizer → Theme Settings → Quick view.

\n

\"Quick

\n

Settings

\n

\"General

\n

General

\n
    \n
  1. \n

    Show additional payment buttons – the setting allows you to enable additional payment buttons ‘Add to cart’ button;

    \n
    2. \n
  2. \n

    Button style – the setting allows you to set the style of the button: Primary / Secondary;

    \n
    3. \n
  3. \n

    Button ‘Buy it now’ style – the setting allows you to set the style of the ‘Buy it now’ button: Primary / Secondary;

    \n
    4. \n
  4. \n

    Variant picker – select a view of variant options type. Note: if you have enabled a color swatch option then the option that is related to color swatch will always be a button. You can select “Buttons” or “Dropdown”;

    \n
    5. \n
  5. \n

    Object fit image – setting allows you to set the value for the object-fit property of the image;

    \n
    6. \n
  6. \n

    Show description – the setting allows you to show a description;

    \n
    7. \n
  7. \n

    Show stock message – the setting allows you to show stock message.

    \n
    8. \n
\n","blockTitle":"Quick view","fieldGroupName":"manual_category_blocks","hash":"general-quick-view"},{"blockContent":"

 

\n
\n

This block of settings is intended for general Predictive search settings on the site.

\n

In order to get to the Predictive search settings block, you need to go to Customizer → Theme Settings → Predictive search.

\n

\"Predictive

\n

General

\n

\"predictive\"

\n
    \n
  1. \n

    Enable – the setting allows you to turn on the predictive search feature;

    \n
    2. \n
  2. \n

    Enable search by articles – the setting allows to include articles in the search;

    \n
    3. \n
  3. \n

    Enable search by pages – the setting allows to include pages in the search;

    \n
    4. \n
  4. \n

    No results text – the setting allows to set no result text;

    \n
    5. \n
  5. \n

    Trending Search Terms – the setting allows you to set trending search terms(Enter words separated by commas without spaces that will be displayed as frequently used search terms);

    \n
    6. \n
  6. \n

    Promo products – the setting allows you to set list of promo products.

    \n
    7. \n
\n

Colors

\n

\"color\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – the setting allows you to choose a scheme.

    \n
    3. \n
\n","blockTitle":"Predictive search","fieldGroupName":"manual_category_blocks","hash":"general-predictive-search"},{"blockContent":"

This block of settings is intended for general settings of Social media on the site.

\n

In order to get to the Social media settings block, you need to go to Customizer → Theme Settings → Social media.

\n

\"social

\n

Settings

\n

\"links\"

\n
    \n
  1. X (Twitter) – link to the store’s X (Twitter) account;
    2. \n
  2. Facebook – link to the store’s Facebook account;
    3. \n
  3. Pinterest – link to the store’s Pinterest account;
    4. \n
  4. Instagram – link to the store’s Instagram account;
    5. \n
  5. Tumblr – link to the store’s Tumblr account;
    6. \n
  6. YouTube – link to the store’s YouTube account;
    7. \n
  7. TikTok – link to the store’s TikTok account.
    8. \n
\n

\n

\n

\n","blockTitle":"Social media","fieldGroupName":"manual_category_blocks","hash":"general-social-media"},{"blockContent":"

This block of settings is intended for the general settings of the Cart reminder on the site.

\n

In order to get to the Cart reminder settings block, you need to go to Customizer → Theme Settings → Cart reminder.

\n

\"cart

\n

Settings

\n

Color

\n

\n

\"colors

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

General

\n

\n

\"general

\n
    \n
  1. \n

    Enable – the setting is responsible for enabling/disabling the popup;

    \n
    2. \n
  2. \n

    Cookie time – the setting is responsible for the period after which the cart reminder popup will be shown. It has several values: 10 minutes, 30 minutes, 1 hour, 8 hours, 1 day;

    \n
    3. \n
  3. \n

    Display frequency – the setting is responsible for the behavior of the popup. If one time is selected, in this case when interacting with the popup, it will be closed for 24 hours. If the Cookie interval is selected, the value from the Cookie time setting will be taken;

    \n
    4. \n
  4. \n

    Text – the setting is responsible for the text inside the popup.

    \n
    5. \n
\n

\n

\n

\n","blockTitle":"Cart reminder","fieldGroupName":"manual_category_blocks","hash":"general-cart-reminder"},{"blockContent":"

\"breadcrumbs\"

\n

This block of settings is intended for general settings of the Breadcrumbs on the site.

\n

In order to get to the Breadcrumbs settings block, you need to go to Customizer → Theme Settings → Breadcrumbs.

\n

\"settings\"

\n
\n
\n
\n
\n
\n
\n
\n
\n

Settings

\n

General

\n
    \n
  1. Show – this setting allows you to enable/disable the display of breadcrumbs;
    2. \n
  2. Show collection on PDP – this setting allows you to enable/disable the display of the first available product collection.
    3. \n
\n

\"breadcrumbs-2\"

\n

Layout

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    5. \n
\n

\"breadcrumbs\"

\n
\n
\n
\n
\n
\n
\n
\n
\n","blockTitle":"Breadcrumbs","fieldGroupName":"manual_category_blocks","hash":"general-breadcrumbs"},{"blockContent":"

This settings block is intended for general Seo settings on the site.

\n

In order to get to the Seo settings block, you need to go to Customizer → Theme Settings → Seo.

\n

\"seo

\n

Settings

\n

\n

\"seo

\n
    \n
  1. Hide site from search engines – the setting is responsible for hiding pages from indexing by search robots.
    2. \n
\n

\n

\n","blockTitle":"SEO","fieldGroupName":"manual_category_blocks","hash":"general-seo"},{"blockContent":"

This block of settings is intended for general Custom CSS settings on the site.

\n

In order to get to the Custom CSS settings block, you need to go to Customizer → Theme Settings → Custom CSS.

\n

\"custom

\n

Settings

\n

\n

\"Settings\"

\n
    \n
  1. Textarea – a text area where you can add your CSS code for customization.
    2. \n
\n

Additional information

\n

In this block, your CSS will be added at the end of the page, and the same custom CSS block that is in the section settings will be added to the end of the section.

\n

\n

\n","blockTitle":"Custom CSS","fieldGroupName":"manual_category_blocks","hash":"general-custom-css"}]},{"fieldGroupName":"manual_category","manualCategoryTitle":"Pages","manualCategoryBlocks":[{"blockContent":"

This is a page with a unique template page.faq.json

\n

\"faq

\n

This template can be used to show customers the answers to the frequently asked questions.

\n

\n

\"faq

\n

You can use the FAQ template section to add answers to frequently asked questions.

\n

\n

\n","blockTitle":"FAQ","fieldGroupName":"manual_category_blocks","hash":"pages-faq"},{"blockContent":"

This is a page with a unique template 404.json

\n

\"404

\n

This template can be used to display information for the user when he opens a hidden or non-existent page.

\n

\n

\"404

\n

You can use the section 404 template to add additional information for the user.

\n

\n

\n","blockTitle":"404 page","fieldGroupName":"manual_category_blocks","hash":"pages-404"},{"blockContent":"

This is a page with a default template list-collections.json

\n

\"collections

\n

This template is used by default for the collection list page. You don’t need to add anything for this template to be displayed.

\n
\n

You can use the section List collections to configure the appearance and additional settings of the page.

\n

\n

\n","blockTitle":"Collections list page","fieldGroupName":"manual_category_blocks","hash":"pages-collections-list-page"},{"blockContent":"

This is a page with a unique template password.json

\n

This template is used by default for the password page. You don’t need to add anything for this template to be displayed.

\n

\"password

\n

\"password

\n

\"password

\n

\"password

\n

\"password-page-transparent\"

\n

\"password

\n

You can use “Password header”, “Password content”, “Password footer” sections to configure the appearance and additional settings of the page.

\n

\n

\n","blockTitle":"Password page","fieldGroupName":"manual_category_blocks","hash":"pages-password"},{"blockContent":"

This is a blog page with a default template blog.json.
\n

\n

\"blog

\n

\"blog

\n
\n

 

\n

This template is used by default for the blog page. You don’t need to add anything for this template to be displayed.

\n

You can use the section Blog template to configure the appearance and additional settings of the page.

\n

\n","blockTitle":"Blog page","fieldGroupName":"manual_category_blocks","hash":"pages-blog-page"},{"blockContent":"

This is a blog posts page with a default template article.json.

\n

\"blog

\n

\"article\"

\n
\n

This template is used by default for the blog posts. You don’t need to add anything for this template to be displayed.

\n

You can use the section Article main to configure the appearance and additional settings of the page.

\n

\n

\n

\n","blockTitle":"Article page","fieldGroupName":"manual_category_blocks","hash":"pages-article-page"},{"blockContent":"
\n

Collection template

\n
\n

\n

Collection template mobile

\n

 

\n

This is a collection page with a default template collection.json

\n

This template is used by default for the collection page. You don’t need to add anything for this template to be displayed.

\n

You can use the section “Collection banner” & “Collection template” to configure the appearance and additional settings of the page. You can also use the ”Collection list” section to display a list of collections

\n

\n

\n","blockTitle":"Collection page","fieldGroupName":"manual_category_blocks","hash":"pages-collection"},{"blockContent":"

\"search\"
\n

\n

\"search

\n
\n

 

\n
\n
\n
\n
\n
\n
\n
\n
\n

This is a page with a default template search.json

\n

This template is used by default for the search page. You don’t need to add anything for this template to be displayed.

\n

You can use the section “Search” to configure the appearance and additional settings of the page.

\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n","blockTitle":"Search page","fieldGroupName":"manual_category_blocks","hash":"pages-search"},{"blockContent":"

This is a page with a unique template page.contact.json

\n

\"contact

\n

This template is used for the Contact page to show contact information for your customers.

\n

The Contact template does not have its own sections and consists of already available sections of the theme. By default, the page has the following sections: Banner, Store location, Stores locator, Contact form.
\nYou can easily change the sections on the page.

\n

\n

\"contact

\n

\n

\n","blockTitle":"Contact page","fieldGroupName":"manual_category_blocks","hash":"pages-contact-page"},{"blockContent":"

This is a page with a unique template gift_card.liquid

\n

This template is used by default for the Gift card. You don’t need to add anything for this template to be displayed.

\n

\"gift

\n

You can use the Gift card section to configure the appearance and additional settings of the page.

\n

\n","blockTitle":"Gift card page","fieldGroupName":"manual_category_blocks","hash":"pages-gift-card-page"},{"blockContent":"

This is a product page with default template product.json

\n

\"product\"

\n

\"product

\n

This template is used by default for the poduct page. You don’t need to add anything for this template to be displayed.

\n

\n
\n

You can use the section “Product template” to configure the appearance and additional settings of the page.

\n

\n

\n","blockTitle":"Product page","fieldGroupName":"manual_category_blocks","hash":"pages-product-page"},{"blockContent":"

This is a homepage with default template index.json.

\n

\"home

\n

Homepage is the main store page that your customers see first. On this page, you can display any dynamic sections and build your own unique store.

\n

\"home

\n

The only thing that limits you is the section limit – 25.

\n

\n

\n","blockTitle":"Home page","fieldGroupName":"manual_category_blocks","hash":"pages-homepage"},{"blockContent":"

This is a page with a default template cart.json.
\n

\n

\"cart

\n

This template is used by default for the cart page. You don’t need to add anything for this template to be displayed.

\n

\"cart\"

\n

You can use the section “Cart template” to configure the appearance and additional settings of the page.

\n

\n

\n","blockTitle":"Cart page","fieldGroupName":"manual_category_blocks","hash":"pages-cart"},{"blockContent":"

\"customer

\n

This template is used by default for the Login page. You don’t need to add anything for this template to be displayed.

\n

\n

\"login

\n

You can use the section “Login template” to configure the appearance and additional settings of the page.

\n

\n

\n","blockTitle":"Login page","fieldGroupName":"manual_category_blocks","hash":"pages-login"},{"blockContent":"

This template is used by default for the Register page. You don’t need to add anything for this template to be displayed.

\n

\"register

\n

\"register

\n

You can use the section “Register template” to configure the appearance and additional settings of the page.

\n

\n

\n

\n","blockTitle":"Register page","fieldGroupName":"manual_category_blocks","hash":"pages-register"},{"blockContent":"

This template is used by default for the Account page. You don’t need to add anything for this template to be displayed.

\n

\n

\"account\"

\n

\"account

\n

You can use the section “Account template” to configure the appearance and additional settings of the page.

\n","blockTitle":"Account page","fieldGroupName":"manual_category_blocks","hash":"pages-account"},{"blockContent":"

This template is used by default for the Reset page. You don’t need to add anything for this template to be displayed.

\n

\"reset

\n

\"reset

\n

You can use the section “Reset template” to configure the appearance and additional settings of the page.

\n

\n

\n","blockTitle":"Reset page","fieldGroupName":"manual_category_blocks","hash":"pages-reset"},{"blockContent":"

This template is used by default for the Activate page. You don’t need to add anything for this template to be displayed.

\n

\"activate\"

\n

\"activate

\n

You can use the section “Activate template” to configure the appearance and additional settings of the page.

\n

\n

\n

\n","blockTitle":"Activate page","fieldGroupName":"manual_category_blocks","hash":"pages-activate"},{"blockContent":"

This template is used by default for the Order page. You don’t need to add anything for this template to be displayed.
\n

\n

\"order\"

\n

\"order

\n

\n

You can use the section “Order template” to configure the appearance and additional settings of the page.

\n

\n","blockTitle":"Order page","fieldGroupName":"manual_category_blocks","hash":"pages-order"}]},{"fieldGroupName":"manual_category","manualCategoryTitle":"Sections & Snippets","manualCategoryBlocks":[{"blockContent":"

\"section\"

\n

Adding a Section

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Specifications.

\n

Section settings

\n

General

\n

\"settings\"

\n
    \n
  1. \n

    Image – this setting is responsible for the image. If the image is not selected, a placeholder will be displayed;

    \n
    2. \n
  2. \n

    Heading – this setting is responsible for the heading.

    \n
    3. \n
\n

Colors

\n

\"colors

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Make full width – If disabled – container width will be set based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    6. \n
\n","blockTitle":"Specifications","fieldGroupName":"manual_category_blocks","hash":"section-specifications-bar"},{"blockContent":"

\"section\"

\n

Adding a section

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Store location.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

General

\n

\"general\"

\n
    \n
  1. \n

    Heading – this setting is responsible for the heading;

    \n
    2. \n
  2. \n

    Description – this setting is responsible for the description.

    \n
    3. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Make full width – If disabled – container width will be set based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

Blocks settings

\n

\"contact

\n
    \n
  1. \n

    Icon – the setting allows you to set the icon of the block;

    \n
    2. \n
  2. \n

    Heading – the setting allows you to set the text of the heading;

    \n
    3. \n
  3. \n

    Text – the setting allows you to set the text of the block.

    \n
    4. \n
\n

\n

\n

\n

\n

\n","blockTitle":"Store location","fieldGroupName":"manual_category_blocks","hash":"section-store-location"},{"blockContent":"

\"benefits

\n

Adding a Section

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Benefits.

\n

Section settings

\n

General

\n

\"colors

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section;

    \n
    3. \n
  3. \n

    Heading – this setting allows you to set text of the heading.

    \n
    4. \n
\n

Layout

\n

\"layout

\n
    \n
  1. \n

    Make full width – If disabled – container width will be set based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

Blocks settings

\n

\"block

\n
    \n
  1. \n

    Icon – the setting allows you to set icon of the block;

    \n
    2. \n
  2. \n

    Heading – the setting allows you to set text of the heading;

    \n
    3. \n
  3. \n

    Text – the setting allows you to set text of the block.

    \n
    4. \n
\n","blockTitle":"Benefits","fieldGroupName":"manual_category_blocks","hash":"section-benefits"},{"blockContent":"

\"rich

\n

Adding a section

\n

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Rich text.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

General

\n

\"rich

\n
    \n
  1. \n

    Heading — this setting allows you to set text of the heading;

    \n
    2. \n
  2. \n

    Label — this setting allows you to set text of the label;

    \n
    3. \n
  3. \n

    Text — this setting allows you to set the main text of section;

    \n
    4. \n
  4. \n

    Text alignment — this setting allows you to set the alignment of the text (left, center, or right);

    \n
    5. \n
  5. \n

    Enable read more button — this setting enables the feature to truncate text and display a button to expand the full text. Limits the display to 5 lines. Anything after the fifth line is truncated;

    \n
    6. \n
  6. \n

    Read more button label — this setting allows you to set the text of the “Read more” button;

    \n
    7. \n
  7. \n

    Show less button label — this setting allows you to set the text of the “Show less” button;

    \n
    8. \n
  8. \n

    Link text — this setting allows you to set the text of the link;

    \n
    9. \n
  9. \n

    Link — this setting allows you to add a link for the section.

    \n
    10. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Container width – section container settings.

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n","blockTitle":"Rich text","fieldGroupName":"manual_category_blocks","hash":"section-rich-text"},{"blockContent":"

\"video

\n

Adding a section

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Video.

\n

Section settings

\n

General

\n

\"image\"

\n
    \n
  1. \n

    Image – setting allows you to set a picture for the background of the section and for the video preview.

    \n
    2. \n
\n

Video

\n

\n

\"video\"

\n
    \n
  1. \n

    Video type – setting allows you to select the type of video, Youtube/Vimeo or HTML5.

    \n
    2. \n
  2. \n

    HTML5 desktop video – setting allows you to choose a video for your desktop.

    \n
    3. \n
  3. \n

    HTML5 mobile video – setting allows you to choose a video for your mobile.

    \n
    4. \n
  4. \n

    Youtube/Vimeo desktop video url – setting allows you to add links to Youtube/Vimeo videos for your desktop.

    \n
    5. \n
  5. \n

    Youtube/Vimeo mobile video url – setting allows you to add links to Youtube/Vimeo videos for your mobile.

    \n
    6. \n
  6. \n

    Custom cursor image – setting allows you to add an icon for the cursor.

    \n
    7. \n
\n

Ticker

\n

\"ticker

\n
    \n
  1. \n

    Text color – setting allows you to set the color for the ticker.

    \n
    2. \n
  2. \n

    Movement speed (desktop) size – setting allows you to set the speed of the ticker on the desktop.

    \n
    3. \n
  3. \n

    Movement speed (mobile) size – setting allows you to set the speed of the ticker on the mobile.

    \n
    4. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Container width – section container settings

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
\n

Blocks settings

\n

\"ticker\"

\n
    \n
  1. \n

    Text – setting allows you to insert text for the block.

    \n
    2. \n
\n

\n

\n

\n

\n

\n","blockTitle":"Video","fieldGroupName":"manual_category_blocks","hash":"section-video"},{"blockContent":"

\"contact

\n

Adding a Section

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Contact form.

\n

Settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

General

\n

\"general

\n

\"general

\n
    \n
  1. \n

    Heading – the setting allows you to set the title;

    \n
    2. \n
  2. \n

    Text – the setting allows you to set the text;

    \n
    3. \n
  3. \n

    Terms and conditions text – the setting allows you to set the text before submit button;

    \n
    4. \n
  4. \n

    Name placeholder – the setting allows you to set the placeholder for the Name field;

    \n
    5. \n
  5. \n

    Email placeholder – the setting allows you to set the placeholder for the Email field;

    \n
    6. \n
  6. \n

    Phone placeholder – the setting allows you to set the placeholder for the Phone field;

    \n
    7. \n
  7. \n

    Message placeholder – the setting allows you to set the placeholder for the Message field;

    \n
    8. \n
  8. \n

    Button label – the setting allows you to set the text for the button;

    \n
    9. \n
  9. \n

    Success message – the setting allows you to specify the text about successful sending of the message.

    \n
    10. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Container width - section container settings.

    \n
    2. \n
  2. \n

    Desktop offset top - the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom - the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top - the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom - the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top - the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom - the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top - the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom - the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n","blockTitle":"Contact form","fieldGroupName":"manual_category_blocks","hash":"section-contact-form"},{"blockContent":"

\"faq

\n

Adding a Section

\n
\n
\"how
\n
\n

In order to add a section, you need to go to Customizer → Add Section → FAQ.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

General

\n

\"general\"

\n
    \n
  1. \n

    Heading — this setting allows you to set text of the heading;

    \n
    2. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Container width – section container settings.

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

Blocks settings

\n

Block Category

\n

The block is designed to group question-answer pairs by category. Rendered as a header separating a group of accordions.

\n

\"setting

\n
    \n
  1. \n

    Heading – title, category name.

    \n
    2. \n
\n

Block Question and answer

\n

The block is responsible for displaying the question-answer pair. When rendering, it is displayed as an accordion.

\n

\"Question

\n
    \n
  1. \n

    Heading – accordion title, question;

    \n
    2. \n
  2. \n

    Text – accordion content, response.

    \n
    3. \n
\n

Additional information

\n
    \n
  1. \n

    The Category block is not displayed if the settings for the Heading field are not specified.

    \n
    2. \n
  2. \n

    The Question and answer block is not displayed if the settings for the Heading and Text fields are not specified;

    \n
    3. \n
\n
\n
\n","blockTitle":"FAQ section","fieldGroupName":"manual_category_blocks","hash":"section-faq"},{"blockContent":"

In this section, you can display a list of the last seven blog posts.

\n

\"blog-post-section-desktop\"

\n

\"section

\n

Adding a section

\n

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Blog posts .

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

General

\n

\n

\"general

\n
    \n
  1. \n

    Heading – this setting allows you to set text of the heading.

    \n
    2. \n
  2. \n

    Blog – select the blog whose posts you want to display.

    \n
    3. \n
  3. \n

    Button label – setting allows you to set the label for the button.

    \n
    4. \n
  4. \n

    Button aria-label – setting allows you to set the aria-label for the button. This attribute allows screen readers to better convey information to people with disabilities.

    \n
    5. \n
  5. \n

    Button style – setting allows you to set the type of the button.

    \n
    6. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Container width – section container settings.

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

\n

\n

\n

\n","blockTitle":"Blog posts","fieldGroupName":"manual_category_blocks","hash":"section-blog-posts"},{"blockContent":"

\"age

\n

\"age

\n

This block of settings is intended for general settings of the Age check popup on the site.

\n

If the customer closes the popup – the redirect will work.

\n

If the customer clicks on the main button – the popup will close and the customer can use a site.

\n

In order to get to the Age check popup settings block, you need to go to Customizer → Popups group → Age check popup.

\n

Add section

\n

\n

\"how

\n

Settings

\n

Colors

\n

\"colors\"

\n

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

General

\n

\"general\"

\n
    \n
  1. \n

    Enable – the setting is responsible for enabling/disabling the popup;

    \n
    2. \n
  2. \n

    Cookie time – the setting is responsible for the period for which the popup will be hidden when it is closed. Has several values: 1 day, 1 week, 1 month, 3 months, 1 year;

    \n
    3. \n
  3. \n

    Heading – popup title text field;

    \n
    4. \n
  4. \n

    Text – text field for text content;

    \n
    5. \n
  5. \n

    Button label – label for the main button;

    \n
    6. \n
  6. \n

    Button style – main button style;

    \n
    7. \n
  7. \n

    Button close label – label for the close button;

    \n
    8. \n
  8. \n

    Redirect link – link for redirect if the customer closes the popup. The “http://www.google.com/” link is used by default;

    \n
    9. \n
\n

\n

\n","blockTitle":"Age check popup","fieldGroupName":"manual_category_blocks","hash":"section-age-check-popup"},{"blockContent":"

\"product

\n

\"product

\n

\"product

\n

\"product

\n

This settings block is intended for general Product promo settings on the site.

\n

In order to get to the Product promo settings block, you need to go to Customizer → Popups group → Product promo.

\n

\"how

\n

Settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

General

\n

\"general\"

\n
    \n
  1. \n

    Layout – the setting allows you to set accept layout style;

    \n
    2. \n
  2. \n

    Cookie time – the setting is responsible for the time until the popup is re-displayed when the user closes it.

    \n
    3. \n
\n

Text

\n

\"text

\n
    \n
  1. \n

    Image desktop – setting allows you to set desktop image;

    \n
    2. \n
  2. \n

    Image mobile – setting allows you to set mobile image;

    \n
    3. \n
  3. \n

    Heading – setting allows you to set title text;

    \n
    4. \n
  4. \n

    Text – setting allows you to set description text;

    \n
    5. \n
  5. \n

    Link label – setting allows you to set accept link label;

    \n
    6. \n
  6. \n

    Link url – setting allows you to set accept link label url.

    \n
    7. \n
\n

Product

\n

\"product\"

\n
    \n
  1. \n

    Product – setting allows you to set the product to open quick view on click.

    \n
    2. \n
\n

\n

\n

\n

\n

\n

\n","blockTitle":"Product promo","fieldGroupName":"manual_category_blocks","hash":"section-product-promo"},{"blockContent":"

In this section, you can add max 6 blocks with product to display hot spots on the image that help customers buy specific products.

\n

\"trend-products\"

\n

\"trend

\n

Adding a Section

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Trend products.

\n

Section settings

\n

\"trend

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section;

    \n
    3. \n
  3. \n

    Heading – this setting allows you to set text of the heading;

    \n
    4. \n
  4. \n

    Text– the setting allows you to set the text of the section;

    \n
    5. \n
  5. \n

    Link label – the setting allows you to set the text for the link;

    \n
    6. \n
  6. \n

    Link aria-label – the setting allows you to set the aria-label for the link;

    \n
    7. \n
  7. \n

    Link url – the setting allows you to set the link for the link;

    \n
    8. \n
  8. \n

    Make the first hotspot opened – the setting allows you to set the first hop-spot opened in the section by default;

    \n
    9. \n
  9. \n

    Enable hotspot animation – the setting allows you to enable hotspot animations;

    \n
    10. \n
  10. \n

    Image desktop – the setting allows you to select a custom desktop image of the section;

    \n
    11. \n
  11. \n

    Image mobile – the setting allows you to select a custom mobile image of the section;

    \n
    12. \n
\n

Colors

\n
    \n
  1. \n

    Text – the setting allows you to select a color for the title and text (on the desktop).

    \n
    2. \n
  2. \n

    Link – the setting allows you to select a color for the link.

    \n
    3. \n
  3. \n

    Spot background – the setting allows you to select a color for the spot background;

    \n
    4. \n
  4. \n

    Spot color – the setting allows you to select a color for the spot color;

    \n
    5. \n
  5. \n

    Spot border color – the setting allows you to select a color for the spot border color;

    \n
    6. \n
  6. \n

    Spot background active – the setting allows you to select a color for the spot background active state;

    \n
    7. \n
  7. \n

    Spot color active – the setting allows you to select a color for the spot color active state;

    \n
    8. \n
  8. \n

    Spot border active color – the setting allows you to select a color for the spot border color active state;

    \n
    9. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Container width – section container settings.

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
\n

Block settings

\n

\"block

\n
    \n
  1. \n

    Product – the product that will show in the popup after clicking on hotspot;

    \n
    2. \n
  2. \n

    Product image – the setting allows you to select a custom image instead of a product image;

    \n
    3. \n
  3. \n

    Spot horizontal position desktop – the setting allows you to set the horizontal position (desktop) of the hotspot;

    \n
    4. \n
  4. \n

    Spot vertical position desktop – the setting allows you to set the vertical position (desktop) of the hotspot;

    \n
    5. \n
  5. \n

    Spot horizontal position mobile – the setting allows you to set the horizontal position (mobile) of the hotspot;

    \n
    6. \n
  6. \n

    Spot vertical position mobile – the setting allows you to set the vertical position (mobile) of the hotspot;

    \n
    7. \n
\n","blockTitle":"Trend products","fieldGroupName":"manual_category_blocks","hash":"section-trend-products"},{"blockContent":"

With this section you can show a banner with text content, countdown timer and media content (image, HTML5 video, Youtube/Vimeo).

\n
\n

\"trend-products\" \"banner-timer\"

\n

\"section-banner\"

\n

\"banner

\n

Adding a Section

\n

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Banner.

\n

Section settings

\n

General

\n

\n

\"Settings\"

\n

\"settings

\n
    \n
  1. \n

    Desktop banner min height – the setting allows you to specify a minimum height for the banner on the desktop;

    \n
    2. \n
  2. \n

    Mobile banner min height – the setting allows you to specify a minimum height for the banner on the mobile;

    \n
    3. \n
  3. \n

    Media type – the setting allows you to select the type of media content to be displayed. Available types are: Image, HTML5 video, Youtube/Vimeo.

    \n
    4. \n
  4. \n

    Heading – the setting allows you to specify the title of the section;

    \n
    5. \n
  5. \n

    Text – the setting allows you to specify the text content;

    \n
    6. \n
  6. \n

    First button label – the setting allows you to specify the label content of the button;

    \n
    7. \n
  7. \n

    First button link – the setting allows you to specify the url field for the button;

    \n
    8. \n
  8. \n

    First button aria-label – the setting allows you to specify the field for aria-label, this field is needed to improve accessibility, and people using screen readers will hear the purpose of this button;

    \n
    9. \n
  9. \n

    Second button label – the setting allows you to specify the label content of the button;

    \n
    10. \n
  10. \n

    Second button link – the setting allows you to specify the url field for the button;

    \n
    11. \n
  11. \n

    Second button aria-label – the setting allows you to specify the field for aria-label, this field is needed to improve accessibility, and people using screen readers will hear the purpose of this button;

    \n
    12. \n
  12. \n

    Image desktop – the setting allows you to specify the picture displayed on the desktop. Only works with ‘Image‘ media type;

    \n
    13. \n
  13. \n

    Image mobile – the setting allows you to specify the picture displayed on the mobile. Only works with ‘Image‘ media type;

    \n
    14. \n
  14. \n

    Show breadcrumbs – the setting allows you to show the breadcrumbs inside the banner(Can be displayed on any page except the home page).

    \n
    15. \n
\n

Countdown timer

\n

\"countdown

\n
    \n
  1. \n

    Enable – enable countdown timer block;

    \n
    2. \n
  2. \n

    Year – the setting allows you to specify the year until the end of the countdown;

    \n
    3. \n
  3. \n

    Month – the setting allows you to specify the month until the end of the countdown;

    \n
    4. \n
  4. \n

    Day – the setting allows you to specify the day until the end of the countdown;

    \n
    5. \n
  5. \n

    Hour – the setting allows you to specify the hour until the end of the countdown;

    \n
    6. \n
  6. \n

    Timezone – the setting allows you to specify the Timezone;

    \n
    7. \n
  7. \n

    Timer background – the setting allows you to specify the background color for the countdown;

    \n
    8. \n
  8. \n

    Timer color – the setting allows you to specify the text color for the countdown.

    \n
    9. \n
\n

Video

\n

\"video\"

\n
    \n
  1. \n

    HTML5 desktop video – the setting allows you to specify the field to add an HTML5 Video displayed on the desktop;

    \n
    2. \n
  2. \n

    HTML5 mobile video – the setting allows you to specify the field to add an HTML5 Video displayed on mobile;

    \n
    3. \n
  3. \n

    Youtube/Vimeo desktop video url – the setting allows you to specify the link to Youtube or Vimeo video displayed on the Desktop;

    \n
    4. \n
  4. \n

    Youtube/Vimeo mobile video url – the setting allows you to specify the link to Youtube or Vimeo video displayed on Mobile.

    \n
    5. \n
\n

Alignment

\n

\"alignment\"

\n
    \n
  1. \n

    Text alignment desktop – the setting allows you to specify text alignment on the desktop;

    \n
    2. \n
  2. \n

    Text alignment mobile – the setting allows you to specify text alignment on the mobile;

    \n
    3. \n
  3. \n

    Block alignment horizontal – the setting allows you to select the horizontal alignment of the block;

    \n
    4. \n
  4. \n

    Block alignment vertical – the setting allows you to select the vertical alignment of the block;

    \n
    5. \n
  5. \n

    Block alignment vertical mobile – the setting allows you to select the vertical alignment of the block (mobile);

    \n
    6. \n
\n

Colors

\n

\"Colors\"

\n
    \n
  1. \n

    Section background – the setting allows you to specify the background color;

    \n
    2. \n
  2. \n

    Overlay – the setting allows you to specify the overlay color for media content;

    \n
    3. \n
  3. \n

    Text – the setting allows you to specify the text color;

    \n
    4. \n
  4. \n

    First button background – the setting allows you to specify the button background color;

    \n
    5. \n
  5. \n

    First button label – the setting allows you to specify the button label color;

    \n
    6. \n
  6. \n

    First button border – the setting allows you to specify the button border color;

    \n
    7. \n
  7. \n

    First button background (hover) – the setting allows you to specify the button background color on hover;

    \n
    8. \n
  8. \n

    First button label (hover) – the setting allows you to specify the button label color on hover;

    \n
    9. \n
  9. \n

    First button border (hover) – the setting allows you to specify the button border color on hover;

    \n
    10. \n
  10. \n

    Second button background – the setting allows you to specify the button background color;

    \n
    11. \n
  11. \n

    Second button label – the setting allows you to specify the button label color;

    \n
    12. \n
  12. \n

    Second button border – the setting allows you to specify the button border color;

    \n
    13. \n
  13. \n

    Second button background (hover) – the setting allows you to specify the button background color on hover;

    \n
    14. \n
  14. \n

    Second button label (hover) – the setting allows you to specify the button label color on hover;

    \n
    15. \n
  15. \n

    Second button border (hover) – the setting allows you to specify the button border color on hover;

    \n
    16. \n
\n

Layout

\n

\"layout

\n
    \n
  1. \n

    Container width – section container settings.

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n","blockTitle":"Banner","fieldGroupName":"manual_category_blocks","hash":"section-banner"},{"blockContent":"

\"images-row\"

\n

\"mobile

\n

Adding a section

\n

In order to add a section, you need to go to Customizer → Add Section → Images row.

\n

Settings

\n

\"settings\"

\n

 

\n

General

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section;

    \n
    3. \n
  3. \n

    Heading – the setting allows you to set the section heading;

    \n
    4. \n
  4. \n

    Two images layout – the setting allows you to set the section layout;

    \n
    5. \n
  5. \n

    Image – the setting allows you to set the first image;

    \n
    6. \n
  6. \n

    Second image – the setting allows you to set the second image;

    \n
    7. \n
  7. \n

    Third image – the setting allows you to set the third image.

    \n
    8. \n
\n

 

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Container width – section container settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n","blockTitle":" Images row","fieldGroupName":"manual_category_blocks","hash":"section-images-row"},{"blockContent":"

Adding a section

\n

In order to add a section, you need to go to Customizer → Add Section → Image comparison.

\n

\n

Adding a section

\n

In order to add a section, you need to go to Customizer → Add Section → Image comparison.

\n

\"adding

\n

Section settings

\n

General

\n

\"image

\n

\"image

\n
    \n
  1. \n

    Heading – section heading;

    \n
    2. \n
  2. \n

    Text – section richtext;

    \n
    3. \n
  3. \n

    First image – the image that will be displayed as a “before image”;

    \n
    4. \n
  4. \n

    Second image – the image that will be displayed as an “after image”. Use an image with the same dimensions as the first image for the best view of the section;

    \n
    5. \n
  5. \n

    Background image – the settings allow you to add a picture for the background;

    \n
    6. \n
  6. \n

    Desktop image height – the height of the images in the section. The setting has options from 200px to 800px in increments of 50px. There is also an option for full size – the image occupies 100% of the width and height of the section;

    \n
    7. \n
  7. \n

    Mobile image height – mobile image height. The setting has the same options as the desktop.

    \n
    8. \n
\n

Layout

\n

\"image

\n
    \n
  1. \n

    Container width – a container width of the section. If “Inherit” value is selected then the container width is based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
\n","blockTitle":"Image compare","fieldGroupName":"manual_category_blocks","hash":"section-image-compare"},{"blockContent":"

\"Collections

\n

\n

Adding a section

\n

\"add

\n

\n

In order to add a section, you need to go to Customizer → Add Section → Collection carousel.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

General

\n

\"autoplay

\n
    \n
  1. \n

    Enable autoplay — this setting allows you to enable automatic slide transitions;

    \n
    2. \n
  2. \n

    Autoplay speed — this setting allows you to set sets the interval in seconds between slides during autoplay.

    \n
    3. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Container width — section container settings.

    \n
    2. \n
  2. \n

    Desktop offset top — the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom — the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top — the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom — the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top — the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom — the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top — the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom — the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

Block settings

\n

\n

\"block

\n
    \n
  1. \n

    Collection — this setting allows you to select the collection to display on the slide;

    \n
    2. \n
  2. \n

    Image — this setting allows you to upload a custom image to replace the default collection image;

    \n
    3. \n
  3. \n

    Custom heading – this setting allows you to set a custom collection heading;

    \n
    4. \n
  4. \n

    Button label — the setting allows you to set the text displayed on the button;

    \n
    5. \n
  5. \n

    Button style — the setting allows you to choose the style of the button;

    \n
    6. \n
  6. \n

    Heading active color — the setting allows you to set the color of the collection title displayed on the active slide;

    \n
    7. \n
  7. \n

    Button color — this setting allows you to set the text color of the button;

    \n
    8. \n
  8. \n

    Button background — this setting allows you to set the background color of the button;

    \n
    9. \n
  9. \n

    Button border — this setting allows you to set the border color of the button;

    \n
    10. \n
  10. \n

    Button color (hover) — this setting allows you to set the text color of the button when hovered;

    \n
    11. \n
  11. \n

    Button background (hover) — this setting allows you to set the background color of the button when hovered;

    \n
    12. \n
  12. \n

    Button border (hover) — this setting allows you to set the border color of the button when hovered.

    \n
    13. \n
\n

\n

\n

\n

\n

\n","blockTitle":"Collection carousel","fieldGroupName":"manual_category_blocks","hash":"section-collection-carousel"},{"blockContent":"

\"Newsletter

\n

\"Newsletter

\n

Adding a Section

\n

This settings block is intended for general Newsletter popup settings on the site.

\n

In order to get to the Newsletter popup settings block, you need to go to Customizer → Popups group → Newsletter popup.

\n

\"how

\n

Settings

\n

Colors

\n

\"colors\"

\n

 

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

General

\n
\n
\"general
\n
\n
    \n
  1. \n

    Cookie time – the setting is responsible for the time until the popup is re-displayed when the user closes it;

    \n
    2. \n
  2. \n

    Heading – setting allows you to set title text;

    \n
    3. \n
  3. \n

    Text – setting allows you to set description text;

    \n
    4. \n
  4. \n

    Input placeholder – setting allows you to set input placeholder text;

    \n
    5. \n
  5. \n

    Button submit label – setting allows you to set the submit button text;

    \n
    6. \n
  6. \n

    Button close label – setting allows you to set close button text;

    \n
    7. \n
  7. \n

    Show socials – setting allows you to show/hide social links;

    \n
    8. \n
  8. \n

    Enable images animation – setting allows you to enable/disable image animation.

    \n
    9. \n
\n

Blocks settings

\n

By default placeholders are used for images. At least three image settings for a block must be filled in for placeholders not to be displayed.

\n

\"blocks

\n
    \n
  1. \n

    Movement speed (desktop) — this setting allows you to set the animation time, which affects the speed on desktop;

    \n
    2. \n
  2. \n

    Movement speed (mobile) — this setting allows you to set the animation time, which affects the speed on mobile;

    \n
    3. \n
  3. \n

    Image 1 — this setting allows you to upload a custom image #1;

    \n
    4. \n
  4. \n

    Image 2 — this setting allows you to upload a custom image #2;

    \n
    5. \n
  5. \n

    Image 3 — this setting allows you to upload a custom image #3;

    \n
    6. \n
  6. \n

    Image 4 — this setting allows you to upload a custom image #4.

    \n
    7. \n
\n

Additional information

\n

\"settings\"

\n

The remaining settings (texts) are taken from the translations. Newsletter popup:

\n
    \n
  1. \n

    Label – the setting allows you to set the text for the input label;

    \n
    2. \n
  2. \n

    Success – message on successful subscription;

    \n
    3. \n
  3. \n

    Button label – setting allows you to set the label for the submit button.

    \n
    4. \n
\n","blockTitle":"Newsletter popup","fieldGroupName":"manual_category_blocks","hash":"section-newsletter-popup"},{"blockContent":"

\"section

\n

Adding a Section

\n

\"how

\n

The section is present by default in the Header group

\n

Section settings

\n

General

\n

\"general\"

\n
    \n
  1. \n

    Layout

    \n
      \n
    1. \n

      Slideshow: Displays content as a slideshow (requires “Text slide” blocks).

      \n
      2. \n
    2. \n

      Ticker: Displays content in a ticker format.

      \n
      3. \n
    \n
    2. \n
\n

Slideshow

\n

\"slideshow\"

\n
    \n
  1. \n

    Enable autoplay – Automatically cycles through slides if enabled.

    \n
    2. \n
  2. \n

    Autoplay speed – Adjust the interval (in seconds) between slides.

    \n
    3. \n
\n

Simple Text

\n

\"simple

\n
    \n
  1. \n

    Text – Add a single block of text for the announcement bar.

    \n
    2. \n
\n

Ticker

\n

\"ticker\"

\n
    \n
  1. \n

    Hide bullets – Hides navigation bullets under the ticker.

    \n
    2. \n
  2. \n

    Text – Add scrolling text content for the ticker.

    \n
    3. \n
  3. \n

    Discount code – Add a code to be displayed.

    \n
    4. \n
  4. \n

    Discount label – Text displayed alongside the discount code. Default: “Copy”.

    \n
    5. \n
  5. \n

    Movement speed (desktop) – Adjust the ticker’s scrolling speed on desktop (in seconds).

    \n
    6. \n
  6. \n

    Movement speed (mobile) – Adjust the ticker’s scrolling speed on mobile (in seconds).

    \n
    7. \n
\n

Discount

\n

\"discount\"

\n
    \n
  1. \n

    Discount code – input in which you want to add the desired discount code;

    \n
    2. \n
  2. Discount label – input for the label of the button that allows users to copy the discount;
    3. \n
\n

Colors

\n

\"announcement

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section;

    \n
    3. \n
  3. \n

    Discount text color – Customize the text color for the discount block.

    \n
    4. \n
  4. \n

    Discount background color – Customize the background color for the discount block.

    \n
    5. \n
  5. \n

    Discount border color – Customize the border color for the discount block.

    \n
    6. \n
\n

Blocks settings

\n

\"block

\n
\n
\n
    \n
  1. \n

    Text desktop – Add custom text for desktop displays.

    \n
    2. \n
  2. \n

    Discount code – Add a specific discount code.

    \n
    3. \n
  3. \n

    Discount label – Add label text for the discount code (Default: “Copy”).

    \n
    4. \n
\n
\n
\n","blockTitle":"Announcement bar","fieldGroupName":"manual_category_blocks","hash":"section-announcement-bar"},{"blockContent":"

\"Footer

\n

Adding a section

\n

\n

\"how

\n

The section is present by default in the Footer group

\n

Section settings

\n

\"footer\"

\n

Logo

\n
    \n
  1. \n

    Logo image – Upload an image for the logo.

    \n
    2. \n
  2. \n

    Logo width – Set the width of the logo (50–450 px). Default: 320 px.

    \n
    3. \n
  3. \n

    Copyright text – Customize the copyright text.

    \n
      \n
    1. \n

      Default: “Copyright © %date%.”

      \n
      2. \n
    2. \n

      “%date%” will be replaced with the current year.

      \n
      3. \n
    \n
    4. \n
  4. \n

    Show payment icons – Toggle to display or hide payment icons.

    \n
    5. \n
\n

Country/Region Selector

\n
    \n
  1. \n

    Show country/region selector – Toggle to enable or disable the selector.

    \n
    2. \n
\n

Language Selector

\n
    \n
  1. \n

    Show language selector – Toggle to enable or disable the selector.

    \n
    2. \n
\n

Follow on Shop

\n
    \n
  1. \n

    Enable Follow on Shop – Toggle to display a “Follow on Shop” option.

    \n
    2. \n
\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – Inherit color scheme from the theme settings.

    \n
    2. \n
  2. \n

    Color scheme – Choose a specific color scheme if inheritance is disabled.

    \n
    3. \n
\n

Blocks settings

\n

Footer Menu

\n

Limit: 3 menu blocks.

\n

\"footer

\n
    \n
  1. \n

    Heading – Add a heading for the menu block.

    \n
    2. \n
  2. \n

    Menu – Choose a menu to display (top-level items only). Default: footer.

    \n
    3. \n
\n

Footer Contact

\n

Limit: 1 contact block.

\n

\"footer

\n
    \n
  1. \n

    Heading – Add a heading for the contact block.

    \n
    2. \n
  2. \n

    Show socials – Toggle to show or hide social links (to add socials go to Theme Settings → Social media).

    \n
    3. \n
\n

Email

\n
    \n
  1. \n

    Icon – Upload an image for the email icon.

    \n
    2. \n
  2. \n

    Text – Add custom email text.

    \n
    3. \n
\n

Phone

\n
    \n
  1. \n

    Icon – Upload an image for the phone icon.

    \n
    2. \n
  2. \n

    Text – Add custom phone text.

    \n
    3. \n
\n

Additional Information

\n

\"additional

\n
    \n
  1. \n

    Icon – Upload an image for additional information.

    \n
    2. \n
  2. \n

    Text – Add custom text for additional details.

    \n
    3. \n
\n

Footer Newsletter

\n

Limit: 1 newsletter block.

\n

\"footer

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Heading – Add a heading for the newsletter block. Default: “Newsletter”.

    \n
    2. \n
  2. \n

    Text – Add a description or introductory text.

    \n
    3. \n
  3. \n

    Input placeholder – Placeholder for the email input field. Default: “Enter email address…”.

    \n
    4. \n
  4. \n

    Button label – Label for the subscribe button. Default: “Subscribe”.

    \n
    5. \n
  5. \n

    Success message – Message is shown upon successful subscription. Default: “Thanks for subscribing”.

    \n
    6. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n

\n

\n

\n

\n

\n","blockTitle":"Footer","fieldGroupName":"manual_category_blocks","hash":"section-footer"},{"blockContent":"

\"section

\n

\"image-with-text\"

\n

\"section

\n

\"section

\n

Adding a section

\n

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Image with text.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;
    2. \n
  2. Color scheme – this setting allows you to select a color scheme for the section.
    3. \n
\n

General

\n

\"general

\n
    \n
  1. Images layout – the setting allows you to display one image or a few images in the two columns;
    2. \n
  2. Enable images animation – the setting allows you to enable image animation for the ‘Multiply images’ layout;
    3. \n
  3. Image position – the setting allows you to select image position in the section;
    4. \n
  4. Text alignment – the setting allows you to select the alignment of the text;
    5. \n
  5. Label – the setting allows you to set the text for the label;
    6. \n
  6. Heading – the setting allows you to set the text of the heading.
    7. \n
  7. Text – the setting allows you to set text content;
    8. \n
  8. Button label – the setting allows you to set the label for the button;
    9. \n
  9. Button aria-label – the setting allows you to set the aria-label for the button. This attribute allows screen readers to better convey information to people with disabilities;
    10. \n
  10. Button link – the setting allows you to select a button style.
    11. \n
  11. Blog – select the blog whose posts you want to display.
    12. \n
  12. Button label – the setting allows you to set the label for the button.
    13. \n
  13. Button aria-label – the setting allows you to set the aria-label for the button. This attribute allows screen readers to better convey information to people with disabilities.
    14. \n
  14. Button style – the setting allows you to set the type of the button.
    15. \n
\n

First column images

\n

\n

\"first

\n
    \n
  1. Movement speed – the setting allows you to set an animation speed for the images;
    2. \n
  2. First image – the setting allows you to select the first image;
    3. \n
  3. Second image – the setting allows you to select the second image;
    4. \n
  4. Third image – the setting allows you to select the third image;
    5. \n
\n

Second column images

\n

\"second

\n
    \n
  1. Movement speed – the setting allows you to set an animation speed for the images;
    2. \n
  2. First image – the setting allows you to select the first image;
    3. \n
  3. Second image – the setting allows you to select the second image;
    4. \n
  4. Third image – the setting allows you to select the third image;
    5. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. Container width – section container settings.
    2. \n
  2. Desktop offset top – the top indent of the section on the desktop;
    3. \n
  3. Desktop offset bottom – the bottom indent of the section on the desktop;
    4. \n
  4. Mobile offset top – the top indent of the section on the mobile;
    5. \n
  5. Mobile offset bottom – the bottom indent of the section on the mobile;
    6. \n
  6. Inner desktop offset top – the top indent of the inner container on the desktop;
    7. \n
  7. Inner desktop offset bottom – the bottom indent of the inner container on the desktop;
    8. \n
  8. Inner mobile offset top – the top indent of the inner container on the mobile;
    9. \n
  9. Inner mobile offset bottom – the bottom indent of the inner container on the mobile.
    10. \n
\n","blockTitle":"Image with text","fieldGroupName":"manual_category_blocks","hash":"section-image-with-text"},{"blockContent":"

\"slideshow

\n

Adding a section

\n

\n

\"how

\n

To add the Slideshow section, navigate to: Customizer → Add Section → Slideshow

\n

Section settings

\n

 

\n

Color Scheme

\n

\"colors\"

\n
    \n
  1. Enable color scheme inheritance – Toggle to inherit the color scheme from theme settings.
    2. \n
  2. Color scheme – Select a specific color scheme if inheritance is disabled. Default: Scheme 1.
    3. \n
\n

Slideshow Settings

\n

\"slideshow\"

\n
    \n
  1. \n

    Show pagination – Display pagination controls for the slideshow.

    \n
    2. \n
  2. \n

    Show slide preview – Display preview thumbnails of slides.

    \n
    3. \n
  3. \n

    Enable loop – Enable continuous looping of the slideshow.

    \n
    4. \n
  4. \n

    Enable autoplay – Automatically cycle through slides.

    \n
    5. \n
  5. \n

    Autoplay speed – Set the interval (in seconds) for slide transitions. Default: 5 s.

    \n
    6. \n
  6. \n

    Animation speed – Control the transition speed between slides (in seconds). Default: 0.5 s.

    \n
    7. \n
  7. \n

    Animation type – Choose the animation for transitions:

    \n
      \n
    1. \n

      Fade

      \n
      2. \n
    2. \n

      Slide

      \n
      3. \n
    3. \n

      Flip

      \n
      4. \n
    4. \n

      Creative (Default)

      \n
      5. \n
    5. \n

      Parallax

      \n
      6. \n
    \n
    8. \n
\n

Colors

\n

Allows you to customize the pagination color in Slide preview

\n

\"pagination

\n

\"colors\"

\n
    \n
  1. \n

    Progress bar – changes the transparent background in pagination.

    \n
    2. \n
  2. \n

    Progress bar fill – changes the transparent background in pagination.

    \n
    3. \n
  3. Pagination – changes the color of pagination on slides (non-active slides in pagination have this color with transparency).
    4. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop section height – Adjust the height of the slideshow for desktop (percentage). Default: 100%.

    \n
    2. \n
  2. \n

    Mobile section height – Adjust the height of the slideshow for mobile (percentage). Default: 100%.

    \n
    3. \n
  3. \n

    Subtract header height – Ensure the slideshow height excludes the header area.

    \n
    4. \n
  4. \n

    Container width – Choose the width of the slideshow container:

    \n
      \n
    1. \n

      Default: 1680px (Default setting).

      \n
      2. \n
    2. \n

      Large: 1920px.

      \n
      3. \n
    3. \n

      Full width: 100%.

      \n
      4. \n
    4. \n

      Inherit of general setting: Use width from theme layout settings.

      \n
      5. \n
    \n
    5. \n
\n

Offsets

\n

External Offsets

\n
    \n
  1. \n

    Adjust margins outside the container for both desktop and mobile:

    \n
      \n
    1. \n

      Top offset – Default: 0 px.

      \n
      2. \n
    2. \n

      Bottom offset – Default: 0 px.

      \n
      3. \n
    \n
    2. \n
\n

Internal Offsets

\n
    \n
  1. \n

    Adjust margins inside the container for both desktop and mobile:

    \n
      \n
    1. \n

      Top offset – Default: 0 px.

      \n
      2. \n
    2. \n

      Bottom offset – Default: 0 px.

      \n
      3. \n
    \n
    2. \n
\n

Blocks Settings

\n

Image Block

\n

Image settings

\n

\"image\"

\n
    \n
  1. \n

    Image (desktop) – Upload a desktop-specific image.

    \n
    2. \n
  2. \n

    Image (mobile) – Upload a mobile-specific image.

    \n
    3. \n
\n

Text Content

\n

\"text

\n
    \n
  1. \n

    Heading – Add a heading for the slide. Default: Heading.

    \n
    2. \n
  2. \n

    Description – Add descriptive text. Default: <p>Text that describes the content of slide</p>.

    \n
    3. \n
  3. \n

    Button label – Add a button label. Default: Button label.

    \n
    4. \n
  4. \n

    Button aria-label – Improve accessibility with descriptive text.

    \n
    5. \n
  5. \n

    Button link – Provide a link for the button. Default: /.

    \n
    6. \n
  6. \n

    Open in new tab – Toggle to open the link in a new tab.

    \n
    7. \n
\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Customize the colors for text, background, overlay, button, and hover states.

    \n
    2. \n
\n

HTML Video Block

\n

\"html

\n

\"html

\n

Content Settings

\n
    \n
  1. Video (desktop) – Upload a desktop-specific video.
    2. \n
  2. Video (mobile) – Upload a mobile-specific video.
    3. \n
  3. Preview image (desktop) – Upload a desktop-specific preview image.
    4. \n
  4. Preview image (mobile) – Upload a mobile-specific preview image.
    5. \n
  5. Heading – Add a heading for the slide. Default: Heading.
    6. \n
  6. Description – Add descriptive text. Default: <p>Text that describes content of slide</p>.
    7. \n
  7. Button label – Add a button label. Default: Button label.
    8. \n
  8. Button aria-label – Improve accessibility with descriptive text.
    9. \n
  9. Button link – Provide a link for the button. Default: /.
    10. \n
  10. Open in new tab – Toggle to open the link in a new tab.
    11. \n
\n

Video settings

\n
    \n
  1. \n

    Play type – Choose playback behavior: Autoplay, Play by button, or both.

    \n
    2. \n
\n

Colors

\n
    \n
  1. \n

    Customize colors for text, background, and overlays.

    \n
    2. \n
\n

External Video Block

\n

\"youtube

\n

\"youtube

\n

Content Settings

\n
    \n
  1. Video URL (desktop) – Provide YouTube or Vimeo video URLs for desktop.
    2. \n
  2. Video URL (mobile) – Provide YouTube or Vimeo video URLs for mobile.
    3. \n
  3. Preview image (desktop) – Upload a desktop-specific preview image.
    4. \n
  4. Preview image (mobile) – Upload a mobile-specific preview image.
    5. \n
  5. Heading – Add a heading for the slide. Default: Heading.
    6. \n
  6. Description – Add descriptive text. Default: <p>Text that describes content of slide</p>.
    7. \n
  7. Button label – Add a button label. Default: Button label.
    8. \n
  8. Button aria-label – Improve accessibility with descriptive text.
    9. \n
  9. Button link – Provide a link for the button. Default: /.
    10. \n
  10. Open in new tab – Toggle to open the link in a new tab.
    11. \n
\n

Video settings

\n
    \n
  1. Play type – Choose playback behavior: Autoplay, Play by button, or both.
    2. \n
\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Customize colors for text, background, and overlays.

    \n
    2. \n
\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n","blockTitle":"Slideshow","fieldGroupName":"manual_category_blocks","hash":"section-slideshow"},{"blockContent":"

\"section

\n

Adding a Section

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Product features.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;
    2. \n
  2. Color scheme – this setting allows you to select a color scheme for the section.
    3. \n
\n

Hotspot

\n

\"hotspot\"

\n
    \n
  1. Animated – the setting is responsible for enabling animation for the hotspot;
    2. \n
  2. Color – the setting is responsible for the color of the hotspot;
    3. \n
  3. Border color – the setting is responsible for the border color of the hotspot;
    4. \n
  4. Background – the setting is responsible for the background color of the hotspot;
    5. \n
  5. Color (active) – the setting is responsible for the color of the hotspot in the active state;
    6. \n
  6. Border color (active) – the setting is responsible for the border color of the hotspot in the active state;
    7. \n
  7. Background (active) – the setting is responsible for the background color of the hotspot in the active state.
    8. \n
\n

General

\n
\n
\"general
\n
\n
    \n
  1. Heading – the setting is responsible for the heading of the section;
    2. \n
  2. Text – the setting is responsible for the text of the section;
    3. \n
  3. Image – the setting is responsible for the text of the section.
    4. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. Make full width – If disabled – container width will be set based on the group ‘Layout’ settings in the Theme settings;
    2. \n
  2. Desktop offset top – the top indent of the section on the desktop;
    3. \n
  3. Desktop offset bottom – the bottom indent of the section on the desktop;
    4. \n
  4. Mobile offset top – the top indent of the section on the mobile;
    5. \n
  5. Mobile offset bottom – the bottom indent of the section on the mobile;
    6. \n
  6. Inner desktop offset top – the top indent of the inner container on the desktop;
    7. \n
  7. Inner desktop offset bottom – the bottom indent of the inner container on the desktop;
    8. \n
  8. Inner mobile offset top – the top indent of the inner container on the mobile;
    9. \n
  9. Inner mobile offset bottom – the bottom indent of the inner container on the mobile.
    10. \n
\n

Blocks settings

\n

General

\n
\n
\"product
\n
\n
    \n
  1. Heading – the setting allows you to set the heading of the block;
    2. \n
  2. Description – the setting allows you to set the description of the block;
    3. \n
  3. Hotspot vertical position – the setting is responsible for the vertical position of the hotspot;
    4. \n
  4. Hotspot horizontal position – the setting is responsible for the horizontal position of the hotspot.
    5. \n
\n

Feature 1 (1-4)

\n

\"feature\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Icon – the setting allows you to set the icon of the feature item;

    \n
    2. \n
  2. \n

    Text – the setting allows you to set the text of the feature item.

    \n
    3. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n","blockTitle":"Product features","fieldGroupName":"manual_category_blocks","hash":"section-product-features"},{"blockContent":"

\"our

\n

Adding a section

\n

\"how

\n
\n
\n
\n
\n
\n

In order to add a section, you need to go to Customizer → Add Section → Our story.

\n

Section settings

\n

Color

\n

\"colors\"

\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings.

    \n
    2. \n
  2. \n

    Color scheme – the setting allows you to choose a scheme.

    \n
    3. \n
\n

General

\n

\"text

\n
    \n
  1. \n

    Text – the setting allows you to insert text for the section.

    \n
    2. \n
\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Container width – section container settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

Blocks settings

\n

Image

\n

\"image

\n
    \n
  1. \n

    Image – setting allows you to set an image for the block

    \n
    2. \n
\n","blockTitle":"Our story","fieldGroupName":"manual_category_blocks","hash":"section-our-story"},{"blockContent":"

\"collection

\n

Adding a Section

\n
\n
\n
\n
\n
\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Collection list.

\n

Section settings

\n

Colors

\n
\n
\"colors\"
\n
\n
    \n
  1. Enable color scheme inheritance – when the setting is enabled, the color scheme is inherited from the theme settings;
    2. \n
  2. Color scheme – setting allows you to select a color scheme for the section.
    3. \n
\n

General

\n

\"\"

\n
    \n
  1. Heading – setting allows you to set the heading;
    2. \n
  2. Show products count – setting allows you show products count.
    3. \n
\n

Layout

\n
\n

\"layout\"

\n
\n
    \n
  1. Container width – a container width of the section. If “Inherit” value is selected then the container width is based on the group ‘Layout’ settings in the Theme settings;
    2. \n
  2. Desktop offset top – the top indent of the section on the desktop;
    3. \n
  3. Desktop offset bottom – the bottom indent of the section on the desktop;
    4. \n
  4. Mobile offset top – the top indent of the section on the mobile;
    5. \n
  5. Mobile offset bottom – the bottom indent of the section on the mobile;
    6. \n
  6. Inner desktop offset top – the top indent of the inner container on the desktop;
    7. \n
  7. Inner desktop offset bottom – the bottom indent of the inner container on the desktop;
    8. \n
  8. Inner mobile offset top – the top indent of the inner container on the mobile;
    9. \n
  9. Inner mobile offset bottom – the bottom indent of the inner container on the mobile.
    10. \n
\n

Blocks settings:

\n

\"collection\"

\n
    \n
  1. Collection – setting is responsible for the collection;
    2. \n
  2. Image – setting is responsible for the custom image of the collection.
    3. \n
\n","blockTitle":"Collection list","fieldGroupName":"manual_category_blocks","hash":"section-collection-list"},{"blockContent":"

\"Header

\n

Adding a Section

\n

\"header\"

\n

The section is static, it is added initially and cannot be removed.

\n

General settings

\n

\"search\"

\n

You can turn on or off the search. If you turn it on, the icon will appear in the header.

\n

Section settings

\n

General

\n

\"header

\n
    \n
  1. \n

    Type – the setting allows you to set the header type, 3 options are presented:

    \n\n
    2. \n
  2. \n

    Enable transparent header on the homepage – the setting allows you to enable a transparent header on the homepage. Transparent header only functions on Desktop resolution. When the setting is enabled, the header will be transparent only in the top position, when hovering and scrolling the page, the header will have a background;

    \n
    3. \n
  3. \n

    Enable transparent header on the collection page– the setting allows you to enable a transparent header on the collection page. Transparent header only functions on Desktop resolution. When the setting is enabled, the header will be transparent only in the top position, when hovering and scrolling the page, the header will have a background;

    \n
    4. \n
  4. \n

    Show border – the setting allows you to set a border under the header;

    \n
    5. \n
  5. \n

    Show language selector – when enabled in the main and mobile menu, a language selector is added;

    \n
    6. \n
  6. \n

    Show country/region selector – the checkbox is responsible for enabling/disabling change of the country (currency). To manage, go to settings → payments;

    \n
    7. \n
\n

Logo

\n

\"logo\"

\n
    \n
  1. \n

    Image – the setting allows you to set the logo image, if not specified, the text name of the store will be displayed;

    \n
    2. \n
  2. \n

    Image (transparent header) – the setting allows you to set the logo image for a transparent header, if not specified, the image will be displayed. We recommend using a logo of the same size as the not transparent header;

    \n
    3. \n
  3. \n

    Logo width – the setting allows you to set a range where you can specify the width of the logo from 20px to 250px on the Desktop. On the mobile, if there is not enough space, the logo will automatically shrink.

    \n
    4. \n
\n

Menu

\n

\"menu\"

\n
    \n
  1. \n

    Main menu – the setting allows you to set a menu that will be used for both Desktop and Mobile;

    \n
    2. \n
  2. \n

    Open by – the setting allows you to set submenu opening selection selector on Desktop: By hover, By click.

    \n
    3. \n
\n

Burger menu

\n

\"burger\"

\n

\"burger

\n

 

\n
    \n
  1. \n

    Menu – the setting allows you to set a burger menu that will be used for both Desktop and Mobile;

    \n
    2. \n
  2. \n

    Additional menu – the setting allows you to set an additional menu that will be used for both Desktop and Mobile;

    \n
    3. \n
  3. \n

    Show socials – the setting allows you to show socials;

    \n
    4. \n
  4. \n

    Phone number – the setting allows you to set custom text;

    \n
    5. \n
  5. \n

    Schedule information – the setting allows you to set custom text;

    \n
    6. \n
  6. \n

    Media image 1..3 – the setting allows you to set custom media image;

    \n
    7. \n
  7. \n

    Media URL 1..3 – the setting allows you to set URL for custom media image;

    \n
    8. \n
  8. \n

    Movement speed (desktop/mobile) – the setting allows you to set how fast the images will move.

    \n
    9. \n
\n

Colors

\n

\"menu

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – the setting allows you to select a color scheme for the section;

    \n
    3. \n
  3. \n

    Text (header transparent) – the setting allows you to set the text color for the transparent header;

    \n
    4. \n
  4. \n

    Cart count text – the setting allows you to set the color for the text of the number of items in the cart;

    \n
    5. \n
  5. \n

    Cart count text (header transparent) – the setting allows you to set the color for the text of the number of items in the cart for the transparent header;

    \n
    6. \n
  6. \n

    Cart count background – the setting allows you to set the color for the background of the number of items in the cart;

    \n
    7. \n
  7. \n

    Cart count background (header transparent) – the setting allows you to set the color for the background of the number of items in the cart for the transparent header;

    \n
    8. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n","blockTitle":"Header","fieldGroupName":"manual_category_blocks","hash":"section-header"},{"blockContent":"

\"section

\n

\"section

\n

Adding a section

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Stores locator.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

General

\n

\"general\"

\n

Heading – the setting allows you to specify the heading of the section.

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Container width – section container settings.

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

Block settings

\n

\"block

\n
    \n
  1. \n

    Heading – the setting (required) allows you to specify the heading of the block, if this setting is blank – the block will be hidden;

    \n
    2. \n
  2. \n

    Store image – the setting allows you to specify the image of the block

    \n
    3. \n
  3. \n

    Text – the setting allows you to specify the text of the block;

    \n
    4. \n
  4. \n

    Phone text – the setting allows you to specify a text for the phone;

    \n
    5. \n
  5. \n

    Schedule text – the setting allows you to specify a text for the schedule;

    \n
    6. \n
  6. \n

    Google maps API key – the setting allows you to add a Google Maps API key. Learn more about how to create an API key;

    \n
    7. \n
  7. \n

    Map query – the setting allows you to add a query parameter that is responsible for adding a point on the map. In our case, only the place mode has been added. You can add one point to the map in many ways. Learn more about how to add a query parameter.

    \n
    8. \n
  8. \n

    Map image – the setting allows you to specify the image that will be played instead of the map if the map is not added;

    \n
    9. \n
  9. \n

    Map link – the setting allows you to specify a link for the image of the map.

    \n
    10. \n
\n","blockTitle":"Stores locator","fieldGroupName":"manual_category_blocks","hash":"section-stores-locator"},{"blockContent":"

The Newsletter section in your Shopify theme allows you to create a customizable subscription area for your store. Below is a detailed guide to all settings, structured by blocks.

\n

\"section\"

\n

Adding a section

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Newsletter

\n

Settings

\n
\n
\n
\n
\n
\n
\n
\n

\"newsletter

\n

\"settings

\n

Color Scheme

\n
    \n
  1. \n

    Enable color scheme inheritance – When enabled, the section inherits the color scheme from the global theme settings. Default: true

    \n
    2. \n
  2. \n

    Color scheme – Select a custom color scheme for this section to override the inherited scheme. Default: scheme-1

    \n
    3. \n
\n

\n

General Settings

\n
    \n
  1. \n

    Layout – Choose the layout for the section. Options:

    \n
      \n
    • \n

      Standard

      \n
      • \n
    • \n

      Two columns
      \nDefault: Two columns

      \n
      • \n
    \n
    2. \n
  2. \n

    Revert content – Swaps the position of the images and form. Applies only to the “Two columns” layout. Default: false

    \n
    3. \n
  3. \n

    Label – Add a custom label for the Newsletter section.

    \n
    4. \n
  4. \n

    Heading – Define the main heading of the section.

    \n
    5. \n
  5. \n

    Text – Add descriptive text for the section. Default: <p>Be the first to know about new collections and exclusive offers</p>

    \n
    6. \n
  6. \n

    Input placeholder – Placeholder text for the email input field. Default: Enter email address...

    \n
    7. \n
  7. \n

    Button label – Text displayed on the subscription button. Default: Subscribe

    \n
    8. \n
  8. \n

    Button style – Choose the style for the subscription button. Options:

    \n
      \n
    • \n

      Primary

      \n
      • \n
    • \n

      Secondary
      \nDefault: Primary

      \n
      • \n
    \n
    9. \n
  9. \n

    Success message – The message displayed after a successful subscription. Only works with the standard form. Default: Thanks for subscribing

    \n
    10. \n
  10. \n

    Movement speed – Animation speed for column movement (in seconds). Default: 20s

    \n
    11. \n
\n

\n

Colors

\n
    \n
  1. \n

    Section background – Set the background color for the section. Default: #91837D

    \n
    2. \n
  2. \n

    Text color – Set the text color for the section. Default: #ffffff

    \n
    3. \n
\n

 

\n

Layout Settings

\n

\"layout\"

\n
    \n
  1. \n

    Container width – Adjust the width of the container. Options:

    \n
      \n
    • \n

      Default - 1680px

      \n
      • \n
    • \n

      Large - 1920px

      \n
      • \n
    • \n

      Full width

      \n
      • \n
    • \n

      Inherit of general setting
      \nDefault: Inherit

      \n
      • \n
    \n
    2. \n
  2. \n

    Desktop external offset top – Spacing above the section on desktop. Default: 0px

    \n
    3. \n
  3. \n

    Desktop external offset bottom – Spacing below the section on desktop. Default: 0px

    \n
    4. \n
  4. \n

    Mobile external offset top – Spacing above the section on mobile. Default: 0px

    \n
    5. \n
  5. \n

    Mobile external offset bottom – Spacing below the section on mobile. Default: 0px

    \n
    6. \n
  6. \n

    Desktop internal offset top – Padding inside the section at the top on desktop. Default: 0px

    \n
    7. \n
  7. \n

    Desktop internal offset bottom – Padding inside the section at the bottom on desktop. Default: 0px

    \n
    8. \n
  8. \n

    Mobile internal offset top – Padding inside the section at the top on mobile. Default: 80px

    \n
    9. \n
  9. \n

    Mobile internal offset bottom – Padding inside the section at the bottom on mobile. Default: 56px

    \n
    10. \n
\n

\n

Blocks

\n
    \n
  1. \n

    Custom Liquid – Add custom liquid content.

    \n
    2. \n
  2. \n

    Image 1–4 columns – Add images to the section, with each column block allowing an image selection.

    \n
    3. \n
\n

 

\n

Recommendations for Better Usage

\n

Design Tips

\n
    \n
  • \n

    Use high-contrast colors for better readability. For example, a dark text on a light background or vice versa.

    \n
    • \n
\n

Testing and Debugging

\n
    \n
  • \n

    Test the subscription functionality by sending test emails to ensure smooth processing.

    \n
    • \n
  • \n

    Use tools like WebAIM to verify contrast and readability for accessibility compliance.

    \n
    • \n
\n

SEO Optimization

\n
    \n
  • \n

    Write clear and descriptive headings and text to improve SEO rankings.

    \n
    • \n
  • \n

    Avoid generic placeholders like “Newsletter”—use something actionable and engaging.

    \n
    • \n
\n

Presets

\n

Default configuration for quick setup:

\n
    \n
  1. \n

    Label – Newsletter

    \n
    2. \n
  2. \n

    Heading – Sign up and get 10% off

    \n
    3. \n
  3. \n

    Success message – Thanks for subscribing

    \n
    4. \n
  4. \n

    Text – <p>Sign up for early sale access, new in, promotions and more</p>

    \n
    5. \n
  5. \n

    Email placeholder – Enter email address...

    \n
    6. \n
\n

This guide provides a structured overview of all settings available in the Newsletter section. For further assistance, consult your theme developer or Shopify’s official documentation.

\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n","blockTitle":"Newsletter","fieldGroupName":"manual_category_blocks","hash":"section-newsletter"},{"blockContent":"

In this section you can add images with blocks. You can add a link to each image if you want.

\n

\"social-gallery\"

\n

\"section

\n

Adding a section

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Social gallery.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

General

\n

\"general\"

\n
    \n
  1. \n

    Heading – the setting allows you to set the text of the heading.

    \n
    2. \n
  2. \n

    Text – the setting allows you to set text content;

    \n
    3. \n
  3. \n

    Link label – the setting allows you to set the label for the link;

    \n
    4. \n
  4. \n

    Link url – the setting allows you to select a URL for the link;

    \n
    5. \n
  5. \n

    Movement speed – the setting allows you to set an animation speed for the images;

    \n
    6. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Container width – section container settings.

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

Block “Image”

\n

\"block

\n
    \n
  1. \n

    Image – the setting allows you to select the image;

    \n
    2. \n
  2. \n

    Link – the setting allows you to select a link for the image;

    \n
    3. \n
  3. \n

    Open link in new tab – the setting allows you to make the link open in a new tab;

    \n
    4. \n
\n

\n

\n

\n

\n

\n","blockTitle":"Social gallery","fieldGroupName":"manual_category_blocks","hash":"section-social-gallery"},{"blockContent":"

In this section, you can choose a collection and show the first 2 products.\"section\"

\n

Adding a Section

\n

\"add

\n

In order to add a section, you need to go to Customizer → Add Section → Featured collection.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when the setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

General

\n

\"featured

\n
    \n
  1. \n

    Heading – setting allows you to set the heading;

    \n
    2. \n
  2. \n

    Collection – setting allows you to set the collection;

    \n
    3. \n
  3. \n

    Image – setting allows you to set the custom image for the collection card;

    \n
    4. \n
  4. \n

    Link label – setting allows you to set the label for the collection link.

    \n
    5. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Container width – a container width of the section. If “Inherit” value is selected then the container width is based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

\n","blockTitle":"Featured collection","fieldGroupName":"manual_category_blocks","hash":"section-featured-collection"},{"blockContent":"

\"section

\n

Adding a Section

\n

\"add

\n

In order to add a section, you need to go to Customizer → Add Section → Featured products.

\n

Section settings

\n

General

\n

\"general

\n
    \n
  1. \n

    Heading – setting allows you to set the heading;

    \n
    2. \n
  2. \n

    Link label – setting allows you to set the label of the link;

    \n
    3. \n
  3. \n

    Link URL – setting allows you to set the URL of the link;

    \n
    4. \n
  4. \n

    Products – setting allows you to set the products-list;

    \n
    5. \n
  5. \n

    Layout – setting allows you to choose the layout of the grid(3/4 products per row);

    \n
    6. \n
  6. \n

    Show arrows – setting allows you to show the slider arrows;

    \n
    7. \n
\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when the setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

Layout

\n

\"layout

\n
    \n
  1. \n

    Container width – section container settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n","blockTitle":"Featured products","fieldGroupName":"manual_category_blocks","hash":"section-featured-products"},{"blockContent":"

\"error

\n

Adding a Section

\n

\"template\"

\n

The section is static on a 404 page template, it was added initially and cannot be removed.

\n

Section settings

\n

\"settings\"

\n
    \n
  1. \n

    Image – setting allows you to set the image;

    \n
    2. \n
  2. \n

    Heading – setting allows you to set the text for the title;

    \n
    3. \n
  3. \n

    Text – setting allows you to set the text content;

    \n
    4. \n
  4. \n

    Button label – setting allows you to set the label for the button;

    \n
    5. \n
  5. \n

    Button link – setting allows you to set a link for the button;

    \n
    6. \n
  6. \n

    Button style – setting allows you to select the style of the button. You can choose: Primary/Secondary;

    \n
    7. \n
\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

Layout

\n

\"layout

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    6. \n
  6. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    8. \n
  8. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    9. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n

\n

\n","blockTitle":"404 template","fieldGroupName":"manual_category_blocks","hash":"section-404-template"},{"blockContent":"

This section is available on the “Collection list” template. You can see all collections from your store on this template.

\n
\n

Adding a Section

\n

\"adding\"

\n

The section is static on a list collection page template, it was added initially and cannot be removed.

\n

Section settings

\n

General

\n

\"settings

\n
    \n
  1. \n

    Heading – setting allows you to set the text for the title;

    \n
    2. \n
  2. \n

    Paginate by – setting allows you to determine the number of collections to display per page. The minimum number of cards is 8, the maximum number is 24.

    \n
    3. \n
\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Container width – a container width of the section. If the “Inherit” value is selected then the container width is based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n","blockTitle":"List collections","fieldGroupName":"manual_category_blocks","hash":"section-list-collections"},{"blockContent":"
\n

Adding a Section

\n

\"adding\"

\n

In order to add a section, you need to go to Customizer → Add Section → Product tabs.

\n

Section settings

\n

General

\n

\"tab

\n
    \n
  1. Heading – the setting allows you to set the section heading;
    2. \n
  2. Show arrows – the heading allows you to show slider arrows.
    3. \n
\n

\"colors\"

\n
    \n
  1. Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;
    2. \n
  2. Color scheme – this setting allows you to select a color scheme for the section.
    3. \n
\n

Layout

\n

\"tab

\n
    \n
  1. \n

    Container width – a container width of the section. If the “Inherit” value is selected then the container width is based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

Block settings

\n

Block Tab

\n

\"tab

\n
\n
    \n
  1. Heading – the setting is responsible for tab button text;
    2. \n
  2. Products – the setting is responsible for product output. Limit: 6 products;
    3. \n
  3. Collection – the setting is responsible for collection output;
    4. \n
  4. Image – the setting is responsible for custom collection image output;
    5. \n
  5. Link label – the setting is responsible for collection link label output.
    6. \n
\n
\n

\n

\n

\n

\n

\n","blockTitle":"Product tabs","fieldGroupName":"manual_category_blocks","hash":"section-product-tabs"},{"blockContent":"

\"ticker

\n

The Ticker section in your Shopify theme allows you to create a scrolling ticker with customizable text, images, and layout settings. Below is a detailed guide to all settings.

\n

Adding a Section

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Ticker.

\n

General Settings

\n

\"ticker-settings\"

\n
    \n
  1. Hide divider – Enable this to hide the divider line in the ticker. Default: true
    2. \n
  2. Text – Add the ticker text. Default: Place the ticker text here
    3. \n
  3. Movement speed (desktop) – Set the scrolling speed of the ticker on the desktop (in seconds). Default: 20s
    4. \n
  4. Movement speed (mobile) – Set the scrolling speed of the ticker on mobile (in seconds). Default: 35s
    5. \n
  5. Main image – Add an image that will be displayed alongside the ticker. Default: Not set
    6. \n
  6. Background image desktop – Set a background image for the desktop. Default: Not set
    7. \n
  7. Background image mobile – Set a background image for mobile. Default: Not set
    8. \n
\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Text color – Set the text color for the ticker. Default: #ffffff

    \n
    2. \n
\n

Layout Settings

\n

\"layout\"

\n
    \n
  1. \n

    Container width – Adjust the width of the ticker container. Options:

    \n\n
    2. \n
  2. \n

    Desktop external offset top – Add spacing above the ticker on the desktop. Default: 0px

    \n
    3. \n
  3. \n

    Desktop external offset bottom – Add spacing below the ticker on the desktop. Default: 0px

    \n
    4. \n
  4. \n

    Mobile external offset top – Add spacing above the ticker on mobile. Default: 0px

    \n
    5. \n
  5. \n

    Mobile external offset bottom – Add spacing below the ticker on mobile. Default: 0px

    \n
    6. \n
\n
\n

This guide provides a structured overview of all settings available in the Ticker section. For further assistance, consult your theme developer or Shopify’s official documentation.

\n

\n

\n

\n

\n

\n","blockTitle":"Ticker","fieldGroupName":"manual_category_blocks","hash":"section-ticker"},{"blockContent":"

Adding a Section

\n

The section is static on a password page layout, it was added initially and cannot be removed.

\n

\"password

\n

Password header desktop

\n

\"password
\nPassword header mobile

\n

\"password
\nPassword header popup desktop

\n

\"password
\nPassword header popup mobile

\n

\"password
\nPassword header transparent desktop

\n

\"password
\nPassword header transparent mobile

\n

 

\n

Section settings

\n

General

\n

\"password

\n
    \n
  1. \n

    Enable transparent header – the setting allows you to enable a transparent version of the header. When hovering over the header or scrolling down, the header becomes opaque;

    \n
    2. \n
  2. \n

    Button label – the setting allows you to set the label of the popup opening button (if not set, it is taken from translations).

    \n
    3. \n
\n

Logo

\n

\"password

\n
    \n
  1. \n

    Logo – the setting allows you to set the logo image (if not set, shop.name is displayed);

    \n
    2. \n
  2. \n

    Logo (header transparent) – the setting allows you to set the logo image for the transparent header (if not set, logo is displayed);

    \n
    3. \n
  3. \n

    Logo width – the setting allows you to set the width of the logo (min 20px, max 250px, step 5px, default 140px). Height will be calculated with image aspect ratio.

    \n
    4. \n
\n

Ticker

\n

\"password

\n
    \n
  1. Text – the setting allows you to set the text of the ticker;
    2. \n
  2. Hide divider – the setting allows you to hide the divider in the ticker;
    3. \n
  3. Movement speed (desktop) – the setting allows you to set the ticker animation speed on the desktop;
    4. \n
  4. Movement speed (mobile) – the setting allows you to set the ticker animation speed on the mobile.
    5. \n
\n

Popup

\n

\"password

\n
    \n
  1. \n

    Heading – the setting allows you to set the title text of the popup;

    \n
    2. \n
  2. \n

    Input placeholder – the setting allows you to set the placeholder text of the popup input (if not set, it is taken from translations);

    \n
    3. \n
  3. \n

    Button label – the setting allows you to set the label of the popup button (If not set, it is taken from translations).

    \n
    4. \n
\n

Colors

\n

\"colors\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Section background – the setting allows you to set the background color of the section;

    \n
    2. \n
  2. \n

    Section text – the setting allows you to set the color of the section text;

    \n
    3. \n
  3. \n

    Section text (transparent) – the setting allows you to set the color of the section text for the transparent header;

    \n
    4. \n
  4. \n

    Section ticker background – the setting allows you to set the background color of the ticker;

    \n
    5. \n
  5. \n

    Section ticker text – the setting allows you to set the color of the ticker text;

    \n
    6. \n
  6. \n

    Popup text – the setting allows you to set the color of the popup text;

    \n
    7. \n
  7. \n

    Popup background – the setting allows you to set the popup background;

    \n
    8. \n
  8. \n

    Input text – the setting allows you to set the input text color;

    \n
    9. \n
  9. \n

    Input placeholder– the setting allows you to set the input placeholder color;

    \n
    10. \n
  10. \n

    Input border – the setting allows you to set the border color of the popup form input;

    \n
    11. \n
  11. \n

    Text attention – the setting allows you to set the text attention color;

    \n
    12. \n
  12. \n

    Button text — this setting allows you to set the text color of the button;

    \n
    13. \n
  13. \n

    Button background — this setting allows you to set the background color of the button;

    \n
    14. \n
  14. \n

    Button border — this setting allows you to set the border color of the button;

    \n
    15. \n
  15. \n

    Button text (hover) — this setting allows you to set the text color of the button when hovered;

    \n
    16. \n
  16. \n

    Button background (hover) — this setting allows you to set the background color of the button when hovered;

    \n
    17. \n
  17. \n

    Button border (hover) — this setting allows you to set the border color of the button when hovered.

    \n
    18. \n
\n

Additional information

\n
    \n
  1. \n

    The “Enter using password” button opens a popup. The popup contains a login form on the page.

    \n
    2. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n

\n","blockTitle":"Password header","fieldGroupName":"manual_category_blocks","hash":"section-password-header"},{"blockContent":"

Adding a Section

\n

The section is static on a password page layout, it was added initially and cannot be removed.

\n

\"password

\n
\n
Password footer desktop
\n
\n
\n
\n
\n
\n
\n

\"password

\n
\n
Password footer mobile
\n
\n
\n

Section settings

\n

General

\n

\"settings\"

\n
    \n
  1. \n

    Text – the setting allows you to set the text of the section (If not set, it is taken from translations);

    \n
    2. \n
  2. \n

    Login link label – the setting allows you to set the login link label of the section;

    \n
    3. \n
  3. \n

    Login link url – the setting allows you to set the login link url of the section. The default url is ‘/admin’.

    \n
    4. \n
\n

Colors

\n

\"colors\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Text – the setting allows you to set the color of the section text;

    \n
    2. \n
  2. \n

    Background – the setting allows you to set the background color of the section;

    \n
    3. \n
  3. \n

    Top border – the setting allows you to set the top border color of the section.

    \n
    4. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n","blockTitle":"Password footer","fieldGroupName":"manual_category_blocks","hash":"section-password-footer"},{"blockContent":"

\"password

\n

Password content desktop

\n

 

\n

\"password

\n

Password content mobile

\n

 

\n

\"password

\n
\n
Password content with image desktop
\n
\n
\n
\n
\n
\n
\n

\"password

\n
\n
Password content with image mobile
\n
\n

Section settings

\n

General

\n
\n
\"password
\n
\n
    \n
  1. \n

    Heading – setting allows you to set the text of the section title;

    \n
    2. \n
  2. \n

    Text – setting allows you to set the text of the section text;

    \n
    3. \n
  3. \n

    Success message – the setting allows you to set the text when the form is successfully submitted (if not set, it is taken from translations);

    \n
    4. \n
  4. \n

    Show form – the setting allows you to show/hide the form;

    \n
    5. \n
  5. \n

    Input placeholder – the setting allows you to specify the placeholder text of the forms input. (If not set – taken from translations);

    \n
    6. \n
  6. \n

    Button label – the setting allows you to set the text for the aria-label attribute of the button. This attribute allows screen readers to better convey information to people with disabilities;

    \n
    7. \n
  7. \n

    Background image – setting allows you to set the background image;

    \n
    8. \n
  8. \n

    Background image mobile – setting allows you to set the mobile background image.

    \n
    9. \n
\n

Colors

\n

\"password

\n
    \n
  1. \n

    Overlay – the setting allows you to set the section overlay color;

    \n
    2. \n
  2. \n

    Background – the setting allows you to set the section background color;

    \n
    3. \n
  3. \n

    Heading – the setting allows you to set the text color for the heading;

    \n
    4. \n
  4. \n

    Text – the setting allows you to set the text color for the text;

    \n
    5. \n
  5. \n

    Input text – the setting allows you to set the text color for input;

    \n
    6. \n
  6. \n

    Input placeholder– the setting allows you to set the input placeholder color;

    \n
    7. \n
  7. \n

    Input Border – the setting allows you to set the border color for the text input;

    \n
    8. \n
  8. \n

    Text attention – the setting allows you to set the text attention color;

    \n
    9. \n
  9. \n

    Text success – the setting allows you to set the text success color;

    \n
    10. \n
  10. \n

    Button style — the setting allows you to set the style of the button (primary/secondary);

    \n
    11. \n
  11. \n

    Button text — this setting allows you to set the text color of the button;

    \n
    12. \n
  12. \n

    Button background — this setting allows you to set the background color of the button;

    \n
    13. \n
  13. \n

    Button border — this setting allows you to set the border color of the button;

    \n
    14. \n
  14. \n

    Button text (hover) — this setting allows you to set the text color of the button when hovered;

    \n
    15. \n
  15. \n

    Button background (hover) — this setting allows you to set the background color of the button when hovered;

    \n
    16. \n
  16. \n

    Button border (hover) — this setting allows you to set the border color of the button when hovered.

    \n
    17. \n
\n

Layout

\n
\n
\"layout\"
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Desktop offset top — the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom — the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top — the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom — the bottom indent of the section on the mobile;

    \n
    5. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n

\n","blockTitle":"Password content","fieldGroupName":"manual_category_blocks","hash":"section-password-content"},{"blockContent":"

\"cart

\n

Adding section

\n

The section is static, it is added initially and cannot be deleted. The section will be added if the Drawer type is selected in the Cart global settings.

\n

\"how

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

Cart drawer settings

\n

\"settings\"

\n
    \n
  1. \n

    Heading– this setting allows you to set the text of the cart drawer heading;

    \n
    2. \n
  2. \n

    Show items count in the cart – the setting is responsible for displaying the number of products in the cart;

    \n
    3. \n
  3. \n

    View cart label – this setting allows you to set the heading for the “Go to cart” button;

    \n
    4. \n
\n

Upsell settings

\n

\"upsell

\n

\"upsell\"

\n
    \n
  1. \n

    Heading – this setting allows you to set the text of the upsell heading;

    \n
    2. \n
  2. \n

    Products – this setting allows you to select products that will be shown in the upsell tab;

    \n
    3. \n
\n

Blocks settings

\n

Blocks are introduced to provide dynamic content in the cart. Blocks can also be swapped to get different combinations. Usually, this feature is not available in other themes.

\n

\n

Block “Items”

\n

Block limit – 1.

\n

The block is responsible for displaying the products in the cart. The block has no settings.

\n

\n

Block “Benefits”

\n

With this block, you can add some text messages for the customers.

\n

Block limit – 6.

\n

\"benefit\"

\n

\"benefit

\n
    \n
  1. \n

    Text – the setting allows you to set the text content;

    \n
    2. \n
  2. \n

    Icon – the setting allows you to set the image before the text;

    \n
    3. \n
\n

 

\n

Block “Shipping bar”

\n

Block limit – 1.

\n

Block is responsible for displaying the Shipping bar.

\n

\"Shipping

\n

\"Shipping

\n
    \n
  1. \n

    Free shipping amount – the setting allows you to set the amount of US money that the user must spend to fill the bar;

    \n
    2. \n
  2. \n

    Shipping message – the setting allows you to set the text of the message that the user sees when the bar is not filled;

    \n
    3. \n
  3. \n

    Shipping congratulatory message – the setting allows you to customize the text of the message that the user sees when the bar is full;

    \n
    4. \n
  4. \n

    Congratulatory icon – the setting allows you to set the image in the congratulatory message;

    \n
    5. \n
\n

\"colors\"

\n
    \n
  1. \n

    Progress bar background color – the setting allows you to set the background color for the progress bar;

    \n
    2. \n
  2. \n

    Progress bar fill color – the setting allows you to set the fill color for the progress bar;

    \n
    3. \n
\n

\n","blockTitle":"Cart drawer ","fieldGroupName":"manual_category_blocks","hash":"section-cart-drawer"},{"blockContent":"

Adding a Section

\n

\"how

\n

The section is static on a Product page template, it was added initially and cannot be removed.

\n

Section settings

\n

General

\n

\"general\"

\n
    \n
  1. \n

    Heading – this setting is responsible for the heading;

    \n
    2. \n
  2. \n

    Products to show – the setting allows you to choose how many recently viewed products can be displayed in the section;

    \n
    3. \n
  3. \n

    Layout – the setting allows you to choose the layout of the grid(3/4 products per row);

    \n
    4. \n
  4. \n

    Show arrows – the setting allows you to show the slider arrows.

    \n
    5. \n
\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Make full width – If disabled – container width will be set based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n","blockTitle":"Recently viewed","fieldGroupName":"manual_category_blocks","hash":"section-recently-viewed"},{"blockContent":"

\"cart

\n

Adding a Section

\n

\n

The section is static on a cart page template, it was added initially and cannot be removed.

\n

\"how

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

Cart settings

\n

\"cart

\n
    \n
  1. \n

    Heading– this setting allows you to set the text of the cart drawer heading;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

 

\n

Blocks settings

\n

Blocks are introduced to provide dynamic content in the cart. Blocks can also be swapped to get different combinations. Usually, this feature is not available in other themes.

\n

\n

Block “Benefits”

\n

With this block, you can add text messages for customers.

\n

Block limit – 6.

\n

\"benefits\"

\n

\"benefit

\n
    \n
  1. \n

    Text – the setting allows you to set the text content;

    \n
    2. \n
  2. \n

    Icon – the setting allows you to set the image before the text;

    \n
    3. \n
\n

Block “Shipping bar”

\n

Block limit – 1.

\n

Block is responsible for displaying the Shipping bar.

\n

\"shipping

\n

\"settings\"

\n
    \n
  1. \n

    Free shipping amount – the setting allows you to set the amount of US money that the user must spend to fill the bar;

    \n
    2. \n
  2. \n

    Shipping message – the setting allows you to set the text of the message that the user sees when the bar is not filled;

    \n
    3. \n
  3. \n

    Shipping congratulatory message – the setting allows you to customize the text of the message that the user sees when the bar is full;

    \n
    4. \n
  4. \n

    Congratulatory icon – the setting allows you to set the image in the congratulatory message;

    \n
    5. \n
\n

\"colors\"

\n
    \n
  1. \n

    Progress bar background color – the setting allows you to set the background color for the progress bar;

    \n
    2. \n
  2. \n

    Progress bar fill color – the setting allows you to set the fill color for the progress bar;

    \n
    3. \n
\n

Block “Custom liquid”

\n

\"block

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Custom liquid – setting allows you to add your own liquid code.

    \n
    2. \n
\n

You can learn more about liquid here – https://shopify.dev/api/liquid.

\n

Block “@app”

\n

Only one block type is available for a section – @app. This block is for apps that need to be integrated into the shopping cart.

\n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n

\n

\n

\n","blockTitle":"Cart template","fieldGroupName":"manual_category_blocks","hash":"section-cart-template"},{"blockContent":"
\n

In this section, you can view articles on the blogs.

\n

Adding a Section

\n

\"add

\n

The section is static on a blog page template, it was added initially and cannot be removed.

\n

Section settings

\n

General

\n
\n
\"general
\n
\n
    \n
  1. \n

    Paginate by – the setting allows you to select the number of articles per page. The minimum number is 8, the maximum number is 50;

    \n
    2. \n
  2. \n

    Pagination type – the setting allows you to select the type of pagination;

    \n
    3. \n
  3. \n

    Load more button type – the setting is responsible for the style of the load more button;

    \n
    4. \n
  4. \n

    Show filter by tag – the setting is responsible for displaying the filter by tag.

    \n
    5. \n
\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when the setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Container width – a container width of the section. If “Inherit” value is selected then the container width is based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n","blockTitle":"Blog template","fieldGroupName":"manual_category_blocks","hash":"section-blog-template"},{"blockContent":"
\n

Adding a Section

\n

\"how

\n

The section is static on a Product page template, it was added initially and cannot be removed.

\n

Section settings

\n

General

\n

\"settings\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – setting allows you to select a color scheme for the section;

    \n
    3. \n
  3. \n

    Heading – setting allows you to set the heading text of the section;

    \n
    4. \n
  4. \n

    Products to show – setting allows you to specify the number of products to display, with an option to choose between 4 and 12 products;

    \n
    5. \n
  5. \n

    Use Shopify recommendations – setting allows you to use Shopify’s recommended products for display;

    \n
    6. \n
  6. \n

    Resource collection – setting allows you to manually select the collection to display.

    \n
    7. \n
\n

Layout

\n

\"layout

\n
    \n
  1. \n

    Container width – section container settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n","blockTitle":"Product recommendations","fieldGroupName":"manual_category_blocks","hash":"section-product-recommendations"},{"blockContent":"

\"section

\n

\"banner

\n

Adding a Section

\n

The section is static on the collection page template, it was added initially and cannot be removed.

\n

Section settings

\n

General

\n

\"collection-banner-general\"

\n
    \n
  1. \n

    Show breadcrumbs – the setting is responsible for displaying breadcrumbs. If this setting is enabled, the default breadcrumbs are hidden;

    \n
    2. \n
  2. \n

    Show collection description – the setting is responsible for displaying the description;

    \n
    3. \n
  3. \n

    Collection custom image – the setting is responsible for adding a custom image. You can add alternate image with metafields (use dynamic source for this).

    \n
    4. \n
\n

 

\n

Colors

\n

\"collection-banner-colors\"

\n
    \n
  1. \n

    Banner overlay – the setting is responsible for selecting an overlay color;

    \n
    2. \n
  2. \n

    Banner text – setting is responsible for selecting the text color for elements.

    \n
    3. \n
\n

 

\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Desktop offset top — the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom — the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top — the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom — the bottom indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    6. \n
  6. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    8. \n
  8. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    9. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n","blockTitle":"Collection banner","fieldGroupName":"manual_category_blocks","hash":"section-collection-banner"},{"blockContent":"
\n

Collection template with top bar

\n

 

\n
\n

Collection template with sidebar

\n

 

\n

Adding a Section

\n

The section is static on the collection page template, it was added initially and cannot be removed.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – the setting allows you to select a color scheme.

    \n
    3. \n
\n

Grid

\n

\"collection

\n
    \n
  1. \n

    Filters type – setting allows choosing the view of filters: “Top bar” or “Sidebar”. Setting works only for desktop resolution. On the mobile filters will be always in the “Drawer” view;

    \n
    2. \n
\n
\n

Top bar:

\n

\"top

\n

Sidebar:

\n

\"sidebar\"

\n

Drawer:

\n

\"filters\"

\n
    \n
  1. \n

    Show grid buttons – the setting is responsible for showing buttons that allow customers to change product grid view (3 or 4 on the desktop, 2 or 3 on the tablet, 1 or 2 on the mobile);

    \n
    2. \n
  2. \n

    Show color swatches in filters – the setting is responsible for enabling the display of swatches in filters. Native and custom swatches are supported;

    \n
    3. \n
\n
\n

Enabled:

\n

\"colors\"

\n

Disabled:

\n

\"colors

\n
    \n
  1. \n

    Paginate by – the setting displays a certain number of cards per page. The minimum number is 12, the maximum number is 50;

    \n
    2. \n
  2. \n

    Pagination type – the setting is responsible for the type of loading of cards. Can be “Pagination”, “Load more”, or “Infinity scrolling”.

    \n
    3. \n
  3. \n

    Load more button style – choose the style of the button with this setting.

    \n
    4. \n
\n

Layout

\n
\n
\"layout\"
\n
\n
    \n
  1. \n

    Container width – section container settings. If the “Inherit” value is selected then the container width is based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top — the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom — the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top — the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom — the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

Block settings

\n

Sidebar banner

\n

Limit: 3. The block is displayed only with the filter type – ‘Sidebar’.

\n

\"sidebar

\n

General

\n

\"General

\n
    \n
  1. \n

    Image – the setting is responsible for the image;

    \n
    2. \n
  2. \n

    Heading – the setting is responsible for heading;

    \n
    3. \n
  3. \n

    Link label – the setting is responsible for link label;

    \n
    4. \n
  4. \n

    Link url – the setting is responsible for link url;

    \n
    5. \n
  5. \n

    Open link in new tab the setting is responsible for enabling the external link;

    \n
    6. \n
\n

Grid banner

\n

Limit: 1.

\n

\"grid

\n
\n

General

\n

\"grid

\n
    \n
  1. \n

    Image – the setting is responsible for the image;

    \n
    2. \n
  2. \n

    Heading – the setting is responsible for heading;

    \n
    3. \n
  3. \n

    Link label – the setting is responsible for link label;

    \n
    4. \n
  4. \n

    Link url – the setting is responsible for link url;

    \n
    5. \n
  5. \n

    Open link in new tab – the setting is responsible for enabling the external link;

    \n
    6. \n
  6. \n

    Banner position – the setting is responsible for the position of the banner in the grid. If the position of an element is greater than paginate by, or the number of elements on the page is less than paginate by, then it is output as the last element.

    \n
    7. \n
\n

Additional information

\n
    \n
  1. \n

    Shopify Filtering Tutorial: Add storefront filtering

    \n
    2. \n
  2. \n

    Native swatches: Adding filters with Shopify Search & Discovery

    \n
    3. \n
  3. \n

    Custom swatches: color swatches depend on the color option. The filter group name specified in the Theme settings / Color swatches / Swatch option will show a checkbox like color swatch. The name of the color is split, and the last word is taken and substituted into the CSS palette. There is a chance that this color will not be in the CSS palette, then it will just be a white swatch. In this case, you must add an image to Shopify files of 50*50 px size in .png format with swatch- prefix. For example, the image name for banana-yellow would be swatch-banana-yellow.png;

    \n
    4. \n
\n
\n
\n
\n","blockTitle":"Collection template","fieldGroupName":"manual_category_blocks","hash":"section-collection-template"},{"blockContent":"

\"search

\n

Unperformed search

\n

 

\n

\"search

\n
\n
Unperformed mobile search
\n
\n
\n
\n
\n
\n
\n

\"search

\n

Empty search

\n

 

\n

\"search

\n

Empty mobile search

\n

 

\n
\n

Search products with the top bar

\n
\n
\n
Search products with the sidebar
\n
\n
\n
\n
\n
\n\n
\n
\n
\n

Search products mobile

\n

 

\n
\n

Search

\n

 

\n
\n

Search mobile

\n

 

\n

Adding a Section

\n

The section is static on the search page template, it was added initially and cannot be removed.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – the setting allows you to select a color scheme.

    \n
    3. \n
\n

Grid

\n

\"collection

\n
    \n
  1. \n

    Heading – the setting allows to set the heading. If the search is performed, a colon and search query will be added after the header;

    \n
    2. \n
  2. \n

    Filters type – setting allows choosing the view of filters: “Top bar” or “Sidebar”. Setting works only for desktop resolution. On the mobile filters will be always in the “Drawer” view;

    \n
    3. \n
\n
\n

Top bar:

\n

\"collection

\n

Sidebar:

\n

\"collection

\n

Drawer:

\n

\"collection

\n
    \n
  1. \n

    Show color swatches in filters – the setting is responsible for enabling the display of swatches in filters. Native and custom swatches are supported;

    \n
    2. \n
\n
\n

Enabled:

\n

\"colors\"

\n

Disabled:

\n

\"colors

\n
    \n
  1. \n

    Paginate by – the setting allows to specify the number of results in the search sidebar. The minimum number is 12, the maximum number is 50;

    \n
    2. \n
  2. \n

    Pagination type – the setting is responsible for the type of loading. Can be “Pagination”, “Load more”, or “Infinity scrolling”.

    \n
    3. \n
  3. \n

    Load more button style – choose the style of the button with this setting.

    \n
    4. \n
\n

 

\n

Layout

\n

\"search

\n
\n
    \n
  1. \n

    Container width – section container settings. If the “Inherit” value is selected then the container width is based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top — the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom — the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top — the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom — the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

Settings

\n

In Theme settings / Predictive search it is possible to select the type of search.

\n

\"search

\n
\n
    \n
  1. \n

    Enable search by articles – setting allows to include articles in the search;

    \n
    2. \n
  2. \n

    Enable search by pages – setting allows to include pages in the search.

    \n
    3. \n
\n

 

\n

Additional information

\n
    \n
  1. \n

    Shopify Filtering Tutorial: Add storefront filtering

    \n
    2. \n
  2. \n

    Native swatches: Adding filters with Shopify Search & Discovery

    \n
    3. \n
  3. \n

    Custom swatches: color swatches depend on the color option. The filter group name specified in the Theme settings / Color swatches / Swatch option will show a checkbox like color swatch. The name of the color is split, and the last word is taken and substituted into the CSS palette. There is a chance that this color will not be in the CSS palette, then it will just be a white swatch. In this case, you must add an image to Shopify files of 50*50 px size in .png format with swatch- prefix. For example, the image name for banana-yellow would be swatch-banana-yellow.png;

    \n
    4. \n
\n","blockTitle":"Search template","fieldGroupName":"manual_category_blocks","hash":"section-search-template"},{"blockContent":"

\"login\"

\n

\"reset

\n

For Customers

\n

Adding a Section

\n

\"how

\n

The section is static on a Login page template, it was added initially and cannot be removed.

\n

 

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

 

\n

General

\n

\"general\"

\n
    \n
  1. \n

    Text – the setting allows you to set text content;

    \n
    2. \n
  2. \n

    Enable media – the setting allows you to enable image layout with animations.

    \n
    3. \n
\n

 

\n

First column images

\n

\"first

\n
    \n
  1. \n

    Movement speed – the setting allows you to set an animation speed for the images;

    \n
    2. \n
  2. \n

    First image – the setting allows you to select the first image;

    \n
    3. \n
  3. \n

    Second image – the setting allows you to select the second image;

    \n
    4. \n
  4. \n

    Third image – the setting allows you to select the third image.

    \n
    5. \n
\n

 

\n

Second column images

\n

\"second

\n
    \n
  1. \n

    Movement speed – the setting allows you to set an animation speed for the images;

    \n
    2. \n
  2. \n

    First image – the setting allows you to select the first image;

    \n
    3. \n
  3. \n

    Second image – the setting allows you to select the second image;

    \n
    4. \n
  4. \n

    Third image – the setting allows you to select the third image.

    \n
    5. \n
\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Desktop offset top — the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom — the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top — the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom — the bottom indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    6. \n
  6. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    8. \n
  8. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    9. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n","blockTitle":"Login template","fieldGroupName":"manual_category_blocks","hash":"section-login-template"},{"blockContent":"

\"section

\n

Adding a Section

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Product banner.

\n

Section settings

\n

The maximum amount of blocks that can be displayed – 4.

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Container width – section container settings.

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    6. \n
\n

Block settings

\n

\"block

\n
    \n
  1. \n

    Label – the setting allows you to specify the label of the block;

    \n
    2. \n
  2. \n

    Heading – the setting allows you to specify the heading of the block;

    \n
    3. \n
  3. \n

    Text – the setting allows you to specify the text of the block;

    \n
    4. \n
  4. \n

    Button label – the setting allows you to specify the label content of the button;

    \n
    5. \n
  5. \n

    Button link – the setting allows you to specify the url field for the button;

    \n
    6. \n
  6. \n

    Button style – the setting allows you to specify a style for the button;

    \n
    7. \n
  7. \n

    Product – setting allows you to set the product;

    \n
    8. \n
  8. \n

    Image – the setting allows you to select the image.

    \n
    9. \n
\n","blockTitle":"Product banner","fieldGroupName":"manual_category_blocks","hash":"section-product-banner"},{"blockContent":"

\"create

\n

For Customers

\n

Adding a Section

\n

\"how

\n

The section is static on a Register page template, it was added initially and cannot be removed.

\n

 

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

 

\n

General

\n

\"general\"

\n
    \n
  1. \n

    Text – the setting allows you to set text content;

    \n
    2. \n
  2. \n

    Enable media – the setting allows you to enable image layout with animations.

    \n
    3. \n
\n

 

\n

First column images

\n

\"first

\n
    \n
  1. \n

    Movement speed – the setting allows you to set an animation speed for the images;

    \n
    2. \n
  2. \n

    First image – the setting allows you to select the first image;

    \n
    3. \n
  3. \n

    Second image – the setting allows you to select the second image;

    \n
    4. \n
  4. \n

    Third image – the setting allows you to select the third image.

    \n
    5. \n
\n

 

\n

Second column images

\n

\"second

\n
    \n
  1. \n

    Movement speed – the setting allows you to set an animation speed for the images;

    \n
    2. \n
  2. \n

    First image – the setting allows you to select the first image;

    \n
    3. \n
  3. \n

    Second image – the setting allows you to select the second image;

    \n
    4. \n
  4. \n

    Third image – the setting allows you to select the third image.

    \n
    5. \n
\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Desktop offset top — the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom — the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top — the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom — the bottom indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    6. \n
  6. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    8. \n
  8. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    9. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n

\n","blockTitle":"Register template","fieldGroupName":"manual_category_blocks","hash":"section-register-template"},{"blockContent":"

\"account\"

\n

\"account

\n

For Customers

\n

Adding a Section

\n

\"account

\n

The section is static on an Account page template, it was added initially and cannot be removed.

\n

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

 

\n

General

\n

\"general

\n
    \n
  1. \n

    Continue shopping link url – the setting allows you to set url for the button;

    \n
    2. \n
  2. \n

    Continue shopping link text – the setting allows you to text content for the button.

    \n
    3. \n
\n

First column images

\n

\"first

\n
    \n
  1. \n

    Movement speed – the setting allows you to set an animation speed for the images;

    \n
    2. \n
  2. \n

    First image – the setting allows you to select the first image;

    \n
    3. \n
  3. \n

    Second image – the setting allows you to select the second image;

    \n
    4. \n
  4. \n

    Third image – the setting allows you to select the third image.

    \n
    5. \n
\n

 

\n

Second column images

\n

\"second

\n
    \n
  1. \n

    Movement speed – the setting allows you to set an animation speed for the images;

    \n
    2. \n
  2. \n

    First image – the setting allows you to select the first image;

    \n
    3. \n
  3. \n

    Second image – the setting allows you to select the second image;

    \n
    4. \n
  4. \n

    Third image – the setting allows you to select the third image.

    \n
    5. \n
\n

 

\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Desktop offset top — the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom — the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top — the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom — the bottom indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    6. \n
  6. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    8. \n
  8. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    9. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n

\n","blockTitle":"Account template","fieldGroupName":"manual_category_blocks","hash":"section-account-template"},{"blockContent":"

\"reset\"

\n

For Customers

\n

Adding a Section

\n

\"how

\n

The section is static on a Reset page template, it was added initially and cannot be removed.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Desktop offset top — the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom — the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top — the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom — the bottom indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    6. \n
  6. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    8. \n
  8. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    9. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n

\n","blockTitle":"Reset template","fieldGroupName":"manual_category_blocks","hash":"section-reset-template"},{"blockContent":"

\"Activate

\n

For Customers

\n

Adding a Section

\n

\"how

\n

The section is static on an Activate account page template, it was added initially and cannot be removed.

\n

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Desktop offset top — the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom — the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top — the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom — the bottom indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    6. \n
  6. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    8. \n
  8. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    9. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n","blockTitle":"Activate template","fieldGroupName":"manual_category_blocks","hash":"section-activate-template"},{"blockContent":"

\"account

\n

For Customers

\n

Adding a Section

\n

\"how

\n

The section is static on an Order page template, it was added initially and cannot be removed.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Desktop offset top — the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom — the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top — the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom — the bottom indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    6. \n
  6. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    8. \n
  8. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    9. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n

\n","blockTitle":"Order template","fieldGroupName":"manual_category_blocks","hash":"section-order-template"},{"blockContent":"

\"Addresses

\n

For Customers

\n

Adding a Section

\n

\"how

\n

The section is static on an Addresses page template, it was added initially and cannot be removed.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – this setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Desktop offset top — the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom — the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top — the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom — the bottom indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    6. \n
  6. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    8. \n
  8. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    9. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n

\n","blockTitle":"Addresses template","fieldGroupName":"manual_category_blocks","hash":"section-addresses-template"},{"blockContent":"
\n

In this section you can view an article page.

\n

Adding a Section

\n

\"how

\n

The section is static on a blog post template, it was added initially and cannot be removed.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when the setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – The setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

 

\n

Sidebar

\n

\"sidebar\"

\n
    \n
  1. \n

    Heading – setting allows you to define the title text for the section;

    \n
    2. \n
  2. \n

    First article … Fourth article – settings allow you to specify articles, from the first to the fourth, to display in the sidebar;

    \n
    3. \n
\n

 

\n

Products from article

\n

\"Products

\n

 

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Container width – a container width of the section. If “Inherit” value is selected then the container width is based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

\n

\n

\n","blockTitle":"Article main","fieldGroupName":"manual_category_blocks","hash":"section-article-main"},{"blockContent":"

\"Gift

\n

Adding a Section

\n

\"Gift

\n

The section is static on a Gift cart page layout, it was added initially and cannot be removed. It is not possible to add other sections on this page.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when the setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – setting allows you to select a color scheme for the section.

    \n
    3. \n
\n

 

\n

General

\n

\"General\"

\n
    \n
  1. \n

    Heading – setting allows you to define the title text for the section;

    \n
    2. \n
  2. \n

    Logo – the setting allows you to specify a logo, otherwise, the name of the store will be displayed;

    \n
    3. \n
  3. \n

    Logo width – setting allows you to specify the size of the logo;

    \n
    4. \n
  4. \n

    Gift card default image – used for the default gift card image. The image for the Gift will be obtained from the product, which means you can assign images to different card options. If the product variant does not have an image or it is a test gift card, the default image is displayed. If the default image is not set to complete, then the image is not displayed.

    \n
    5. \n
  5. \n

    Start shopping button type – the setting allows you to set the style of the “Start shipping” button;

    \n
    6. \n
  6. \n

    Print button type – the setting allows you to set the style of the “Print” button.

    \n
    7. \n
\n

Layout

\n

\"Layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    6. \n
  6. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    8. \n
  8. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    9. \n
\n

\n

\n

\n","blockTitle":"Gift card","fieldGroupName":"manual_category_blocks","hash":"section-gift-card"},{"blockContent":"
\n

For Customers

\n

Adding a section

\n

\"product

\n

The section is static on the product template, it was added initially and cannot be removed.

\n

Section settings

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – the setting allows you to choose a scheme;

    \n
    3. \n
\n

 

\n

Media

\n

\"prod

\n
    \n
  1. \n

    Enable zoom – the setting allows you to enable the Zoom function that appears when you click on the image;

    \n
    2. \n
  2. \n

    Media height – the setting allows you to select the size of the image. Has several options: full size, square;

    \n
    3. \n
  3. \n

    Image object fit – the setting allows you to control how an image is resized to fit its container. Has several options: cover, contain.

    \n
    4. \n
\n

\n

General

\n

\"gen

\n
    \n
  1. \n

    Show message of taxes included – the setting allows you to control the visibility of the corresponding message if taxes are included in the price of the product in the store;

    \n
    2. \n
  2. \n

    Show pay installments – the setting allows you to control the visibility of the installment block if the store has the right to sell by installments and this feature is enabled in the store settings;

    \n
    3. \n
  3. \n

    Enable sticky add to cart – the settings allow you to show a sticky add-to-cart at the bottom of the page when the main add-to-cart isn’t visible.

    \n
    4. \n
\n

\n

Size guide

\n

\"size

\n
    \n
  1. \n

    Show size guide – the setting allows you to show/hide the size guide toggler for drawer opening;

    \n
    2. \n
  2. \n

    Button placement – the setting allows you to choose the size guide toggler placement. Has several options: Under product options, Drawer;

    \n
    3. \n
  3. \n

    Page – the setting allows you to choose the page of the size guide content, it will be displayed inside the drawer;

    \n
    4. \n
  4. \n

    Button label – the setting allows you to set the size guide toggler label;

    \n
    5. \n
  5. \n

    Button icon – the setting allows you to set the size guide toggler icon;

    \n
    6. \n
  6. \n

    Drawer heading – the setting allows you to set the size guide drawer heading.

    \n
    7. \n
\n

\n

Layout

\n

\"layout

\n
    \n
  1. \n

    Container width – a container width of the section. If “Inherit” value is selected then the container width is based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

\n

Blocks settings

\n

Block Breadcrumbs

\n

\"breadcrumbs\"

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

\n

Block Vendor

\n

General

\n

\"vendor\"

\n
    \n
  1. \n

    Make vendor link to collection – the setting allows you to set the vendor as a link.

    \n
    2. \n
\n

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

\n

Block Title

\n

\"product

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

\n

Block SKU

\n

\"sku

\n

General

\n

\"sku

\n
    \n
  1. \n

    SKU text – the settings allow you to set your text for the SKU and insert a variable into it. For example: “Art: %SKU%” will always output “Art: ” before the value.

    \n
    2. \n
\n

\n

Layout

\n
\n
\"layout\"
\n
\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

Block Description

\n

\"description\"

\n

 

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Options

\n
\n

\"options\"

\n

\"options

\n

\n

General

\n

\"option\"

\n
    \n
  1. \n

    Variant picker – the setting allows you to select a view of variant options type. Has several options: Buttons, Dropdown.
    \nNote: if you have enabled a color swatch option, then the option related to the color swatch will always be like a button.

    \n
    2. \n
\n

 

\n

If one of the options is named “Color” or “Colour“, then it will be processed as a color. She will have a circle with a color on the left, which will be filled in this way:

\n\n

 

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

\n

Block Quantity

\n
\n
\"quantity\"
\n
\n

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Inventory status

\n

\"in

\n
\n

With this block, you can show message about product variant inventory status.

\n

You can help customers detect which product variant has a low/high stock inventory.

\n

If a variant is not available – the block will be hidden.

\n

Layout

\n
\n
\"layout\"
\n
\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Price

\n

\"price\"

\n

Also outputs the unit cost if the product has a unit cost instead of a quantity cost.

\n
    \n
  • \n

    Can be displayed a message stating that taxes are included in the price;

    \n
    • \n
  • \n

    Can be displayed installment purchase form.

    \n
    • \n
\n

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Add to cart

\n
\n

\"add

\n

\n

General

\n

\"settings\"

\n
    \n
  1. \n

    Button style – the setting allows you to set ‘Add-to-cart’ button style;

    \n
    2. \n
  2. \n

    Button ‘Buy it now' style – the setting allows you to set ‘Buy-it-now’ button style;

    \n
    3. \n
  3. \n

    Show additional payment buttons – the setting allows you to show “Buy it now” buttons;

    \n
    4. \n
  4. \n

    Show recipient information form for gift cards – the setting allows you to send gift cards on a scheduled date along with a personal message (works only on a gift product).

    \n
    5. \n
\n

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

\n

Block Text

\n
\n

\"block

\n

\n

General

\n

\"text\"

\n
    \n
  1. \n

    Text – the setting allows you to set the custom text.

    \n
    2. \n
\n

 

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

\n

Block Pickup availability

\n
\n

\"Block

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Drawers

\n

\"Block

\n
\n

Displays up to 4 additional buttons with a drawer:

\n\n

 

\n

Description

\n

\"gen

\n
    \n
  1. \n

    Show description – the setting allows you to show the product description toggler button;

    \n
    2. \n
  2. \n

    Button label – the setting allows you to set the toggler button label;

    \n
    3. \n
  3. \n

    Drawer heading – the setting allows you to set the drawer heading.

    \n
    4. \n
\n

 

\n

Custom drawer 1..3

\n

\"custom

\n
\n
\n
    \n
  1. \n

    Page – the setting allows you to set the custom page for drawer content;

    \n
    2. \n
  2. \n

    Button label – the setting allows you to set the toggler button label;

    \n
    3. \n
  3. \n

    Drawer heading – the setting allows you to set the drawer heading.

    \n
    4. \n
\n

 

\n
\n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Complementary product

\n
\n
\"complem
\n
\n

To select complementary products, add the Search & Discovery app (Shopify app). Learn more

\n

General

\n

\"name

\n
    \n
  1. \n

    Heading – the setting allows you to set the heading for the block.

    \n
    2. \n
\n

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

\n

Block Sales point

\n
\n
\"sales
\n
\n

You can add a simple text block with an icon.

\n

General

\n

\"settings\"

\n
    \n
  1. \n

    Icon image – setting allows you to set an icon for the text;

    \n
    2. \n
  2. \n

    Text – setting allows you to set the text.

    \n
    3. \n
\n

 

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Socials

\n

\"socoals

\n

General

\n

\"set

\n
    \n
  1. \n

    Show Facebook – setting allows you to show Facebook social;

    \n
    2. \n
  2. \n

    Show X (Twitter) – setting allows you to show X (Twitter) social;

    \n
    3. \n
  3. \n

    Show Pinterest – setting allows you to show Pinterest social.

    \n
    4. \n
\n

 

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block @app

\n

\"add

\n
\n
\n

The block allows you to connect applications, such as Reviews, etc.

\n

\n

Block Custom liquid

\n

You can learn more about liquid here – Liquid reference.

\n

General

\n

\"settings

\n
    \n
  1. \n

    Custom liquid – setting allows you to add your liquid code.

    \n
    2. \n
\n

 

\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n","blockTitle":"Product template","fieldGroupName":"manual_category_blocks","hash":"section-product-template"},{"blockContent":"
\n

For Customers

\n

Adding a section

\n

\"add

\n

In order to add a section, you need to go to Customizer → Add Section → Featured product.

\n

Section settings

\n

\"chose

\n
    \n
  1. \n

    Product – the setting allows you to set the product.

    \n
    2. \n
\n

 

\n

Media

\n

\"prod

\n
    \n
  1. \n

    Enable zoom – the setting allows you to enable the Zoom function that appears when you click on the image;

    \n
    2. \n
  2. \n

    Media height – the setting allows you to select the size of the image. Has several options: full size, square;

    \n
    3. \n
  3. \n

    Image object fit – the setting allows you to control how an image is resized to fit its container. Has several options: cover, contain.

    \n
    4. \n
\n

\n

General

\n

\"gen

\n
    \n
  1. \n

    Show message of taxes included – the setting allows you to control the visibility of the corresponding message if taxes are included in the price of the product in the store;

    \n
    2. \n
  2. \n

    Show pay installments – the setting allows you to control the visibility of the installment block if the store has the right to sell by installments and this feature is enabled in the store settings;

    \n
    3. \n
  3. \n

    Enable sticky add to cart – the settings allow you to show a sticky add-to-cart at the bottom of the page when the main add-to-cart isn’t visible.

    \n
    4. \n
\n

\n

Size guide

\n

\"size

\n
    \n
  1. \n

    Show size guide – the setting allows you to show/hide the size guide toggler for drawer opening;

    \n
    2. \n
  2. \n

    Button placement – the setting allows you to choose the size guide toggler placement. Has several options: Under product options, Drawer;

    \n
    3. \n
  3. \n

    Page – the setting allows you to choose the page of the size guide content, it will be displayed inside the drawer;

    \n
    4. \n
  4. \n

    Button label – the setting allows you to set the size guide toggler label;

    \n
    5. \n
  5. \n

    Button icon – the setting allows you to set the size guide toggler icon;

    \n
    6. \n
  6. \n

    Drawer heading – the setting allows you to set the size guide drawer heading.

    \n
    7. \n
\n

 

\n

Colors

\n

\"colors\"

\n
    \n
  1. \n

    Enable color scheme inheritance – when this setting is enabled, the color scheme is inherited from the theme settings;

    \n
    2. \n
  2. \n

    Color scheme – the setting allows you to choose a scheme;

    \n
    3. \n
\n

\n

Layout

\n

\"layout

\n
    \n
  1. \n

    Container width – a container width of the section. If “Inherit” value is selected then the container width is based on the group ‘Layout’ settings in the Theme settings;

    \n
    2. \n
  2. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    4. \n
  4. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    5. \n
  5. \n

    Mobile offset bottom – the bottom indent of the section on the mobile;

    \n
    6. \n
  6. \n

    Inner desktop offset top – the top indent of the inner container on the desktop;

    \n
    7. \n
  7. \n

    Inner desktop offset bottom – the bottom indent of the inner container on the desktop;

    \n
    8. \n
  8. \n

    Inner mobile offset top – the top indent of the inner container on the mobile;

    \n
    9. \n
  9. \n

    Inner mobile offset bottom – the bottom indent of the inner container on the mobile.

    \n
    10. \n
\n

\n

Blocks settings

\n

Block Vendor

\n

General

\n

\"vendor\"

\n
    \n
  1. \n

    Make vendor link to collection – the setting allows you to set the vendor as a link.

    \n
    2. \n
\n

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

\n

Block Title

\n

\"product

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

\n

Block SKU

\n

\"sku

\n

General

\n

\"sku

\n
    \n
  1. \n

    SKU text – the settings allow you to set your text for the SKU and insert a variable into it. For example: “Art: %SKU%” will always output “Art: ” before the value.

    \n
    2. \n
\n

\n

Layout

\n
\n
\"layout\"
\n
\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Description

\n

\"description\"

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Options

\n
\n

\"options\"

\n

\"options

\n

General

\n

\"option\"

\n
    \n
  1. \n

    Variant picker – the setting allows you to select a view of variant options type. Has several options: Buttons, Dropdown.
    \nNote: if you have enabled a color swatch option, then the option related to the color swatch will always be like a button.

    \n
    2. \n
\n

 

\n

If one of the options is named “Color” or “Colour“, then it will be processed as a color. She will have a circle with a color on the left, which will be filled in this way:

\n\n

 

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

\n

Block Quantity

\n
\n
\"quantity\"
\n
\n

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Inventory status

\n

\"in

\n
\n

With this block, you can show message about product variant inventory status.

\n

You can help customers detect which product variant has a low/high stock inventory.

\n

If a variant is not available – the block will be hidden.

\n

Layout

\n
\n
\"layout\"
\n
\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Price

\n

\"price\"

\n

Also outputs the unit cost if the product has a unit cost instead of a quantity cost.

\n
    \n
  • \n

    Can be displayed a message stating that taxes are included in the price;

    \n
    • \n
  • \n

    Can be displayed installment purchase form.

    \n
    • \n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Add to cart

\n
\n

\"add

\n

\n

General

\n

\"settings\"

\n
    \n
  1. \n

    Button style – the setting allows you to set ‘Add-to-cart’ button style;

    \n
    2. \n
  2. \n

    Button ‘Buy it now' style – the setting allows you to set ‘Buy-it-now’ button style;

    \n
    3. \n
  3. \n

    Show additional payment buttons – the setting allows you to show “Buy it now” buttons;

    \n
    4. \n
  4. \n

    Show recipient information form for gift cards – the setting allows you to send gift cards on a scheduled date along with a personal message (works only on a gift product).

    \n
    5. \n
\n

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

\n

Block Text

\n
\n

\"block

\n

\n

General

\n

\"text\"

\n
    \n
  1. \n

    Text – the setting allows you to set the custom text.

    \n
    2. \n
\n

 

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Pickup availability

\n
\n

\"Block

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Drawers

\n

\"Block

\n
\n

Displays up to 4 additional buttons with a drawer:

\n\n

 

\n

Description

\n

\"gen

\n
    \n
  1. \n

    Show description – the setting allows you to show the product description toggler button;

    \n
    2. \n
  2. \n

    Button label – the setting allows you to set the toggler button label;

    \n
    3. \n
  3. \n

    Drawer heading – the setting allows you to set the drawer heading.

    \n
    4. \n
\n

 

\n

Custom drawer 1..3

\n

\"custom

\n
\n
\n
    \n
  1. \n

    Page – the setting allows you to set the custom page for drawer content;

    \n
    2. \n
  2. \n

    Button label – the setting allows you to set the toggler button label;

    \n
    3. \n
  3. \n

    Drawer heading – the setting allows you to set the drawer heading.

    \n
    4. \n
\n

 

\n
\n
\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Complementary product

\n
\n
\"complem
\n
\n

To select complementary products, add the Search & Discovery app (Shopify app). Learn more

\n

General

\n

\"name

\n
    \n
  1. \n

    Heading – the setting allows you to set the heading for the block.

    \n
    2. \n
\n

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

\n

Block Sales point

\n
\n
\"sales
\n
\n

You can add a simple text block with an icon.

\n

General

\n

\"settings\"

\n
    \n
  1. \n

    Icon image – setting allows you to set an icon for the text;

    \n
    2. \n
  2. \n

    Text – setting allows you to set the text.

    \n
    3. \n
\n

 

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block Socials

\n

\"socoals

\n

General

\n

\"set

\n
    \n
  1. \n

    Show Facebook – setting allows you to show Facebook social;

    \n
    2. \n
  2. \n

    Show X (Twitter) – setting allows you to show X (Twitter) social;

    \n
    3. \n
  3. \n

    Show Pinterest – setting allows you to show Pinterest social.

    \n
    4. \n
\n

 

\n

Layout

\n

\"layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

 

\n

Block @app

\n

\"add

\n
\n
\n

The block allows you to connect applications, such as Reviews, etc.

\n

\n

Block Custom liquid

\n

You can learn more about liquid here – Liquid reference.

\n

General

\n

\"settings

\n
    \n
  1. \n

    Custom liquid – setting allows you to add your liquid code.

    \n
    2. \n
\n

 

\n

Layout

\n

\"layout\"

\n
\n
\n
\n
\n
\n
\n
\n
\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n

\n","blockTitle":"Featured product","fieldGroupName":"manual_category_blocks","hash":"section-featured-product"},{"blockContent":"

Adding a Section

\n

\"how

\n

\n

The section is static on a regular page template, it was added initially and cannot be removed.

\n

Section settings

\n

This section does not have any settings in the customizer. It serves to display content that is taken from the page settings.

\n

\"page

\n

\n","blockTitle":"Default page template","fieldGroupName":"manual_category_blocks","hash":"section-default-page-template"},{"blockContent":"

Adding a section

\n

\"how

\n

In order to add a section, you need to go to Customizer → Add Section → Custom liquid.

\n

Settings

\n

General

\n

\"general\"

\n
    \n
  1. \n

    Custom liquid – the setting allows you to add your liquid code.

    \n
    2. \n
\n

Layout

\n

\"Layout\"

\n
    \n
  1. \n

    Desktop offset top – the top indent of the section on the desktop;

    \n
    2. \n
  2. \n

    Desktop offset bottom – the bottom indent of the section on the desktop;

    \n
    3. \n
  3. \n

    Mobile offset top – the top indent of the section on the mobile;

    \n
    4. \n
  4. \n

    Mobile offset bottom – the bottom indent of the section on the mobile.

    \n
    5. \n
\n

Additional information

\n

You can learn more about liquid here – Liquid reference.

\n

\n

\n

\n","blockTitle":"Custom liquid","fieldGroupName":"manual_category_blocks","hash":"section-custom-liquid"}]},{"fieldGroupName":"manual_category","manualCategoryTitle":"Troubleshooting","manualCategoryBlocks":[{"blockContent":"

If you notice that something in your theme isn’t working as expected, please follow these steps before contacting our support team:

\n
    \n
  1. \n

    Disable all third-party apps (one by one, if possible). Some apps modify the theme’s code or add scripts that can interfere with its functionality.

    \n
    2. \n
  2. \n

    Check the theme again after disabling the apps.

    \n\n
    3. \n
  3. \n

    Add a fresh, unedited version of the theme from the Shopify Theme Store and check if the same issue appears there.

    \n\n
    4. \n
\n

If you notice that everything works correctly once the app is disabled, please reach out to the app’s support team, as they’ll be best equipped to assist with their integration.

\n

Alternatively, you can reach out to our support team and provide a collaborator access code so that we can send a store access request to review the issue directly and do our best to help.

\n","blockTitle":"Troubleshooting","fieldGroupName":"manual_category_blocks","hash":"troubleshooting"}]},{"fieldGroupName":"manual_category","manualCategoryTitle":"Support","manualCategoryBlocks":[{"blockContent":"

Allure Theme Support.

\n

If you need any help with your Allure Theme, feel free to reach out to us by email. Please note that we can help you with your theme, provided that it is updated to the latest version.

\n

We typically reply during business hours 8 am – 5 pm (Brussels, GMT +02:00), Monday-Friday (excluding holidays). 

\n

Reach out via the contact form below, or send us a direct email at support@utdweb.team.

\n

Contact us

\n

App support.

\n

If you need help with a 3-rd party app, or have questions regarding it, please contact App Support directly. Keep in mind, that app developers are expected to have their apps compatible with Shopify Themes.
\nPlease note that we can only support you with the Allure Theme Code, developed by us. 

\n

All Shopify App Developers offer support assistance, feel free to reach out to them.
\n

\n

Shopify support.

\n

If you need help with the Admin Panel or the Shopify platform in general, the Shopify Support team is available 24/7. 

\n

If you need help with the checkout page, always contact the Shopify Support team directly, as this page is not part of the theme code, it is a Shopify page. 

\n

Feel free to contact Shopify support here: https://help.shopify.com/questions

\n

Custom changes.

\n

If you need anything custom-developed for your store, then please note that this is now part of the theme support. If you need anything custom-added to your store, please note that we have a team of developers who can implement new features at an additional cost.
\nFeel free to learn more about our services by clicking the button below or contact us directly via support@utdweb.team and let us know the details of your request.

\n

Paid Services

\n","blockTitle":"Contact us","fieldGroupName":"manual_category_blocks","hash":"contact-us"}]}]}],"topLinks":{"latestUpdates":{"linkText":"Latest Updates","releaseNotesArticle":null},"paidServices":{"linkText":"Paid Services","linkUrl":{"uri":"/paid-services/allure/"}}}}},"lastmod":"2026-10-20"}}, "staticQueryHashes": ["1083880928","1850027792","2115852241","2249625599","2590265254","3117944600","3394409019","3777654359","842661457"]}