web
You’re offline. This is a read only version of the page.
close
Checkmark

Thank you for your feedback

Sambee theme variables

Learn about the different variables used when you select Sambee in the Theme Manager for Merchant Solutions stores.

Article ID: SLN29122

Note: A new feature in Variables and all Edit pages will let you filter variables by name, making it easier to find them. Learn more.

Note: The Company-name-text variable is not used in Theme Manager-based themes.

Important: Some variables will not be visible until you enable the Advanced Editor toolbar. Learn how.

Global

Store Properties

Header

Tag Manager

Navigation Links

Product Text

Body Contents

Home Page Contents

Image Dimensions

Footer

Page-width-css - Enter an initial width for the body of your store pages (default 1200px).

Compound-name - Use the drop-down menu to select yes or no. When Compound-name is set to Yes, then your accessory items will have their Names displayed in the shopping cart and on the Order Form.

Micro-data-enabled - Choose whether to output HTML microdata on your store pages. Search engines and web crawlers can optionally use this data to present a richer browsing experience.

Show-section-order-buttons - Choose whether or not to display order buttons on section pages.

Store-domain - Your primary store domain (e.g. widgetdesigns.com). This value is used in your HTML microdata, if enabled.

Customer-registration-color - Enter or select a color for the links (e.g. log in, register) associated with the customer registration functionality.

Search-button-image-height-css - Enter a value to specify the CSS height of your search button image.

Search-button-image-width-css - Enter a value to specify the CSS width of your search button image.

Search-category-background-color - Enter a value to specify the background color of the category dropdown in your search area, if enabled.

Search-placeholder - Enter text to display in your search input area.

Header-text-color - Enter or select a color for text appearing in your header.

Search-button-image - Click Upload to upload an image to be used as the button to conduct a search.

Menu-icon - Click Upload to upload an icon to open the menu displayed for mobile devices.

Name-image-height-css - Enter a value to specify the CSS height of your store logo, if desired.

Show-order-icon - Click Upload to upload an image to be used to display the current cart, or to move to the cart page, depending on your Floating Cart configuration.

Tag-manager-enabled - Enable or disable Tag Manager. Learn more.

Tag-manager-head - Enter your Google Tag Manager Head code. Learn more.

Tag-manager-body - Enter your Google Tag Manager Body code. Learn more.

Search-button-text-color - Enter or select a color for the text appearing in your search button.

Search-input-line-height-css - Enter a value to specify the height of the search input area in your header (default 32px).

Main-navigation - If you would like to limit your main navigation to specific sections you can enter their IDs here. This can be useful for stores that have a large number of sections in the Contents field of the home page but do not wish to have multiple lines in the main navigation.

Main-navigation-bottom-border-color - Enter or select a color for the bottom border of your navigation menu.

Main-navigation-hover-color - Enter or select a color for the links in your navigation bar when the shopper hovers over them.

Main-navigation-link-color - Enter or select a color for the links in your navigation bar

Megamenu-image-border-color - Enter or select a border color for the images displayed in your navigation drop down menus. These images are pulled from the 'Icon' field of the top-level section.

Megamenu-image-size - Enter a value to specify the width and height of the images displayed in your navigation drop down menus. These images are pulled from the 'Icon' field of the top-level section (default 240).

Megamenu-link-color - Enter or select a color for the links within your navigation pull-down menus (if tiered-navigation is enabled).

Regular-price-color - Enter or select a color for an item's price.

Regular-price-color Enter text to appear before the regular price amount (such as Regular price or Retail price). Note:Only appears when an item also has a sale price.

Sale-price-color - Enter or select a color for an item's sale price.

Nav-ribbon-color - Enter or select a background color for the area of the page header where the navigation menu appears.

Tiered-navigation - Choose whether to use dropdowns displaying additional section pages in your main navigation.

Alt-image-border-color - Enter or select a border color for additional product images.

Alt-image-border-hover-color - Enter or select a border color for additional product images when the shopper hovers over them.

Back-to-top - Click Upload to upload an image the shopper can click or press to return to the top of the page. Breadcrumbs-link-color = Enter or select a color for breadcrumbs links.

Breadcrumbs-link-color - Enter or select a color for breadcrumbs links.

Breadcrumbs-separator - Enter a character to be used as the separator between breadcrumb links (default is /).

