Kickflip runs on your BigCommerce storefront through a single script. This article explains what it does, how to reinstall it, and what it changes on your pages. You don't need to edit your theme's code: the script works on any Stencil theme.
Where the script lives
When you install the Kickflip app, Kickflip automatically adds a script named Kickflip to your store's Script Manager. BigCommerce then loads it on every page of your storefront.
Property | Value |
Name | Kickflip |
Location | Head |
Pages | All pages |
Loading | Deferred: it loads after your page content, so it doesn't slow your pages down. |
Category | Essential: it loads even when visitors decline cookies, since your customizable products can't be bought without it. |
Because the script lives in the Script Manager and not in your theme files:
It keeps working when you change or update your theme.
BigCommerce removes it automatically if you uninstall the Kickflip app.
All your integration settings are loaded live from Kickflip. When you click Save in the Kickflip dashboard, your storefront is updated right away, with nothing to republish.
On every page, the script:
Checks whether the page is a product page and, if so, whether the product is customizable (see How Kickflip recognizes customizable products).
On customizable product pages, adds the customizer according to your integration settings.
On every page, adapts the customized products shown in your cart and mini cart.
Reinstalling or removing the script
The script is installed automatically, so you shouldn't need to install it yourself. If it was removed, for example deleted from the Script Manager, you can reinstall it in one click:
In your BigCommerce admin, go to Apps › My apps and open Kickflip.
In the Script card, the status shows UNINSTALLED. Click Install script.
The status changes to INSTALLED and the integration settings appear below.
CAUTION
Always install the script from the Kickflip dashboard. Don't add it by hand in the Script Manager: Kickflip wouldn't recognize it, and the dashboard would keep showing it as UNINSTALLED.
Removing the script
To turn Kickflip off on your storefront, click Remove script in the Script card. Your connection to Kickflip, your products and your settings are kept, and you can reinstall the script at any time.
CAUTION
Without the script, the hidden Kickflip options (Design ID, Design Token, Design Image, Design Summary) become visible on your customizable products, and customers can no longer add them to the cart. Hide those products on your storefront before removing the script.
How Kickflip recognizes customizable products
The script only activates the customizer on product pages of products connected to Kickflip. On each page, it:
Recognizes a product page using the product information that Stencil themes include on every product page.
Reads the product ID from the page's add-to-cart form.
Asks Kickflip whether this product is connected to a customizer. If it is, Kickflip returns the customizer to display, your integration settings and the price conversion for the currency the customer is shopping in.
If the product isn't connected to Kickflip, the script does nothing and the page stays as it is.
IMPORTANT
If your theme has been heavily modified and the customizer doesn't appear on a connected product, the add-to-cart form may have been changed.
What the script changes on your storefront
On customizable product pages
Depending on the integration mode you chose:
Mode | What the script adds | What the script hides |
Customize button | A Customize button next to your Add to Cart button, and the popup that opens the customizer. | The Add to Cart button, the product options and the quantity field. |
Customizer only | The customizer, directly in your product page. | The content of the main product section, which the customizer replaces. |
With advanced mode on, the script uses the elements you selected instead and only hides the ones you listed.
The customizer opens in your storefront's language and currency, and its prices are converted with your BigCommerce exchange rates.
When a customer clicks Add to cart in the customizer, the script adds the product to the BigCommerce cart with its design and the right price, then takes the customer to the cart page.
If your customizer lets customers request a quote, they see a confirmation once their request is sent. Clicking Keep shopping in that confirmation takes them back to your home page.
In your cart and mini cart
For each customized product, the script:
Replaces the product image with the customer's design.
Shows the design summary instead of the hidden Kickflip options.
Hides the option Change link.
Updates the product link so it brings the customer back to the product page with the customizer reopened on their design.
Reopening a design
When a product page is opened with a design in its link, for example from the cart or a shared design, the script loads the customizer directly on that design. In Customize button mode, the modal opens automatically once the page has loaded.
Troubleshooting
The customizer doesn't appear anywhere on my storefront
In the Kickflip dashboard, check that Script is INSTALLED. If it's UNINSTALLED, click Install script.
The script is installed but the customizer doesn't appear on a product
Make sure the product is connected to Kickflip and visible on your storefront (see Making your products visible on your storefront). If it still doesn't appear, try advanced mode.
