Theme settings

This section is the one that can be accessed on the top left sidebar panel of the Visual Editor of the theme and contains several options for you to customize it, with groups such as Design, Colors, Fonts, among others.

Many of the options within these groups will apply generally to the theme components and subcomponents, and in some cases you will be able to override them through additional customization options inside of them.

Next, you can find the details for all these groups, what they do and how you can use them to achieve a very customized theme design.

Store Title

This group of options allow you to customize the style of your Store name, which is the one that's available on the store's admin panel at Settings > General > Preferences.

Note: this name will only be visible if you haven't added a logo either through the available theme options or within your store's admin panel on Settings > General > Branding.

Name

Within this field you can replace the original Store name mentioned above, which will make it visible for example in:

Header component, if there's no logo.
Footer component, if there's no logo.
Mobile menu, if there's no logo.
Customer account pages and forms like Login and Create account.
OG meta tags that are within the theme's <head> tag.

If the field is empty (default) the one defined at Settings > General > Preferences will show instead.

Size

This option allows you to choose the size on which the name will be displayed, by predefined options (e.g. Small, Medium, Large) or manually by choosing Manual, which will display two additional controllers for desktop and mobile devices, respectively.

The size in which the name will show in different pages and sections will vary based on the calculations made within the theme's code.

Weight

Defines the weight or thickness of the name, which will depend on the fonts you have defined at the Theme settings > Fonts group.

Letter spacing

Defines the store's name space between letters.

Meta Tag settings

The following group of options allow you to customize certain aspects regarding the meta tags that affect how your store is visible on browsers and search engines.

Custom Meta Title tag

This option allows you to define how the meta tags will be displayed on your store for clients, like for example the ones you can see on a browser tab.

By choosing Automatic, titles will be rendered by using Jumpseller's default system, for example:

On the Home page will be Home | Store name.
On the Contact page will be Contact | Store name.
On a Category page it will be Category name, e.g. Collections.
On a Product page it will be Product name, e.g. Black purse.
On a Page it will be Page title, e.g. Terms and conditions.
On a Page category it will be Page category title, e.g. Blog.

Therefore, if for example you want your category pages to also display the Store name next to their names, you will have to add that manually on each one of them, at the Search Engine Optimization section available on the admin, within the Page Title field that can be found there.

Instead when choosing Custom the Store name, either the original one from Settings > General > Preferences or the one added from Theme settings > Store Title, will be automatically displayed next to layouts without having to add it manually, like for example:

On the Home page will be Home | Store name.
On the Contact page will be Contact | Store name.
On a Category page it will be Category name | Store name.
On a Product page it will be Product name | Store name.
On a Page it will be Page title | Store name, e.g. Terms and conditions | Store name.
On a Page category it will be Page category title | Store name, e.g. Blog | Store name.

This will also enable some new options, for you to customize further.

Custom Page Title

Within this field you will be able to override the previously defined Store name.

Show Category parent name

By enabling this option, category pages that belong to another will automatically display the parent name next to it.

Let's say that you have the following category structure:

Collections
- Necklaces, will display like this: Necklaces | Collections | Store name
- Rings, will display like this: Rings | Collections | Store name
- Bracelets, will display like this: Bracelets | Collections | Store name

Show 'Home' title page

This option allows to show the word Home on the Home page layout of your store. If disabled, only the Store name will be displayed.

Don't index on Search Engines

This option ——which comes disabled by default—— allows to change the <meta name="robots"> HTML tag on the <head> of the theme to be noindex, nofollow.

This can be useful if you don't want your store to be indexed yet by search engines like Google, if for example you're still setting it up.

You can also disable your store momentarily by going to your store's admin panel at Settings > General > Preferences > Store Status, but that will force you to enter a password each time you want to see it on a browser where you're not logged in.

Therefore, this option is intended so you don't have to disable it, and for example share with a colleague for revisions.

Disable shopping features

As the name of this group says, with the options inside of it you will be able to disable some features and aspects related to shopping aspects of the theme.

Disable product prices

When enabling this option all product prices will hide on the storefront, on any place where they're visible, like it's the case for product blocks as well as on the product page.

Disable all shopping features

This option will hide and disable the following elements within the theme:

The Cart item on the theme Header.
Add to cart button and Buy now link on product blocks and product page.
All buttons on shopping process pages like Cart and Checkout.

Product message

When enabling the previous option, this group will become available so you can customize the message that will display on product pages.

Title
Text
Show contact button: displays a button that will take customers to your store's contact page.
Show WhatsApp button: displays a button that will take customers to the respective WhatsApp platform, if you have added a number in Settings > Preferences > Social Media.

Colors

Within this group you will find Color packs that come installed with the theme, as well as the ones you can create by yourself.

Color packs

The theme comes with 5 pre-installed packs that are applied across the multiple available components that you can use.

Default

This is the most used and it's almost applied to all components on the theme. So, if for example you wish to change the overall design of your theme to have a different look, this is the pack that you need to edit and adapt its colors, so it applies to the majority of the store's design.

Alternative

This is a pack that has a slight coral tone in the background, which aims to make any component stand out from the rest.

Dark

The main purpose for this pack is to provide a Dark style, with its respective content contrast colors.

It comes applied by default on the following components:

Countdown
Flexible Content → Catalogue preset
Newsletter
Footer
Slide → subcomponent of Top bar

Light

The purpose of this pack is to provide a lighter version of the Default pack, with a greyer background color, to generate a visual division with the rest of the components.

Overlay

This pack is specifically used on subcomponents where there's an Overlay element enabled, and it positions between the image and the content, like the following:

Block → subcomponent of Gallery
Block → subcomponent of Grid Layout
Banner → subcomponent of Content Banners
Content → subcomponent of Big Banner
Slide → subcomponent of Content Slider

Pack options

Each pack includes a set of colors that will be applied to different elements within a component. Next we explain the use case for each one of them:

Background: color for the background of the sections where the pack is applied.
Main: color for elements of higher relevance within the theme, such as titles.
Secondary: color for elements of secondary relevance within the theme, such as descriptions, texts, among others.
Accent: color applied to decorative and highlight elements within a component, such as icons and small visual details that complement the main content without competing with it.
Main button: text and background colors for buttons with a higher priority within the theme, such as the Add to cart.
Secondary button: text and background color for buttons with a secondary relevance within the theme, like for example those that are visible on a product that has Options, and displays the text "See options".
Tertiary button: text and background color for buttons with a third level relevance within the theme, like for example those that are visible on a product that has an Out of stock status, which displays the text "See details".
Links: color for link elements, like for example one inside a page body text.
Links (hover): color for link elements on hover state.

Also within each pack you will also find some color options that only apply when the component displays products:

Discount color: applies to the background color of the Discount label that goes on top of images (if enabled); applies to when a product price has a visible discount or promotion.
Discount color - text: applies to the text of the Discount label.
Ratings color: applies to the stars icons for a product that has reviews and if the feature is enabled.

Referenced by

On each Color pack you will find at the bottom a section called Referenced by which upon click will reveal all the components and subcomponents on which this pack is being used.

When clicking on one of the references you will be taken to that specific component.

Design

This section is divided into several groups and the options inside of them will allow you to define generals aspects of the theme's overall design.

General

Within this group you will find the following options:

Show Theme Grid

When enabled the grid of the theme will be displayed, allowing you to visualize the 12 columns with which it's designed.

This can be useful for you to understand how sections and their content arrange if you start modifying the amount of columns for example on product blocks, banners, etc.

Width

This option allow you to set the maximum width that the theme will have and use, which affects how the content of each section and component will stretch to.