Breadcrumbs-text-color - Enter or select a color for the text portion of breadcrumbs (typically the shopper's current location).

Cross-sell-border-color - Enter or select a border color for your cross-sell recommendations.

Default-product-image - Click Upload to upload an image to be displayed on items by default if they do not have one provided. Note: You can add additional product images by following these steps.

Html-above-footer - Enter text or FTML content here to appear immediately above the footer on your home page.

Maximum-breadcrumb-depth - Enter a value for the maximum number of links to display in your breadcrumb navigation (default 5).

Product-image-border-color - Enter or select a color for a border around your product images.

Page-title-line-height - Enter a value to specify the height of the line where the section or item title is displayed (default 30px).

Product-page-heading-color - Enter or select a color for the heading of your product description area.

Product-page-heading-inner-background-color - Enter or select a color to be used in the background of the product description heading.

Product-page-heading-outer-background-color - Enter or select a color to be used for the ribbon to the right of the product description heading.

Section-item-border-color - Enter or select a color for a border around your product images.

Section-title-color - Enter or select a color to be used for the text of the category (section) page headlines.

Section-title-text-size - Enter the font size for the text of the category (section) page headlines.

Zoom-image - Click Upload to upload an image for the zoom indicator that appears below product images.

All Fancybox variables are required for a Fancybox image zoom. Learn more.

Favorites - Add space separated section IDs here to display them immediately below your home page banner/carousel.

Favorites-title - Enter a title for your favorites row.

Featured-brands - Add space separated section IDs here if you have brand specific sections you'd like to display at the bottom of the home page in a scrollable row.

Featured-brands-heading - Enter a title for your brand scroller.

Featured-brands-image-height - Enter a value for the height of the images for your brands scroller.

Featured-brands-image-width - Enter a value for the width of the images for your brands scroller.

Featured-categories - Add space separated section IDs here to display them on your home page immediately below your Favorites, if specified. This row of product categories can also display a larger kicker image when uploaded to Featured-categories-kicker.

Featured-categories-border-color - Enter or select a color for the border around your featured categories on the home page.

Featured-categories-hover-color - Enter or select a color for the border around your featured categories on the home page when the shopper hovers over them.

Featured-categories-link-color - Enter or select a color for the link to your sections in the featured categories row.

Featured-categories-image-height - Enter a value for the height of the images in the featured categories section of your home page.

Featured-categories-image-width - Enter a value for the width of the images in the featured categories section of your home page.

Featured-categories-kicker - Click Upload to upload an image to be displayed in your featured categories row, if configured.

Featured-categories-kicker-id - Enter an item ID to link to from the image uploaded to the Featured-categories-kicker variable.

Featured-categories-kicker-height - Enter a value for the height of the image uploaded to the Featured-categories-kicker variable, if any.

Featured-categories-kicker-width - Enter a value for the width of the image uploaded to the Featured-categories-kicker variable, if any.

Featured-categories-title - The title for the featured categories section on your home page, if specified.

Kicker-alt-text1 - Enter text to display when the shopper hovers over the image uploaded to Kicker-image1.

Kicker-alt-text2 - Enter text to display when the shopper hovers over the image uploaded to Kicker-image2.

Kicker-link1 - Enter a URL to take the shopper to when they click on the image uploaded to Kicker-image1.

Kicker-link2 - Enter a URL to take the shopper to when they click on the image uploaded to Kicker-image2.

Kicker-image1 - Click Upload to upload an image to appear below your hero banner on the home page. You can specify a URL to link this image to with the Kicker-link1 variable.

Kicker-image2 - Click Upload to upload an image to appear below your hero banner on the home page. You can specify a URL to link this image to with the Kicker-link2 variable.

Slider-button-height-css - Enter a value for the CSS height of the 'Slider-left' and 'Slider-right' images used in home page navigation.

Slider-button-width-css - Enter a value for the CSS width of the 'Slider-left' and 'Slider-right' images used in home page navigation.

Slider-left - Upload an image to be used for carousel and featured category navigation.

Slider-left-hover - Upload an image to be used when the shopper hovers over carousel and featured category navigation.

Slider-progress-dot - Upload an image to be used in carousel navigation.

Slider-progress-dot-active - Upload an image to be used in carousel navigation indicating the currently displayed image.

Slider-progress-dot-height-css - Enter a value for the CSS height of the home page carousel navigation dots.

Slider-progress-dot-width-css - Enter a value for the CSS width of the home page carousel navigation dots.

Slider-right - Upload an image to be used for carousel and featured category navigation.

Slider-right-hover - Upload an image to be used when the shopper hovers over carousel and featured category navigation.

Testimonials - Enter text or HTML content here to appear in the 'Testimonials' module on your home page, if configured.

Testimonials-background-color - Enter or select a color for the background of your Testimonials module.

Testimonials-color - Enter or select a color for the text within your Testimonials module.

Testimonials-title - Enter a title for your Testimonials module.

Testimonials-title-background-color - Enter or select a color for the background of the title portion of your Testimonials module.

Testimonials-title-color - Enter or select a color for the title of your Testimonials module.

Section-image-height - Enter a value for the height of the main image associated with your section pages.

Section-image-width - Enter a value for the width of the main image associated with your section pages.

Footer-box1 - Enter text or HTML for a column in your footer.

Footer-box2 - Enter text or HTML for a column in your footer.

Footer-box3 - Enter text or HTML for a column in your footer.

Footer-box4 - Enter text or HTML for a column in your footer.

Footer-additional-content -  Enter text or HTML to display between other footer content and copyright text.

Social-channels - Enter text or HTML to appear below the newsletter signup in your footer (used to display social channels in Theme preview).

Newsletter-background-color - Enter or select a color for the background of the email input field in your footer.

Newsletter-border-color - Enter or select a color for the border of the email input field in your footer.

Newsletter-icon - Upload an image to be displayed next to the newsletter prompt.

Newsletter-icon-alt-text - Enter text to be used as the 'alt-text' for your newsletter icon.

Newsletter-prompt - Enter text or HTML to display above the newsletter input in your footer.

Newsletter-social-background-color - Enter or select a background color for the footer ribbon where the newsletter signup appears.

Newsletter-social-text-color - Enter or select a color for the text that appears on the newsletter signup ribbon.

Newsletter-submit-background-color - Enter or select a color for the background of the submit button for the newletter signup form in your footer.

Newsletter-submit-background-image - Click Upload to upload an image to be used as the submit button for the newsletter signup form in your footer.

Newsletter-submit-image-height-css - Enter a value for the CSS height of the image provided in the Newsletter-submit-background-image variable.

Newsletter-submit-image-width-css - Enter a value for the CSS width of the image provided in the Newsletter-submit-background-image variable.

Newsletter-submit-text - Enter text to appear on the submit button for the newsletter signup form in your footer.

Newsletter-submit-text-color - Enter or select a color for the text on the submit button for the newsletter signup form in your footer.

Note: When a shopper signs up for a newsletter, their email address will be automatically added to a mailing list. Learn more.

See Also: