Preface
Categories by BTP relies on installing a set of snippets into your theme. Whenever you enter the app, you will notice a tab on the right hand side titled Install/Update/Repair Status with an indicator that can be one of three colors:
Green: All snippets are up to date
Yellow: One or more of your snippets are out of date or have been changed
Red: One or more of your snippets are not installed
If the indicator is anything but green, we recommend clicking on the tab and deploying the snippets either by clicking the Deploy button under Actions or clicking the Deploy All button at the bottom.
Two of the snippets are ones that are generated automatically when you deploy your categories and cannot be manually uploaded: btp-categories-data.liquid and btp-categories-tree.liquid.
btp-categories-data.liquid
This snippet is the heart of Categories by BTP. It is the data blob that stores your category structure and it is what the app reads when launched in order to display what your current category structure looks like.
This snippet is automatically generated when you deploy your categories and cannot be manually uploaded.
You do not need to include this snippet anywhere.
btp-categories-tree.liquid
This snippet contains your storefront tree and is what you include in your theme wherever you would like your tree displayed. It automatically changes styles based on the style you select in the Settings tab. If you have a large set of categories, there may be several other btp-categories-tree-<number>.liquid in your theme that all get included in the btp-categories-tree.liquid so you only have to include this snippet to see your tree in your storefront:
{% include 'btp-categories-tree' %}
This snippet includes a combination of HTML, CSS, JavaScript, and Liquid. If you need to modify the way this structure looks and are brave enough to try, you may do so in the Settings tab under Advanced Features > Storefront Tree Generation Snippet. More on this in
here .
This snippet is automatically generated when you deploy your categories and cannot be manually uploaded.
btp-categories-style.scss.liquid
This snippet contains the CSS that themes your tree to match your selected style. We do not recommend modifying this file manually. If you ever need to change the way your tree looks, we recommend including a separate CSS asset, overriding the various classes as described here.
You do not need to include this snippet anywhere.
btp-categories-settings.liquid
This snippet contains the settings you select in the Settings tab for when the app needs to check them on the fly for your storefront. Although this snippet gets automatically updated every time you change your settings, it allows you to manually upload it if this automatic process fails for one reason or another.
You do not need to include this snippet anywhere.
btp-categories-functions.liquid
This snippet contains various functions used internally in the app. You will most likely not need to use any of the functions in this file.
You do not need to include this snippet anywhere.
btp-categories-collectionbreadcrumbs.liquid
This snippet generates breadcrumbs based on your categories for your collection pages. It should be included on collection pages only:
{% include 'btp-categories-collectionbreadcrumbs' %}
btp-categories-productbreadcrumbs.liquid
This snippet generates breadcrumbs based on your categories for your product pages. It creates breadcrumbs back to the product's "main" collection. More on this
here . It should be included on product pages only.
{% include 'btp-categories-productbreadcrumbs' %}