For example, if you opt to use Small that will mean that when using a Content Slider component, the maximum width on which images are gonna be displayed will be 1320 px.

On mostly all components you will find also a Width option which comes with the Default value applied. That means that those components will inherit what you choose here. You can change the value on each one of those components to define different widths for them.

You can find the entire list of Widths and their respective pixel measures in this section.

Spacing

This option allow you to define the amount of space between things like:

The left and right space between the content of components and the browser edges.
The inner space between elements like product blocks, banners, articles, among others.

When set to None, this will remove all spaces both inner and outer from the theme. Therefore, in case when there are product blocks, the content (e.g. name, price) will display inner spaces to create a visual separation from one another.

On components like for example Banners when the value is any but None, you will find an option called Space between which will allow you to remove the spacing between them even when you have defined that there should be one. This allows you to create dynamic layouts and design specifically for them.

Sections margins

Within this group you will find general options that define the Top and Bottom inner margins for all components and sections within the theme.

This means that when you change the values here, it will affect all of them simultaneously, making the theme have a consistent design.

Rounded Corners

This option will allow you to customize the corners of certain elements within the theme, which can be for example banners, product block images or product block cards (when enabled like that), amont others.

None (by default) will mean that all corners of those elements will be completely square.

On the opposite, values like Small and Large will make corners have a slight roundness, 8px and 16px respectively.

When choosing Custom an additional option will become visible and you will be able to manually adjust the amount of pixels to a maximum amount of 36px.

Line dividers

With the options in this group you can define the general visual aspect of divisory lines within the theme, which are for example the following ones:

Line divider component
Line divider subcomponent → available at Footer.
Line divider subcomponent → available at Product template.

You will be able to customize aspects such as Thickness, Opacity (transparency), and Top and Bottom margins for desktop and mobile devices.

Overriding styles

On all of the components and subcomponents mentioned above, you will find options to customize both the Style and Margins especifically for them, which will override the general options defined at Theme settings.

Fonts

Here you will be able to customize the Fonts that are applied to several sections, elements and mostly, to the content within your theme.

The elements that will get affected based on what you choose are:

Store name
Titles
Subtitles
Texts
Links
Buttons
Menu items

Font setup

In this option you can choose how you would like to use and apply fonts within your theme, based on the following:

Pairings

Displays a selector in which you can choose between curated font combinations which we have put in place.

Manual

Displays multiple selectors for you to manually choose the fonts that are applied to the following elements:

Store name: affects any part of the theme where the store's name is shown.
Main: relate to titles, like the ones present on Slides, Banners, Heading sections, the Product name/title, among others.
Secondary: relative to texts and paragraphs, as well as subtitles.
Menus: affects all items present in the theme Header, Footer, and Desktop and Mobile menus.
Prices: affects every place where there's a visible price in the theme.
Buttons: affects all buttons across the theme.

Base font size

The Base font size is the foundation of all text sizing across the theme. Think of it as the starting point from which every other text element — titles, subtitles, body text, button labels, captions, and more — is calculated and scaled proportionally.

By default it's set to 16px, which is the standard size used across the web and the one most browsers and devices use as their default reading size.

When you increase or decrease this value, you're not just changing one element — you're shifting the entire typographic scale of the theme up or down. For example:

If you increase it to 18px, all text elements across the theme will grow proportionally — titles will get bigger, body text will feel more spacious, and the overall theme will have a larger, more open feel.
If you decrease it to 14px, everything scales down proportionally, giving the theme a more compact and dense appearance.

This also affects spacing in several areas of the theme, since many spacing values are calculated relative to this base size as well.

When should you change it?

If your store's content feels too small or hard to read, try increasing the base size slightly — even 1px or 2px can make a noticeable difference.
If you feel the theme takes up too much visual space or you want a more compact layout, reducing it slightly can help.
If you're targeting an audience that may have difficulty reading smaller text — such as an older demographic — a larger base size can significantly improve readability and accessibility.

Note: It's recommended to make small adjustments and preview the result before settling on a value, since this setting affects the theme globally.

Icons

Icons used within the theme are from the Phosphor icons library, which offers a wide variety of styles to match different aesthetics.

Style

Allows to define the style for the icons across the theme. This will be applied globally to all icons, unless a specific one has its own style option.

Bold
Fill
Light
Regular
Thin

Cart

This group considers the following options related to the Cart icon across the theme.

Cart icon

Icon that will represent the Cart across the theme, for example in the Header. Choose the one that best matches the aesthetic of your store.

Bag
Bag simple
Handbag
Handbag simple
Shopping Bag
Shopping Bag Open
Shopping Basket
Shopping Cart
Shopping Cart Simple
Tote
Tote Simple

Show Cart icon in buttons

Allows to define if the Cart icon will be displayed on the Add to Cart buttons, visible on product blocks and on the product page.

Contact & Locations

The options within this group allow to define the icons for contact and locations sources of the theme. The ones available are:

Email: to represent an email address.
Phone: to represent a phone number.
Address: to represent a physical address.
Pickup: to represent a store location that's marked as pickup.
Hours: to represent opening and/or closing hours.
See more details: used for the link or button that opens additional details for a location.

Social

These options are directly connected to the social media options that you can find in your store's admin panel at Settings > Preferences > Social Media.

To choose where you can enable or disabled them in different parts of the theme, go to this section of the page.

Social media links

Defines the icon that's used on links and buttons that allow to share content on the theme, like for example in a product page.

Customize styles

Enables an individual option to customize the style for each one of the social media icons.

If not enabled, all social media icons will use what's defined at the Style option.

Buttons

These options allow you to define the appearance of buttons across the entire theme.

Changes made here will be applied globally to all buttons unless they are overridden at a component level.

Appearance

Size

Allows to define the size of buttons across the theme.

Choosing Custom will reveal two additional options to define the size manually for desktop and mobile devices.

Style

Allows to define the shape style for all buttons across the theme, between the following:

Circular	Rectangular	Rounded
Button	Button	Button

Transition

Allows to define how the button background color will change when a customer hovers over it.

Darken: it will make the color be darker than the one defined.
Lighten: it will make the color be lighter or less bright than the one defined.

The way in which they get darker or lighter will be based on the colors defined for Main, Secondary and Tertiary buttons within each Color pack.

Weight

Allows to define the font weight or heavyness of the text inside buttons.

For a reference on how numerical values map to weight names, check this article.

Letter spacing

Allows to define the spacing between letters inside buttons.

All caps

When enabled, the text inside all buttons across the theme will be displayed in uppercase, even when they weren't written like that.

Show arrow

Allows to display an arrow icon next to the buttons text.

Note: this won't have any effect on buttons such as the Add to cart or Buy now.

Groups

The following options apply to buttons when they are displayed in groups, meaning when more than one button can appear together in the same section.

Orientation

Allows to define how buttons in a group will be arranged.

Horizontal
Vertical

Alignment

Allows to define the horizontal alignment of button groups on desktop and mobile devices, respectively.

Gap

Allows to define the space between buttons when displayed in a group.

Small
Medium
Large
Custom

When choosing Custom, two additional options will become visible for you to manually define the space or gap on desktop and mobile devices.

Top & bottom margins

Allows to define the space above and below a button group.

Headings

This section contains all the options for the Heading sections of the theme.

Headings are used across components to display certain elements in a structured way. They are divided into two columns, in which each one will display the different elements that you can add:

1st column will display titles, subtitles, texts or descriptions, and buttons.
2nd column will only be displayed if a link has been added.

Alignment

