Adding Custom Scripts to Stencil Themes

Many third-party applications and services rely on the ability to inject custom scripts into a website’s footer in order to function. With Stencil, BigCommerce has made adding these scripts as easy as copying and pasting them into your control panel. 

Using the Scripts Box

The box under the Scripts tab injects code into the theme's footer. This makes the script available on every pages which is ideal for some app integrations such as live chat or SSL Trust Seals. Multiple scripts can be added to the box. To add more than one script, you can paste them below any other saved scripts.

1. Copy the script provided by the third-party app or service.

2. Go to Storefront Design › Design Options , then click the Scripts tab.

3. Paste the script into the text area labeled Footer, then click Save.

Scripts tab in Design Options

 

Can I add custom code outside of my site’s footer? It is possible to paste code in other template files using Edit Theme Files. Keep in mind that the script may not be compatable with the Stencil framework. For further assistance check out our BigCommerce Partner Directory or ask your question in the BigCommerce Community Ask a Design Partner Group.

Handlebars in Stencil Footer

In addition to HTML and custom scripts, you can paste the templating language Handlebars into the footer of Stencil themes. This allows for more robust customizations.

Handlebars is a templating language used to develop and customize Stencil themes. For example, you can use Handlebars to reference theme-wide variables like your store’s name or logo. Third-party apps could use Handlebars to reference customer information, in order to display loyalty offers specific to the person logged in.

To learn more about using Handlebars in Stencil themes, see our developer documentation on Developing with Handlebars.

Analystics and Conversion Tracking Scripts

Analytics and conversion tracking scripts are usually added to the header or checkout. The following articles detail how to add these scripts to your store.

 

Go to Design Options in my store

Additional Resources

Was this article helpful?