Valiant BigCommerce Theme Manual

Valiant BigCommerce Theme is a multi-purpose theme that can be used for any type of online store. We have created 3 different variants for different types of industries. Valiant theme is tested by bigcommerce and Built with Stencil framework, latest version, and update to date. Compatible with BigCommerce latest version.

Valiant theme also supported various features of bigcommerce like mobile friendly, Schema data, Various applications supported, Page builder, Theme editor, Sidebar, Mega menu, Carousels, Newsletters, banners etc. We have tried to help our client with the documentation with a detailed explanation.

Theme Settings & Customization

This document contains all customization options for the Valiant theme. For other settings, please refer to the Cornerstone Theme Documentation.

Header & Footer

Go to Storefront > My Themes in your control panel and click the blue Customize button to launch Theme Editor.

On the left-hand side of the Theme Editor, click on the Header & Footer

Header Pencil Banner

Hide Pencil Banner: If checked, it will hide the top marketing banner, i,e.free shipping on orders over $150.

Pencil Banner Text: Add text for the pencil banner. Here, Free shipping on orders over $150.

Pencil Banner Link Text: Add link text for the pencil banner. Here, Shop Now.

Pencil Banner Link: Add link for the pencil banner.

Pencil Banner Text Color: Add text color for the pencil banner.

Pencil Banner Background Color: Add background color for the pencil banner.

Logo Position: Aligns the logo left, center or right.

Logo Center View :

Pet

GYM

CBD

Logo Left View :

Pet

GYM

CBD

Logo Right View :

Pet

GYM

CBD

Header Style

Header Style: Set header style Normal or Sticky.

Header Background color: Add background color for the header.

Show Compare: If checked, it will show the compare button in the header.

Dropdown menu display mode: Change Dropdown menu display Mode Simple or Alternate.

Simple Design:

Alternate Design:

Navigation Menu Design:Set Navigation Menu design Simple or Compact.

Simple Design:

Compact Design:

Search Suggestion

Manage Suggestion Text: To change Suggestions, go to channels > Themes > Advanced > Edit Theme Files > lang > en.json and update text in quick-suggestion-1 to quick-suggestion-10

Suggestions Code Generator:

See the Pen Quick Search Suggestion - Code Generator by bigcommerce_ditindia (@bigcommerce_ditindia) on CodePen.

Show Storefront Selector: If checked, it will show the storefront selector in the header.

Cart Counter Background Color: Add background color for the cart counter.

Header Cart Icon Color: Add color for the cart icon.

Pet

GYM

CBD

Show Theme by: If checked, it will show the theme by in the footer.

Show Brands: If checked, it will show the brands in the footer.

Show Pages: If checked, it will show the pages links in the footer.

Show Categories: If checked, it will show the categories links in the footer.

Show Newsletter Popup: If checked, it will show the newsletter popup.

Newsletter Popup Image: Add Image file for the newsletter popup.

Show Copyright: If checked, it will show the copyright in the footer.

Copyright Background Color: Add background color for the copyright.

Copyright Text Color: Add text color for the copyright.

Show Blog: If checked, it will show the blog link in the footer.

Footer Blog Link: Add blog link to redirect to the blog page.

Footer Email: Add email address.

Footer Link Color: Add footer Link color.

Footer Link Hover: Add footer link hover color.

Home Page

Go to Storefront > My Themes in your control panel and click the blue Customize button to launch Theme Editor.

On the left-hand side of the Theme Editor, click on Home Page

Category Section

Pet

GYM

CBD

Show Custom Category Section: If checked, it will show the Category Section.

Common Settings for all categories:

Category Title Color: Add Category Section Title Color.
Category Button Color: Add Category Section Title Color.
Category Background Color: Add Category Section Title Color.
Category Description Color: Add Category Section Description Color.
Category Link Text: Add Category Link Text i.e. “Shop Now”.

Settings for each category:

Category Image: Add Category Image file.
Category Title: Add Category Title.
Category Description: Add Category Description.
Category Link: Add Category Link to redirect to the category page.

Add above details for all categories.

Featured Products Section