Desktop and Mobile allow you to define the horizontal text alignment for all heading elements, in the respective devices.

The option Vertical (desktop) allows you to define the vertical alignment between the 1st and 2nd columns. This will only produce a visible change if the second column exists.

Gap

Allows to define the amount of vertical space between heading elements on desktop and mobile devices independently.

Margins

Allows to define the top and bottom margins for heading sections generally across the theme.

You will also find the On mobile option for adjusting the size on mobile devices, which is explained in this page.

Blocks customization

You will find all necessary options to customize the style and appearance of all the blocks that are part of a Heading section:

Subtitles
Titles
Descriptions or Texts
Links
Dates
Buttons: this is covered in this section of the page.

Note: you can read about all the different style options in this page.

Desktop menu

This menu is the one that's visible on the Header of the theme. There are certain aspects of it that are necessary to understand before customizing it:

It displays only on desktop devices that have a width equal to or higher than 992px.
For devices less than that the Mobile Menu will be used and an item on the Header will become visible in order to open it.
It displays all the items from the Main Menu that's available within your store's admin panel at Themes > Navigation. You can read more about it on this page.

It's displayed by checking the Enable option (default) that's at the start of this group and you will be able to see it immediately both on your Visual Editor and on your storefront.

Next, we cover all the different options you will find to customize it.

Appearance

The options in this group will allow you to customize its look, as well as the behavior of different elements inside of it.

Width

Here you can define how much the menu will stretch, based on the following two options:

Header: the menu will stretch to the maximum available space that the Header has, based on the Width that's defined for that component.
Full: the menu will ignore the width defined for the Header and instead stretch to the full width of the browser in which it is being visualized.

Alignment

This option allows you to define the horizontal position and alignment for the content inside the menu, which includes all the first level items as well as social media links, if enabled.

Note: To enable or disable the social media links here, you need to do it at Social networks > Desktop menu.

Top border

Allows you to display a slight border at the top of the menu, to create a division with the content that's visible above it.

Show/hide transition

When enabling this option the menu will hide when scrolling down the page and it will show when scrolling up.

Important: This effect or transition will only work if the Header has been defined to be fixed on scroll.

Custom color pack

Allows you to choose a different color pack individually for this menu.

If not enabled, Desktop menu colors will be taken from the Color pack defined at the Header (default).

This option works better in the following scenarios:

If Browser width is enabled at the Width option within the Header settings.
If within Design > General > Width the value Browser width has been defined, and within the Header settings the Width value is Default.
If the Width option of the Desktop menu is equal to Full, regardless of what has been selected in any of the previous points.

First level items

The options within this group will allow you to modify certain styles and only apply for the menu items that belong to the first level:

Size
Weight
Letter spacing
All caps

Submenus styles

The options in this group also allow you to change certain styles, but in this case for the submenus or dropdowns that display when an item has inner levels.

Size
Weight
Letter spacing
All caps

Submenus settings

Apart from styles, you will also find options to define the behavior in which these submenus work.

Open event

Defines which action a customer needs to perform to open a submenu on any item that has inner levels:

Click: items will need to be clicked in order for the submenu to be displayed. For those that open a submenu, even when they have a link defined, won't take anywhere since they will only work as a functional element.
Hover: submenus will be displayed immediately when an item gets the cursor placed above them. It will work the same way as the previous option, meaning items with links won't take anywhere upon click.
Hover w/ click: this is the same as point number 2, but items that have a link defined will take customers to the page upon click.

Style

Defines how the submenus of your navigation will be displayed when a customer opens them. Depending on the structure and amount of categories in your store, one style may work better than the other.

Flyout menu: the submenu appears as a small dropdown panel directly below the parent item, listing its child items in a simple vertical list. It's ideal for stores with a straightforward category structure, where each section has a limited number of subcategories.
Mega Menu: the submenu expands into a wider panel that spans across the navigation, displaying child categories grouped in columns. It's better suited for stores with a larger or more complex category structure, where giving more visibility and space to each section improves the navigation experience for customers.

When choosing Flyout a secondary option called Width will be displayed, in which you can define the minimum width for all the flyout panels, based on three sizes: Small, Medium and Large.

Show 'View all' link

When enabled, a View all link will appear at the bottom of each submenu, pointing to the first level item's link — as long as it has one assigned.

By doing so, you can customize the text for all of them through the Link text field that will become visible.

We suggest that you use it if you have chosen Click or Hover at the Open event option.

Mobile menu

This menu is the one that displays on devices with a width equal to or lower than 991px.

It will also be used and displayed if you have disabled the Desktop menu — in that case, the respective item will appear on the Header for customers to open it and browse its content, such as menus and links.

You can easily customize it through the Visual Editor of your store by enabling the Show for edition option, which will open the menu so you can see your changes live while tweaking all the options available in this group.

Logo options

Allows you to customize and upload a Logo specifically for this menu. If you don't add one, the Store name will be displayed instead.

You can also define the height of the logo to adjust how it displays based on the dimensions of the image you upload.

Note: we suggest uploading a logo in .svg format, or at least .webp, or ultimately .jpg.

Main menu

This is the same menu that displays on the Desktop menu, sourced from Themes > Navigation.

Here you will find some options to customize it:

Always opened

This menu uses an Accordion system, meaning that child item levels are grouped within their parent items and only revealed when clicked.

By enabling this option, accordion items will remain open when another one is clicked, instead of closing automatically — which is the default behavior.

Style options

You will find a few options to customize the appearance of this menu.

Size defines the font size for the menu items. This applies directly to the first level items, while child items will be proportionally smaller relative to their parent.

Weight, Letter spacing and All caps will only affect the first level main items.

Secondary menus

The secondary menus available on the Mobile menu can come from two different sources:

Enabling the Show Locations option, which will display all the Locations you have added within your store's admin panel at Checkout > Locations.
Adding a Menu list and/or Contact Menu within the Header component.

You will also find a few options to customize the style of the titles across all these menus:

Weight
Letter spacing
All caps

Search

Within this group you will be able to control how the Search feature works in the theme.

By checking Enable Search (default), this will be enabled on the store's Header and several options will be revealed for you to customize it.

If you disable the search functionality, an option called Logo position will become visible, letting you define whether it should stay centered at the Header or placed at the left side of it, on desktop devices.

Settings

This group allows you to control several aspects of the search feature, being the main one the Behavior option, which determines how the search form will work.

The Button text, Field placeholder text and Color pack will behave differently depending on which behavior you choose.

Visible form

When choosing this option, the search form will display within the main content area of the Header section, to the left of the Logo.

On desktop devices, customers will be able to type directly into it to perform a search, and it will show the text defined at Field placeholder text.

On mobile devices it will switch to a button that opens the form in a small panel from the top of the browser window, using the text defined at Button text.

The Color pack option will affect the colors of the form on both desktop and mobile versions.

Sidebar

When choosing this option, an item will be displayed at the left side of the Header's content area. Upon click, a floating panel will slide in from the left side of the browser window. The text on the item will be the one defined at the Button text option.

The Color pack option will affect the sidebar panel and all the elements inside of it.

You will also find several Menus available, which can display lists of links below the search form so you can offer customers easier ways to find relevant content.

Modal

Works similarly to the Sidebar option, with the difference that upon click the panel opens from the top of the browser, with the search form positioned on the left side and the submit and close buttons on the right.

The text defined at Button text is used on the item that opens the modal, while the Color pack option affects the colors of the modal and its content.

Menus

The following menus will become available when choosing Sidebar at the Behavior option mentioned above.

The content for the lists inside each one of them comes from the navigation items added within Themes > Navigation, from their respective menus:

Categories → Themes > Navigation > Search Categories
Products → Themes > Navigation > Search Products
Filters → Themes > Navigation > Search Filters

You can customize the title that displays before each list through their respective Title field. If you leave any of these fields empty, the name of the menu will be displayed instead.

Note: even though these were designed with specific use cases in mind, you can use them for any purpose you want.

Products

Useful if you want to highlight specific products directly — for example, bestsellers, new arrivals, or featured items — so customers can find them instantly without having to type anything.

Filters

Useful if you want to surface common search criteria upfront, like material, color, or price range, helping customers refine what they're looking for before even performing a search.

Adding filters as links isn't something that can be done directly from the navigation menu options available at the store's admin panel, so here's a step-by-step process to achieve it:

Note: the Advanced Product Filtering feature is only available from Premium plans and above.

Go to any category page of your store, like for example your-domain.com/all-products, or to the search page by typing your-domain.com/search in the browser.
If filters are available, check some of the boxes next to the filter names and apply them.
The URL of the page will update to include the selected filters as query parameters, e.g. your-domain.com/all-products?min=&filter%5Bbrand%5D%5B0%5D%5B%5D=Brand+name+1.
Copy that URL and go to Themes > Navigation > Search Filters at your store's admin panel.
Add an item of type External URL and paste the URL you copied.
Give the item a name, like for example Search by brand.
Save your changes. The item should now appear within this menu list.

By repeating this process for each filter you want to offer, customers will be able to open the search panel and jump directly to results that are already filtered.

Wishlist

The Wishlist feature provides your customers with the ability to save products to a personal list, so they can find them more easily and buy them whenever they're ready.

It's linked to Jumpseller's Customer Login feature, available from Pro plans and above, meaning that if you don't have it enabled, your customers won't be able to save products even if the Wishlist is enabled on your theme.

By checking the Enable Wishlist option, other options will become available for you to customize its behavior under the Show on group.

Note: If customers are not logged in, they will be taken to the Login page first. If logged in, they will be taken to their account page with the respective tab already selected.

Header

Allows you to define how the Wishlist will be displayed in your theme Header.

Single item

It will be displayed to the left of the Login item on desktop devices.

On mobile, it will appear within the dropdown menu of that item, as long as Dropdown has been selected at the Login item option within the Header settings.

Login dropdown

As opposed to the previous option, it will only be displayed within the Dropdown menu of the Login item in the Header. Therefore, it is recommended that you select that option in those settings.

Don't display

The Wishlist item won't be displayed in any case.

Product blocks

When enabled, a button will appear on top of product block images.

It will also display customization options to control its appearance within the Product blocks group.

Social networks

Within this group of options you will be able to customize how and where the social media links that you can add on your store's admin panel at General > Preferences > Social Media will be displayed.

Title

Allows you to define the title that will appear alongside the social media links on the following sections:

Show Social networks

Allows you to enable or disable social media links from being displayed across the theme. Once enabled, the following options will let you control where they appear:

Note: for the Details subcomponent that's part of the Contact component, both the social media links and the title need to be enabled or disabled directly from those settings.

Header

Allows you to define where social media links will be displayed in the Header's content area:

Left side: they will show at the left side of the Header, alongside the search bar, if enabled.
Right side: they will show at the right side of the Header, alongside other items like currencies, languages, login and cart.
Don't show: social media links won't be displayed in the Header's main content area.

Desktop menu

Social media links will be displayed in the Desktop Menu, to the right of the menu items.

Mobile Menu

Social media links will be displayed in the Mobile Menu right after the main menu accordion.

Footer

Social media links will be displayed in the Footer, inside the About subcomponent and right after the logo or store name, or after the description if one is enabled.

Store Message

Social media links will be displayed in the Store Message, if enabled.

Breadcrumbs

Breadcrumbs are a navigation trail that helps your customers understand where they are within your store's structure, with links that allow them to go back without needing to use the browser's back arrow.

This trail will vary depending on which page they are on, for example:

On a category: Home > Collections > Necklaces
On a product: Home > Collections > Necklaces > Product name

The last item will be plain text, while all the preceding ones will be links.

Devices display

Allows you to define on which devices the Breadcrumbs will be visible:

All: visible on all devices.
Desktop: visible on devices with a width equal to or higher than 576px.
Mobile: visible on devices with a width equal to or lower than 575px.
None: won't be displayed at all.

For any option except None, the following options will become available, letting you choose on which page templates the breadcrumbs will appear:

Categories: will be displayed on all category templates.
Search Results: will be displayed on the search results page.
Products: will be displayed on all product templates.
Pages: will be displayed on all store pages and page category templates.
Contact: will be displayed on the contact template.
Customer pages: will be displayed on all customer templates.
Error page: will be displayed on the error page template.

Margins

This group of options will allow you to control the margins for this section.

You can read more about them in detail on this page.

Appearance

Within this group you will find an option to control the Alignment for desktop devices only.

For mobile devices, the alignment will always be to the left, since if the trail is too long, customers need to be able to scroll horizontally to see its full length.

You will also find the option to choose the Color pack for this section.

Carousels

Carousels are present on several components where you can define how many items — typically subcomponents — are shown at a time, across different devices such as desktop and mobile.

Within this group you will find options to customize them globally, meaning that all carousels across the theme will be affected by what you choose here.

Individual components that offer the possibility of displaying a Carousel will have their own settings that can override these defaults and/or change how they behave, like for example:

At the Content Slider and Image Slider components you will find a group called Slider settings.
At the Trust bar component you will find a general group called Carousel settings, as well as an option called Customize settings, which will override some of the options defined here.
The Customize settings option is also present in several of the components that offer a Display option that includes Carousel as a value.

Autoplay speed

Allows you to define the speed at which all carousels automatically move from one item to the next, measured in seconds.

Arrows

Note: within each component you will find an option to enable or disable arrows.

Size

Allows you to define the size of the navigation arrows in carousels.

Position

Allows you to define how they will be positioned within a carousel on the horizontal axis, based on two options:

Center: arrows will be placed at the center of the section, to the left and right of the Dots respectively, if they are enabled as well.
Justified: arrows will be placed at the sides — left arrow on the left and right arrow on the right.

Dots

Note: within each component you will find an option to enable or disable dots.

Size

Allows you to define the size of the navigation dots in carousels.

Shape

Allows you to define the shape of the navigation dots.

Square
Rectangular

Style

Allows you to define the corner style of the navigation dots.

Circular
Sharp
Rounded

Examples

Next you can find an example of how they would look based on the different Shape and Style options combined:

Shape / Style	Circular	Sharp	Rounded
Square
Rectangular

Note: the size in these examples considers a 24px size for dots.

Margins

You will find options to control the top and bottom margins for the section that contains all navigational elements, as well as an option to control the percentage to use on mobile devices.

You can read more about how Margins work on this page.

WhatsApp button

This option allows you to display a floating WhatsApp button that stays visible as customers scroll through the store.

It is recommended NOT to enable this if you're already using a plugin or integration that displays a WhatsApp button, to avoid showing two at the same time.

In order for this button to work, you need to have added your WhatsApp number within your store's admin panel at General > Preferences > Social Media.

By checking Enable WhatsApp button, several options will become visible for you to customize it.

Type

Allows you to define the behavior of the button when clicked, based on the following options:

Direct

It will take customers directly to the respective WhatsApp platform based on where they're visiting the store from:

Mobile: it will open the WhatsApp mobile app.
Desktop: it will open the WhatsApp Web interface.

Agents

When clicked, a panel will open above the button displaying the available Agents.

These are different numbers that you can add, which can be useful if you have multiple channels or numbers through which customers can contact you.

You can add up to 4 agents in this section. The first one corresponds to the number you have already added in your store's admin panel, while the remaining three can be manually added by checking each respective Enable agent option.

For all of them you will find the following customization options:

Phone number: the phone number for the agent. If this field is empty, the agent won't be displayed at all.
Image: allows you to define an image for each agent, with a dimension of 50x50 px. If empty, the logo defined at General > Branding within the store's admin panel will be used. If no logo has been defined there, an icon will show instead.
Role: allows you to define a role for each agent, like for example Technical support or Contact sales.
Name: allows you to provide a name for each agent, such as the name of the person who will receive and answer the message.
Predefined text: allows you to add a text that will appear automatically in the chat when a customer decides to send a message.

Appearance

Position

Allows you to define in which corner of the browser window the button will be displayed.

Bottom Left
Bottom Right

Size

Allows you to define the size of the WhatsApp button.

Small
Medium
Large

Enable animation

When enabled, the WhatsApp button will display a subtle animation to attract customer attention.

Colors

You will find four options to customize the colors of the button in its normal and hover states.

If the Agents behavior is enabled, you will also find color options to customize the panel that opens upon click.

Filters

Note: Jumpseller's Advanced Product Filtering feature is only available for Premium plans or above.

Filters allow customers to narrow down product listings by attributes such as price, brand, color, and more.

To know more about this feature, please visit this Jumpseller article.

In this section you will find several options to customize how they look and behave within your theme.

Settings

Show on desktop

When enabled, filters will be displayed within a column at the left side of the product list on desktop devices.

On mobile devices, filters will be within a hidden panel that can be opened by clicking on a button displayed on the Heading section of the template, either Category or Search results. The same behavior will take place if this option is disabled.

If enabled, two other options will become available:

Apply on click: this will apply the filter and reload the page as soon as it is clicked.
Column width: allows you to choose how much space of the grid the filter column will occupy:
- Small: it will use 2 of the 12 columns in which the grid is divided on desktop devices, and 3 columns on tablets.
- Large: it will use 3 of the 12 columns in which the grid is divided on desktop devices, and 4 columns on tablets.

Amount of products by filter

When enabled, the number of products available for each filter option will be displayed next its name, in parentheses.

Limit amount of filter items

When enabled, the number of visible items within each filter group will be limited, based on the number you define in the option called Amount of visible items, with a minimum of 5 and a maximum of 15.

Limiting the amount of items can be useful if for example you have either:

Disabled the Collapse options and therefore the list of filters has become too long.
Enabled the Collapse options, but chosen All opened at the Default status option, which also makes the list to be longer.

Order by

When checking Enable, a select list will be displayed upon which customers can define the order in which they want to review the products within a page, based on the following options:

Position: displays products in the position in which you have them in your store's admin panel, for each category.
Name: A to Z
Name: Z to A
Price: Low to High, showing cheaper products first.
Price: High to Low, showing more expensive products first.
Date: Newest first, meaning that the latest products added to a category will be displayed first.

The default option displayed in this selector will be the one defined for each category, which by default is Position.

To know how to find it, follow these steps:

At your store's admin panel go to Products > Categories.
Choose a category and click on its name to access the settings.
Scroll down to the Properties section and locate the Default Order selector.
There you can define the order for that specific category, which will be the default that displays on the storefront.

With the Title option you will be able to customize the text displayed above the selector.

Note: Price: Low to High and Price: High to Low will only consider original prices, meaning that the order won't take into account prices with discounts applied.

Subcategories

When checking Enable, the subcategories of the current category will be displayed within an accordion group.

If the category in question doesn't have inner levels — that is, subcategories — this group won't be displayed at all on the storefront.

With the Title option you will be able to customize the text displayed above the group of subcategories.

You will also find an option called Show subcategories without products, which allows you to define whether subcategories that are empty or have no products inside them should be displayed or not.

Filter by price

When checking Enable, two fields will be displayed for customers to set a From (minimum) and To (maximum) price.

The prices that will be displayed as placeholders inside the fields will be:

On the From field, the price of the product with the lowest price.
On the To field, the price of the product with the highest price.

A placeholder is a hint text that appears inside an empty input field to show customers what kind of value is expected. It disappears as soon as they start typing.

A couple of things worth considering about this functionality:

They will only be displayed on category pages and not in search results.
When Apply on click is enabled, the button to apply price filters will be displayed alongside the fields.
When Apply on click is disabled, a button to apply all selected filters, including price ones, will be displayed at the top of the column.

With the Title option you will be able to customize the text displayed before the fields.

Collapse options

By checking the Enable option in this group, all types of filters inside the column — including Order by and Subcategories — will behave as an Accordion.

If disabled, the list of filter groups will expand and all of them will be visible at the same time, without the ability to close them.

With the options that will appear when enabling this, you will be able to control how the accordion will behave.

Default status

Allows you to define whether all filter groups will start expanded (All opened) or collapsed (All closed) when the page loads.

When choosing All closed, you will find options to override this behavior and therefore keep specific groups open by default:

Open Order by
Open Categories
Open Price filters

Product Blocks

Product blocks — sometimes also referred to as product cards — are the preview elements that present the basic details of your store's products. These are shown on several components across the theme, either in a Grid or Carousel display. For the purpose of this documentation they will often be referred to simply as blocks.

Some examples of these are:

Product collection
Featured collection
Product feed → Available at the Category and Search results templates.

In this section you will be able to define and adjust settings for them, which will apply globally to all product blocks across the theme.

Each block is divided into two main areas:

the Image area, where the product image(s) is displayed, which can also include labels, the discount tag, status labels, among others.
the Content area, where all product information is presented, such as the name, price and actions like buttons and links.

Appearance

Within this group you will find options to control the general look of product blocks.

Content order

Allows you to define the order in which elements appear in the product block Content area, which you can drag to reorder.

The Color options and Wishlist button will be displayed here only if their respective Position option is set to Content area.

The elements or information you will be able to move are the following:

Attributes → which are SKU and Brand.
Name → which is the product title.
Price → original price or with discounts when there's an applied promotion.
Colors → if the product has options of that type.
Rating → if the product has customer reviews.
Wishlist → if you have allowed customers to save products within the Wishlist settings.

Alignment options

You will find two options to define the alignment of the content for both desktop and mobile devices.

Columns options

Allows you to define how many products will be displayed per horizontal row for desktop and mobile devices, respectively.

There are some cases in which the theme will fall back to 4 columns when choosing 5 columns for desktop devices, mainly to ensure the information is displayed appropriately and preserve a consistent design:

5 columns will be applied only on devices with a width equal to or higher than 1200 px.
On the Product feed component, if you have selected 5 columns and have also enabled Filters to be displayed on desktop through the Show on desktop option.

Values for Mobile will be applied on devices with a width equal to or lower than 575 px.

Space between

This option allows you to define whether there will be a horizontal space (left and right) separating the blocks.

It will only appear if you have defined any option other than None within the Design > General > Spacing section.

If the Card style option has been enabled, all spacing will be removed, including sides, top and bottom.

Rounded corners

This option is connected to the global Size option within the Design > Rounded Corners section, and works in the following way:

If Size equals None, this option will not be displayed within the Product blocks settings.
If Size is anything other than None, the option will be displayed here, and you can choose to keep it enabled or disable it to override the style only for these blocks.

The roundness will behave differently depending on the Card style option:

If enabled, the corners of the entire block will be rounded.
- If Image padding is enabled, the image will also present rounded corners.
- If Image padding is disabled, only the top left and right corners will be rounded, while the bottom corners will not.
If disabled, only the product image will present rounded corners.

Card style

When this option is enabled, all blocks across the theme will be displayed with a card-style shape around them, adding a space or padding between the edges of the card and the image and content inside.

Several options will become available as well within the next group.

Card options

Image padding

When enabled, a space or padding will be added between the image and the edges of the card background.

Border

When enabled, a border will be displayed around the card.

The Border opacity option will become visible for you to control its transparency.

Shadow on hover

When enabled, a shadow will appear around the card when a customer hovers over it. The following options will become available as well:

Shadow blur size: allows you to define the size of the shadow.
Shadow opacity: allows you to define the opacity or transparency of the shadow. The lower the percentage, the less noticeable it will be, and the higher it is, the more visible it will be.

Note: the shadow will always be black.

Color pack

Allows you to define and apply a Color pack for all product blocks.

On components you will find an option called Custom Card color, with which you can override the pack defined here for those specific components.

Note: the Color pack option here and Custom Card color on components will only be visible when Card style is enabled.

Image

The following options will allow you to control how images will behave inside product blocks.

Display

Defines how images will be processed and displayed, based on the following two options:

Resize

The image will be resized to fit within the defined Dimension, while maintaining its original ratio.

For example if you're uploading a square image but the dimension you have choosen is Portrait, the image will positioned to the center, both vertically and horizontally. Therefore, you will see spaces on the top and bottom.

Crop

The image will be cropped to fill the entire available space, based on the defined Dimension.

So for example, if you have uploaded a rectangular image but the choosen dimension is Square, the theme will cut the left and right side, since the image will be centered horizontally and vertically.

Dimension

Allows to define the aspect ratio to which product images will be resized or cropped.

You can read more about how Dimensions work on this page.

Transition

Allows to define a visual transition effect that plays when a customer hovers over a product image:

Grayscale on hover: images will be displayed with their original colors, but will turn to gray as soon as the customer hovers the product block.
Grayscale on start: this will apply the inversed behavior than the previous option.
Show second image: will display the second image that you have added to any product within its settings. It a product only has one image, you won't see any transition.
Zoom: as soon as a customer hovers on a product block, the image will increase its size 10% more.
None: no transition will be applied.

Note: on mobile devices since there's no hover action, transitions will apply only upon touch or focus behavior.

Attributes

For the purposes of this theme, Attributes will refer to two product details: SKU and Brand.

Through the Display option you will be able to define whether you want to show both, only one of them, or none.

You will also be able to define the Size they will have for desktop and mobile devices respectively.

Name

The following options allow you to customize the style of the name or title for all product blocks across the theme:

Size

For desktop and mobile devices.

Weight

Thickness based on the ones available for the Main font defined at the Fonts settings.

All caps

Will force the names to be displayed in uppercase.

Letter spacing

Defines the space between characters.

Limit characters

When enabling this option you can truncate or shorten the names of all product blocks to a specific character count (chr), through the Characters amount option that will become visible.

A few things worth considering when enabling this:

Names will display an ellipsis (...) at the end, which counts as part of the character length.
Spaces are considered as characters.

For example, let's say the name of a product is Gold engagement ring with white diamonds. Including spaces, the total character count is 40.

If we set a maximum of 20 chr, the result will be Gold engagement r....

This is useful when you want to maintain a consistent structure across product blocks — for example, making all of them present just two lines of text within the name area. To achieve that, considering the theme's default settings upon installation, you would need approximately 50 chr.

Price

Options for customizing the size and style of the product price displayed in product blocks.

Labels

Options for defining the position and appearance of product labels such as discount, new, and status labels.

Discount label

Options for customizing the label that displays on products with an active discount.

'New' label

Options for customizing the label that displays on newly added products.

Status label

These labels display for products with a Not available or Out of stock status.

Color options

Options for displaying product color variants as swatches on product blocks.

Ratings

Options for displaying the product rating score on product blocks.

Wishlist

Options for customizing the Wishlist button position and colors on product blocks.

BUTTONS & ACTIONS

Show buttons

When enabled, action buttons such as Add to cart will be displayed on product blocks.

Add to cart

Behavior

Allows to define how the Add to cart interaction works on product blocks.

Dynamic — the button adapts depending on the product (e.g. shows quantity selector when applicable).
Button + Quantity — displays both the Add to cart button and a quantity input together.
Single button — displays only the Add to cart button.
Direct Link — clicking the button takes the customer directly to the product page.

Text

Allows to customize the text displayed on the Add to cart button.

Buy now

Show link

When enabled, a Buy now link will be displayed below the Add to cart button on product blocks.

Text

Allows to customize the text displayed on the Buy now link.

Options

Show button

When enabled, a button will display on products that have multiple variants or options, prompting the customer to select one.

Text

Allows to customize the text displayed on the options button.

Status

Show button

When enabled, a button will display for products with a Not available or Out of stock status.

Out of Stock text

Allows to customize the button text for products that are out of stock.

Not Available text

Allows to customize the button text for products that are not available.

Product Form

Options that control the appearance and behavior of the product form on the product page — the area where customers select variants, quantity, and add products to the cart.

Quantity selector

When enabled, a quantity selector will be visible on the product page, allowing customers to choose how many units to add to the cart.

Tax indicator

When enabled, a text will be displayed next to the price indicating that it already includes taxes. This text will not appear if your checkout settings already indicate that taxes are included in the price.

Tax in all caps

When enabled, the tax indicator text will be displayed in uppercase.

Buy now

Show button

When enabled, a Buy now button will be displayed on the product page.

Set as main

When enabled, the Buy now button will be placed before the Add to cart button, giving it visual priority.

Quote button

Appearance

Allows to define how the Request quotation option will be displayed on the product page.

Button
Text

Options

Display

Allows to define how product options of type option will be displayed on the product page.

Button
Selector

Style

Allows to define the shape style for option buttons.

Circular
Rectangular
Rounded

Colors

Display

Allows to define how product options of type color will be displayed on the product page.

Button
Selector

Style

Allows to define the shape style for color option buttons.

Circular
Rectangular
Rounded

Stock & Availability

Show 'Available' Product Stock tag

When enabled, a tag indicating that a product is available in stock will be shown on the product page.

Show exact stock amount

When enabled, the exact number of units in stock will be displayed instead of a generic availability message.

Hide variants without stock

When enabled, product variants that have no stock will be hidden from the options displayed to customers.

Hide locations without stock

When enabled, pickup or delivery locations with no stock available will be hidden.

Status

Low stock message style

Allows to define the visual style of the message that appears when a product is running low on stock.

Basic
Limited
Alert

Back in stock button text

Allows to customize the text for the button that allows customers to be notified when an out-of-stock product becomes available again.

Not available

Content of the message that displays for a product that has a status of Not available.

Title

Allows to define the title of the Not available message.

Text

Allows to define the body text of the Not available message.

Out of stock

Content of the message that displays for a product that has run out of stock.

Title

Allows to define the title of the Out of stock message.

Text

Allows to define the body text of the Out of stock message.

Contact button

Displays a button that takes customers to the store's contact page upon click.

Show

When enabled, a Contact us button will be displayed within the Not available and Out of stock messages.

Text

Allows to customize the text of the contact button.

Whatsapp button

Displays a button that takes customers to WhatsApp's platform upon click.

Show

When enabled, a WhatsApp button will be displayed within the Not available and Out of stock messages.

Text

Allows to customize the text of the WhatsApp button.

