Find some JSON Pre-built Theme Examples here.
Type telling code which functionality it needs to apply to a single child object.
Possible Types:
-[any custom type name such as cards or quick_add]
-product (for Product Details section)
-cart_drawer (for Cart Drawer)
-cart (for Cart Page)
-Any type that includes cart in type name, have additional keys: Item_root, target_total, target_total_html
Root is a selector for elements where all is happening, for example if you have cart_drawer, as a root it will be a selector for cart_drawer element or section that includes all header, items and footer (with totals) of the cart drawer.
Example:
"cart_drawer": {
"type": "cart_drawer",
"root": " #CartDrawer",…
Is an html with slashes (helper for html slashes) that will replace the target element on the page. Click on the link and paste your code there. After that click 'Add slashes' and it will add slasher to your code that is ready to be used.
Example:
This key can use HTML and Liquid to render dynamically variables.
template - define on which template\s it will be applied with comma separated.
skip_template - define which template\s it will be skipped with comma separated.
path - define on which url path\s it will be applied with comma separated.
skip_path - define which path\s it will be skipped with comma separated.
This is a specific key that is used for discount_input and says which method will be applied for the integration element in the document. The method key will apply single or multiple ways for display input with comma separated. Available methods: before, after, prepend, append.
Used for declaring a single item selector in the cart keys.
Used for updating totals in the cart keys.
target_total - is an selector for element where totals in the cart are displayed
target_total_html - is an html with liquid that is used to replace target_total element with an updated version of it with correct displayed totals.
Specific cases, this key is used for elements that are added using javascript in the code, like quick_add, quick_shop, etc…To use that you can define “event name” as a subscribe value, and later in the theme code call that event to fire at the right moment, for example when quick_add popup is added and opened.
Example:
"quick_add": {
"type": "quick_add",
"skip_template": "cart, product",
"subscribe": "quick_add",
…
And later in the code you can use AdsGun._publish(‘quick_add’); to apply changes for it.