To Customize Featured Product Section Title and Subheading, Go to Channels > Themes > Advanced > Edit Theme Files > lang > en.json and update text in "featured" and "featuredsubheading"

Code Generator for Featured Product Section Title and Subheading:

See the Pen Featured Section - Code Generator by bigcommerce_ditindia (@bigcommerce_ditindia) on CodePen.

Most Popular Products Section

Pet

GYM

CBD

Show Custom Most Popular: If checked, it will show the Custom Most Popular Products section. If unchecked, it will show the default Most Popular Products section.

Custom Most Popular Section Settings:

Most Popular First Image: Add image file.

Fist Section One ProductID: Add first Product ID.

Fist Section One Top Position: Add first section one Product top position.

Fist Section One Left Position: Add first section one Product left position.

Follow the same steps for all products. Maximum 6 products can be added per set.

Maximum 3 sets can be added in Most Popular Products section.

Most Popular Products Custom View Settings

To Customize Most Popular Product Section Title and Subheading, Go to Channels > Themes > Advanced > Edit Theme Files > lang > en.json and update text in "customtop" and "customtopsubheading"

Code Generator for Most Popular Product Section Title and Subheading:

See the Pen Custom Top Section - Code Generator by bigcommerce_ditindia (@bigcommerce_ditindia) on CodePen.

Brands Carousel

Pet

GYM

CBD

Show Brands Section: If checked, it will show the Brands Section.

To Customize Brands Section Heading, Subheading and Brand Images and Links, Go to Channels > Themes > Advanced > Edit Theme Files > lang > en.json and update text in "brandsection", "brandsubheading", "brandimage" and "brandlink".

Refer Image Upload to upload brand images and add image path in "brandimage".

Code Generator for Brands Section Heading, Subheading and Brand Images and Links:

See the Pen Brand Section - Code Generator by bigcommerce_ditindia (@bigcommerce_ditindia) on CodePen.

About Us Section

Pet

GYM

CBD

Show About Us Section: If checked, it will show the About Us Section.

About Us Image: Add image file.

To Customize About Us Section Heading, Text and Read More Text & Link, Go to Channels > Themes > Advanced > Edit Theme Files > lang > en.json and update text in "AboutUsSection"

Testimonial Section

Pet

GYM

CBD

Show Testimonial Section: If checked, it will show the Testimonial Section.

Testimonial Background Color: Add Testimonial Background Color.

Testimonial Text Color: Add Testimonial Text Color.

To Customize Testimonial Section Heading, Subheading and Review Text, Go to Channels > Themes > Advanced > Edit Theme Files > lang > en.json and update text in "testimonial"

Category Page

Sub Categories

Show Sub Category: If checked, it will show the sub categories on the category page.

Category Products View

Grid View: 2, 3, 4 and 5 Columns view options are available.

2 Columns View:

3 Columns View:

4 Columns View:

5 Columns View:

List View:

Category Page Side Banner: Add Image file for the sidebar banner.

Products

Offer Text

PDP Offer Text: Add Offer Text for the product page.

PDP Offer Link: Add Link to redirect when the Details is clicked.

Add To Cart Style

Add To Cart Style: Select style of Add to Cart box for fixed or Normal. If Fixed is selected, the Add to Cart box will be sticky to the top of the page.

Description Tab Design

Pet

GYM

CBD

To add description in the same style, use the following HTML structure(copyable code):

See the Pen Valiant - PDP Description Design Layout by bigcommerce_ditindia (@bigcommerce_ditindia) on CodePen.

Side Related Products: If checked, it will show the related products on the right side of the product page below the add to cart box.

Checkout

Show Header & Footer: If checked, it will show the header and footer in the checkout page same as the site pages.

Pet

GYM

CBD

Recommended Image Dimension

Valiant Pet Variant

Logo Size

250px X 60px

Hero Carousel Image

1920px X 770px

Category images

Top 3 Images: 580px X 580px

Bottom 2 Images: 895px X 580px

Most Popular Image

1640px X 690px

Brand Images

127px X 86px

About Us Image

830px X 550px

Testimonial Image

60px X 60px

Subcategory Image

166px X 166px

Product Image

1280px X 1280px