Predefined text

Text that will be pre-filled in the WhatsApp message when a customer clicks the button.

Product Reviews

Options for customizing how customer reviews are displayed on the product page.

Alignment (desktop)

Allows to define the horizontal alignment of review content on desktop devices.

Left
Center
Right

Alignment (mobile)

Allows to define the horizontal alignment of review content on mobile devices.

Left
Center
Right

Content gap

Allows to define the space between review content elements.

Small
Medium
Large
Custom

Gap (desktop)

Allows to manually define the review content gap on desktop. Only available when Content gap is set to Custom.

Articles

Options for customizing how article blocks (blog posts) are displayed across the theme.

Appearance

Options for the general layout and structure of article blocks, including content order, columns, alignment, spacing, and card style.

Columns (desktop)

Allows to define the number of articles displayed per row on desktop devices. When set to 1, articles will be displayed in a horizontal layout.

Alternate order

When enabled and Columns is set to 1, the image and content positions will alternate for even-numbered articles.

Vertical alignment

When Columns is set to 1, allows to define the vertical alignment between the image and content on desktop devices.

Top
Center
Bottom

Columns (mobile)

Allows to define the number of articles displayed per row on mobile devices.

Alignment (desktop)

Allows to define the horizontal alignment of article content on desktop devices.

Left
Center
Right

Alignment (mobile)

Allows to define the horizontal alignment of article content on mobile devices.

Left
Center
Right

Space between

When enabled, a space will be added between article blocks.

Rounded corners

When enabled, article block images and cards will have rounded corners.

Content gap

Allows to define the space between elements within an article block.

Small
Medium
Large
Custom

Card options

Options for displaying article blocks with a card-style background, including border, shadow, and color pack settings.

Image

Display

Allows to define how article images will be processed.

Crop
Resize

Dimension

Allows to define the aspect ratio for article images.

Landscape
Portrait
Rectangular
Square

Transition

Allows to define a hover transition effect for article images.

Grayscale on hover
Grayscale on start
Zoom
None

Title

Options for customizing the size, weight, letter spacing, and capitalization of article titles.

Date

Show

When enabled, the article publication date will be displayed on article blocks.

Format

Allows to define how the publication date will be displayed.

Abbreviated (Mar 9, 2025)
Basic (3/9/2025)
Date & Time (March 9, 2025 at 4:05 am)
On Date (on March 9, 2025)
Standard (March 9, 2025)

Text

Allows to define a prefix text displayed before the date, for example "Published on".

Excerpt

Show

When enabled, a text excerpt from the article will be displayed on article blocks.

Truncate type

Allows to define whether the excerpt will be truncated by characters or by words.

Characters
Words

Truncate amount

Allows to define the maximum number of characters or words displayed in the excerpt.

Link

Show

When enabled, a link or button will be displayed on article blocks to take customers to the full article.

Appearance

Allows to define whether the link will appear as a button or as plain text.

Button
Text

Text

Allows to customize the text displayed on the link or button.

Type

Allows to define the button style based on the available color pack options.

Main
Secondary
Tertiary

Outline

When enabled, the button will be displayed in an outlined style instead of filled.

All caps

When enabled, the link text will be displayed in uppercase.

Show arrow

When enabled, an arrow icon will be displayed next to the link text.

Locations

Options for customizing how store locations are displayed across the theme, including in the Contact component, Footer, and Mobile Menu.

Locations to display

Allows to define which locations will be shown to customers.

All Locations
Pickup Locations

Show pickup indicator

When enabled, a label will be displayed next to locations that are available as pickup points.

Pickup text

Allows to customize the text used for the pickup indicator label.

Show emails

When enabled, the email address of each location will be displayed.

Show phones

When enabled, the phone number of each location will be displayed.

Show addresses

When enabled, the physical address of each location will be displayed.

Show addresses as links

When enabled, addresses will be displayed as clickable links that open in Google Maps.

Enable details modal

When enabled, a link will appear next to each location that opens a modal window with additional details.

Modal options

Link text

Allows to customize the text of the link that opens the location details modal.

Show description

When enabled, the location description will be displayed inside the modal.

Description title

Allows to customize the title displayed above the description inside the modal.

Show instructions

When enabled, the location instructions will be displayed inside the modal.

Instructions title

Allows to customize the title displayed above the instructions inside the modal.

Show map

When enabled, a map of the location will be displayed inside the modal.

Cart settings

Options for customizing the cart notification and the Cart Sidebar that appears when a customer adds a product to the cart.

Enable Add to Cart notification

When enabled, a notification will appear on screen each time a customer successfully adds a product to the cart.

Notification position

Allows to define where the cart notification will appear on screen.

Top Right
Bottom Right

Notification - Background color

Allows to define the background color of the cart notification.

Notification - Text color

Allows to define the text color of the cart notification.

Notification - Border color

Allows to define the border color of the cart notification.

Enable Cart Sidebar

When enabled, a sidebar panel will slide in from the side when a customer adds a product to the cart, showing a summary of the current cart contents.

Sidebar title

Allows to customize the title displayed at the top of the Cart Sidebar.

Show icon

When enabled, an icon will be displayed next to the Cart Sidebar title, using the one defined in the theme's Design settings.

Buttons priority

Allows to define which action button in the Cart Sidebar is displayed with higher visual priority.

Checkout
Cart

Proceed to Checkout

Allows to customize the text for the Checkout button in the Cart Sidebar.

Go to Cart

Allows to customize the text for the Cart button in the Cart Sidebar.

Actions text

Allows to define a short informational text displayed above the Cart Sidebar buttons — for example, to inform customers that shipping and taxes will be calculated at checkout. Leave empty if not needed.

Shopping Process

The options here apply to the shopping process pages of the store: Cart, Checkout, Review Order, and Success. They will have an effect across all of them if the Classic checkout version is applied. For stores using the Standard checkout version, these settings will only apply to the Cart page.

Header

Logo

Allows to upload a custom logo for the shopping process pages. If not uploaded, the logo set at Settings > General > Branding will be used. If no logo is available there either, the store name will display.

Logo (mobile)

Allows to upload a different logo version for mobile devices. Only available after a desktop logo has been uploaded.

Height (desktop)

Allows to define the height of the logo on desktop devices.

Height (mobile)

Allows to define the height of the logo on mobile devices.

Appearance

Alignment (desktop)

Allows to define the horizontal alignment of the header content on desktop devices.

Left
Center
Right

Alignment (mobile)

Allows to define the horizontal alignment of the header content on mobile devices.

Left
Center
Right

Color pack

Allows to define the color pack applied to the shopping process pages.

Success page

These texts display on the Success order page (last step). Only applies if you are using the Classic checkout version.

Thank you message

Allows to customize the main thank you message displayed to customers after a successful order.

Show message

When enabled, an additional message will be displayed below the thank you message on the Success page.

Text

Allows to customize the body text of the additional message shown on the Success page.

Link

Allows to define what will be displayed after the message text — an email address or a link to the contact page.

Default Location email
General email
Link to contact page
Don't show anything

Show Order products

When enabled, a summary of the ordered products will be displayed on the Success page.

Customer Forms

Options for customizing the appearance of customer account pages — including Login, Register, and Account details — which are used when customers sign in or manage their account.

Appearance

Alignment (desktop)

Allows to define the horizontal alignment of the form content on desktop devices.

Left
Center
Right

Alignment (mobile)

Allows to define the horizontal alignment of the form content on mobile devices.

Left
Center
Right

Vertical position (desktop)

Allows to define the vertical position of the form content on desktop devices when a background image is set.

