Global Theme Settings (Covent Garden)
In your control panel, go to Storefront > Themes, and click the blue "Customize" button to launch Theme Editor. In the left hand column of the Theme Editor, click the panel labelled 'Global Theme Settings'
Global Container Width
You can easily control the maximum container width for the entire site with this field. Set up the value with a number only, correlating to the maximum width in pixels, i.e.
This will limit the width of the main page container on large screens to whatever value you set.
We have developed a module that can link products to blog posts and list them in an article, and link related blog posts to product pages. To enable this feature, check the option in Theme Editor.
Linking Products to Articles
Our module allows you to include a shoppable list of products to the end of your blog article. This is useful if you want to write about product recommendations or review and compare products you sell.
Setting Up The Product List
To set up linked products in a blog post, you can do so by adding a tag on the blog post edit screen in your BigCommerce control panel, that begins
RP: followed by the ID of a product you want to link.
RP:90 will link the product with the ID of 90 to the post on the frontend.
Include further products by delimiting the ID's with colons, i.e.
RP:77:78:90. This will pull product ID's 77, 78 and 90 into the post when rendered on the frontend.
These special tags will not appear in the blog post tags section on the frontend.
To find the ID of a product in your BigCommerce control panel, search for a product you want to link and edit it. In your browser's address bar you will see the following:
XXX will equal the product ID.
Adding Extra Content to the Related Product
You can pull related content into the product listings that have appeared in your blog post by setting up a custom field on the product edit screen in your store control panel. In the custom fields tab, create a new custom field with the label
Blog Post Description (the label is case sensitive), and assign the value field content that you would like to display on the listing. Note that there is a 256 character limit on custom field values. This may include HTML.
Linking Articles to Products
You can add a featured blog post to a product page with our Editorial Commerce module. This is useful if the product has been featured in one of your articles and you want to give your customers further insight into the product, while keeping them on your site.
Linking the Article
To include a related blog article on a product page, in your control panel set up a custom field on the product with the label
Related Content. Note that the label is case sensitive. In the value, paste the URL of the related blog post. Note that you must be using the blog on your BC site, not an external blog. Note that you are limited to 256 characters.
You can either enter the full URL, i.e.
https://www.yourstore.com/blog/article-title/ or the absolute path, i.e.
/blog/article-title/ (note the leading
Both the "Related Content" and "Blog Post Description" fields will not show up in the "extra details" section of the product page.
Animate Page Elements
Turn this option on to activate animations on scroll. This subtly slides and fades in elements as you scroll down the page.
Consider how many products you will display if you enable infinite scrolling or set a large number of products to display on your category pages, this module could potentially cause performance issues on older devices and browsers.
We recommend using this feature this on smaller catalogs. If you notice any performance issues, disable this feature.
Conversion Optimization Mode
Enabling this option overrides all other settings with our recommended settings to optimize for conversions. Currently this hides social sharing links on the product page and removes tabs (if the theme supports them).
As our CRO team continue to find proven methods of increasing conversions, we will bring in more features to this mode.
If you have set up options that change the price of a product, enable this option to show the range of prices it can be purchased for on the product grid.
Price ranges work on SKUs, not Rules, so to have the range of prices show you need to give your product options a SKU (even if you won't be displaying it on the front end).
Restrict Purchase to Login
Enabling this option will hide prices and add to cart buttons until your customers sign in to the website.
Here you can choose to display or hide the breadcrumb trail on small screens. We recommend hiding them on mobile devices as they can take up a lot of space at the top of the screen if they flow over more than one line.
Enable custom store and checkout CSS to add overrides and additional CSS without having to edit your theme files. This allows you to use the master copy of the theme and still benefit from updates.
These files are loaded last so override all built in styles.
Before activating, you will need to create files named
checkout.css locally. These correspond to the two options in the settings panel. You will need to upload these files via WebDAV to your store. Inside the
Content folder, create a new directory called
css, and upload your new CSS files to this location.
Developer custom CSS is an option used by Flair when setting up paid customizations.