Top
Center
Bottom

Vertical position (mobile)

Allows to define the vertical position of the form content on mobile devices when a background image is set.

Top
Center
Bottom

Color pack

Allows to define the color pack applied to customer form pages.

Logo options

Logo (desktop)

Allows to upload a custom logo for customer form pages. If not uploaded, the logo set at Settings > General > Branding will be used. If none is available there either, the store name will display.

Logo (mobile)

Allows to upload a different logo version for mobile devices. Only available after a desktop logo has been uploaded.

Height (desktop)

Allows to define the height of the logo on desktop devices.

Height (mobile)

Allows to define the height of the logo on mobile devices.

Alignment (desktop)

Allows to define the horizontal alignment of the logo on desktop devices.

Left
Center
Right

Alignment (mobile)

Allows to define the horizontal alignment of the logo on mobile devices.

Left
Center
Right

Background image

Image

Allows to upload a background image for customer form pages on desktop devices.

Image (mobile)

Allows to upload a different background image for mobile devices.

Horizontal position (desktop)

Allows to define the horizontal focal point of the background image on desktop.

Left
Center
Right

Horizontal position (mobile)

Allows to define the horizontal focal point of the background image on mobile.

Left
Center
Right

Vertical position (desktop)

Allows to define the vertical focal point of the background image on desktop.

Top
Center
Bottom

Vertical position (mobile)

Allows to define the vertical focal point of the background image on mobile.

Top
Center
Bottom

Overlay options

Show Overlay

When enabled, a semi-transparent overlay will be applied over the background image to improve contrast between the image and the form content.

Overlay opacity

Allows to define the opacity of the overlay. A higher value makes the overlay more opaque, reducing the visibility of the background image.

Custom Overlay color

When enabled, allows to manually define a custom color for the overlay instead of using the default.

Image overlay color

Allows to define the color of the overlay element.

Custom codes

Allows to add any custom code you need to place in specific sections of the theme. This is useful for installing third-party tools such as pop-ups, Google Tag Manager, analytics scripts, chat widgets, and other integrations.

Top `<head>` custom code

Code placed here will be inserted at the very beginning of the <head> tag of your store. Recommended for scripts that need to load as early as possible.

Bottom `<head>` custom code

Code placed here will be inserted just before the closing </head> tag of your store.

Top `<body>` custom code

Code placed here will be inserted at the very beginning of the <body> tag of your store.

Bottom `<body>` custom code

Code placed here will be inserted just before the closing </body> tag of your store. This is the recommended location for most analytics and tracking scripts.

Store Message

This section allows to display a full-page message that blocks the store's front-end, preventing customers from seeing any content or making purchases. Useful for when you need to put your store temporarily on hold without fully disabling it.

Enable message

When enabled, the store message will be displayed to all visitors across all pages.

Brand/Logo

Show

When enabled, a logo will be displayed on the store message screen.

Logo (desktop)

Allows to upload a custom logo for the store message screen. If not uploaded, the logo set at Settings > General > Branding will be used. If none is available there either, the store name will display.

Logo (mobile)

Allows to upload a different logo version for mobile devices. Only available after a desktop logo has been uploaded.

Logo height (desktop)

Allows to define the height of the logo on desktop devices.

Logo height (mobile)

Allows to define the height of the logo on mobile devices.

Title

Allows to customize the main title displayed on the store message screen.

Text

Allows to customize the body text displayed on the store message screen.

Contact details

Show

When enabled, a contact details section will be displayed on the store message screen.

Title

Allows to customize the title displayed above the contact details section.

Contact email

When enabled, the store's contact email address will be displayed.

Email type

Allows to define which email address will be displayed.

Contact — uses the general contact email defined in your store settings.
Location — uses the email address of your default location.

Custom email

Allows to enter a custom email address to display instead of the one from your store settings.

Contact phone

When enabled, the store's contact phone number will be displayed.

Custom phone

Allows to enter a custom phone number to display instead of the one from your store settings.

WhatsApp Number

When enabled, the store's WhatsApp number will be displayed.

Appearance

Line dividers

When enabled, horizontal line dividers will be displayed between the content sections of the store message screen.

Line dividers width

Allows to define the width of the line dividers as a percentage of the available width.

Alignment (desktop)

Allows to define the horizontal alignment of the content on desktop devices.

Left
Center
Right

Alignment (mobile)

Allows to define the horizontal alignment of the content on mobile devices.

Left
Center
Right

Color pack

Allows to define the color pack applied to the store message screen.

Age verification PopUp

Enable the age verification pop up

When enabled, a pop-up will be displayed to all visitors on every page of the store, asking them to verify their age before accessing the content.

Title popup

Allows to customize the question or title displayed on the age verification pop-up.

Content

Allows to add body text to the pop-up, for example a legal notice or additional context for the age requirement.

Accept button

Allows to customize the text for the button customers click to confirm they meet the age requirement. Once clicked, the pop-up will not be shown again to that visitor.

Decline button

Allows to customize the text for the button customers click if they do not meet the age requirement.

Redirect link

Allows to define a URL where customers will be redirected if they click the decline button.

Accept button color

Allows to define the background color of the accept button.

Reject button color

Allows to define the background color of the decline button.

Popup background color

Allows to define the background color of the pop-up window.

Theme translations

These text strings will replace the main text labels used across the theme. If your store has more than one language active, you can translate them in the Languages section of your admin panel.

Shopping actions

Add to cart

Allows to customize the text for the Add to cart button.

Buy now

Allows to customize the text for the Buy now button.

Request quotation

Allows to customize the text for the Request quotation button.

Wishlist

Add to wishlist

Allows to customize the text for the Add to wishlist button.

Remove from wishlist

Allows to customize the text for the Remove from wishlist button.

See my wishlist

Allows to customize the text for the link that takes customers to their wishlist.

Success message added

Allows to customize the confirmation message shown when a product is successfully added to the wishlist.

Success message removed

Allows to customize the confirmation message shown when a product is removed from the wishlist.

Process pages

Cart

Allows to customize the label for the Cart step in the shopping process navigation.

Checkout

Allows to customize the label for the Checkout step when no shipping method is required.

Checkout (shipping required)

Allows to customize the label for the Checkout step when a shipping method is required.

Review order

Allows to customize the label for the Review order step.

Success

Allows to customize the label for the Success step.

Store totals

Order summary

Allows to customize the title for the order summary section.

Estimate shipping costs

Allows to customize the label for the shipping cost estimation option.

Coupon form title

Allows to customize the title displayed above the discount coupon input field.

Coupon form text

Allows to customize the description text displayed inside the coupon form.

Call to actions

Go to Checkout

Allows to customize the text for the button that takes customers to the Checkout step.

Review your order

Allows to customize the text for the button that takes customers to the Review order step.

Place your order

Allows to customize the text for the button that confirms and places the order.

Continue shopping

Allows to customize the text for the button that takes customers back to the store after completing an order.

Review order

These texts display on the Review order page (3rd step of the checkout process).

Contact information

Allows to customize the title for the contact information section on the Review order page.

Shipping information

Allows to customize the title for the shipping information section on the Review order page.

Shipping same as Billing

Allows to customize the text displayed when the billing and shipping information are the same.

Billing information

Allows to customize the title for the billing information section on the Review order page.

Additional information

Allows to customize the title for the additional information section on the Review order page.

Sharing

These texts display on Sharing components across the theme.

Allows to customize the prefix text displayed when sharing content via WhatsApp.

Copy to Clipboard

Allows to customize the text for the Copy to Clipboard sharing option.