You may see following error on your storefront if the file is missing:
Liquid error: Could not find asset snippets/sc-quantity-break.liquid
Liquid error: Could not find asset snippets/sc-quantity-break-tpls.liquid
Two (2) liquid files are:
sc-quantity-break.liquid
sc-quantity-break-tpls.liquid
Step A: Instruction for sc-quantity-break.liquid this file:
Create a new snippet called sc-quantity-break.liquid and insert the following script/codes in this file
<script> var sc_qb_script_2017210342=""; var store_money_format="{{shop.money_format}}"; var sc_qb_settings=JSON.parse({{shop.metafields.QBGroups.QBSettings | json}}); </script> {% if sc-quantity-break == 'sc-qb-product-script' %} <script> sc_qb_script_2017210342="sc-qb-product-script"; </script> <script type="text/javascript" src="/apps/quantity-break/assets/modules/app-premium/js/main.js" ></script> {% include "sc-quantity-break-tpls" %} <script> var has_app_js_loaded=false; var selected_variant = {{product.selected_or_first_available_variant | json}}; //var selected_variant_id={{product.selected_or_first_available_variant.id}}; //var selected_variant_id=null; var sc_qb_curr_product_str_metafields={{product.metafields.QBGroups.QBGroup | json}}; var sc_qb_curr_variants_str_metafields={}; {% for v in product.variants %} sc_qb_curr_variants_str_metafields["{{v.id}}"]={{product.variants[forloop.index0].metafields.QBGroups.QBGroup | json}}; {% endfor %} //console.log(sc_qb_curr_variants_metafields); function SC_QB_On_Variant_Select(variant){ //var obj={{product.selected_or_first_available_variant.metafields.QBGroups.QBGroup | json}}; //console.log(obj); //console.log(variant); selected_variant=variant; //selected_variant_id=variant.id; if(has_app_js_loaded){ process_qb_grid(); } } function process_qb_grid() { console.log(has_app_js_loaded); has_app_js_loaded=true; //console.log(selected_variant_id); if(selected_variant==null) return; var selected_variant_id=selected_variant.id; var sc_str_qb_prod_var_group=null; if(sc_qb_curr_product_str_metafields!=null) { sc_str_qb_prod_var_group=sc_qb_curr_product_str_metafields; } else { if(sc_qb_curr_variants_str_metafields.hasOwnProperty(selected_variant_id)) { sc_str_qb_prod_var_group=sc_qb_curr_variants_str_metafields[selected_variant_id]; } } ScJQuery_Qbreak('#div-sc-qb-2017210342').html(''); if(sc_str_qb_prod_var_group==null) { return; } //sc_str_qb_prod_var_group = {{product.metafields.QBGroups.QBGroup | json}}; var sc_qb_prod_var_group=ScJQuery_Qbreak.parseJSON(sc_str_qb_prod_var_group); //console.log(sc_qb_prod_var_group); //var sc_qb_settings=ScJQuery_Qbreak.parseJSON({{shop.metafields.QBGroups.QBSettings | json}}); //console.log(sc_qb_settings); var qb_data={calc_type:sc_qb_prod_var_group.calc_type, price_tiers:sc_qb_prod_var_group.price_tiers, base_price:parseFloat(selected_variant.price/100) }; var qb_price_tiers=calculate_qb_prices_discounts(qb_data); console.log(qb_price_tiers); if(sc_qb_prod_var_group.tpl_display!='custom') { var tpl_style = __sc__.template(ScJQuery_Qbreak('#tpl_sc_qb_tbl_style_2017210342').html()); ScJQuery_Qbreak('#div-sc-qb-2017210342').append(tpl_style({sc_qb_settings:sc_qb_settings})); var tpl = __sc__.template(ScJQuery_Qbreak('#tpl_'+sc_qb_prod_var_group.tpl_display+'_2017210342').html()); ScJQuery_Qbreak('#div-sc-qb-2017210342').append(tpl({qb_price_tiers:qb_price_tiers,sc_qb_settings:sc_qb_settings,money_format:"{{shop.money_format}}"})); } else { ScJQuery_Qbreak('#div-sc-qb-2017210342').html(sc_qb_prod_var_group.tpl_custom_display); } } </script> <div id="div-sc-qb-2017210342"> </div> {%endif%} {% if sc-quantity-break == 'sc-qb-cart-item-script' %} <script> sc_qb_script_2017210342="sc-qb-cart-item-script"; </script> <input type="hidden" id="sc-qb-cart-item-hdn-2017210342-{{item.product_id}}-{{item.variant_id}}" class="sc-qb-cart-item-hdn-2017210342" value='{ "product_id":"{{item.product_id}}","variant_id":"{{item.variant_id}}","title":"{{item.title}}","quantity":"{{item.quantity}}","price":{{item.price}}, "product_qb_group_json":{{item.product.metafields.QBGroups.QBGroup | json}},"variant_qb_group_json":{{item.variant.metafields.QBGroups.QBGroup | json}} }' /> {%endif%} {% if sc-quantity-break == 'sc-qb-cart-script' %} <link href="/apps/quantity-break/assets/modules/app-premium/js/toastr/toastr.min.css" rel="stylesheet"> <script type="text/javascript" src="/apps/quantity-break/assets/modules/app-premium/js/main.js" ></script> <script> sc_qb_script_2017210342="sc-qb-cart-script"; </script> <style type="text/css"> #toast-container > .toast-info { background-image: none !important; } #toast-container > div{ opacity:1; } #toast-container > .toast-info > .toast-message { text-align:center; } </style> {%endif%} {% if sc-quantity-break == 'sc-qb-other-pages-script' %} <script> sc_qb_script_2017210342="sc-qb-other-pages-script"; </script> {% if template.name != 'product' and template.name != 'cart' %} <script type="text/javascript" src="/apps/quantity-break/assets/modules/app-premium/js/main.js" ></script> {% include "sc-quantity-break-tpls" %} {% endif %} {%endif%} <script type="text/template" id="tpl_sc_qb_custom_style_2017210342"> <style type="text/css"> <%= sc_qb_settings.custom_css %> </style> </script>
Step B: Instruction for sc-quantity-break-tpls.liquid this file:
Create a new snippet called sc-quantity-break-tpls.liquid and insert the following script/codes in this file
<script type="text/template" id="tpl_sc_qb_tbl_style_2017210342"> <style type="text/css"> #div-sc-qb-2017210342 .tbl-qb-grid,.div-sc-qb-2017210342 .tbl-qb-grid{ border: 1px solid #<%=sc_qb_settings.grid_border_color%> !important; margin: <%=sc_qb_settings.grid_margin%>px !important; } #div-sc-qb-2017210342 .tbl-qb-grid thead tr,.div-sc-qb-2017210342 .tbl-qb-grid thead tr{ background: #<%=sc_qb_settings.grid_header_bg%> !important; } #div-sc-qb-2017210342 .tbl-qb-grid tbody tr,.div-sc-qb-2017210342 .tbl-qb-grid tbody tr{ background: #<%=sc_qb_settings.grid_primary_bg%> !important; } #div-sc-qb-2017210342 .tbl-qb-grid tbody tr:nth-child(even),.div-sc-qb-2017210342 .tbl-qb-grid tbody tr:nth-child(even){ background: #<%=sc_qb_settings.grid_alternate_bg%> !important; } #div-sc-qb-2017210342 .tbl-qb-grid th,#div-sc-qb-2017210342 .tbl-qb-grid td,.div-sc-qb-2017210342 .tbl-qb-grid th,.div-sc-qb-2017210342 .tbl-qb-grid td { font-size: <%=sc_qb_settings.grid_font_size%>px !important; padding: <%=sc_qb_settings.grid_cell_padding%>px !important; border: none; } #div-sc-qb-2017210342 .tbl-qb-grid td,.div-sc-qb-2017210342 .tbl-qb-grid td { color: #<%=sc_qb_settings.grid_standard_font_color%> !important; } #div-sc-qb-2017210342 .tbl-qb-grid th,.div-sc-qb-2017210342 .tbl-qb-grid th { <% if(sc_qb_settings.grid_font_bold=='1'){ %> font-weight: bold !important; <% } else{ %> font-weight: normal !important; <% } %> color: #<%=sc_qb_settings.grid_header_font_color%> !important; } </style> </script> <script type="text/template" id="tpl_detailed_price_grid_2017210342"> <table class="tbl-qb-grid"> <thead> <tr> <th><%=sc_qb_settings.qty_text%></th> <th><%=sc_qb_settings.price_text%></th> </tr> </thead> <tbody> <% for (i=0;i<qb_price_tiers.length;i++) { %> <tr> <td><%=sc_qb_settings.buy_qty_text%> <%= qb_price_tiers[i].quantity %></td> <td><%= SC_Shopify.formatMoney(qb_price_tiers[i].price*100,money_format) %> <%=sc_qb_settings.price_each_text%></td> </tr> <% } %> </tbody> </table> </script> <script type="text/template" id="tpl_basic_price_grid_2017210342"> <table class="tbl-qb-grid"> <thead> <tr> <th><%=sc_qb_settings.qty_text%></th> <th><%=sc_qb_settings.price_text%></th> </tr> </thead> <tbody> <% for (i=0;i<qb_price_tiers.length;i++) { %> <tr> <td><%= qb_price_tiers[i].quantity %></td> <td><%= SC_Shopify.formatMoney(qb_price_tiers[i].price*100,money_format) %></td> </tr> <% } %> </tbody> </table> </script> <script type="text/template" id="tpl_detailed_quantity_range_price_grid_2017210342"> <table class="tbl-qb-grid"> <thead> <tr> <th><%=sc_qb_settings.min_qty_text%></th> <th><%=sc_qb_settings.max_qty_text%></th> <th><%=sc_qb_settings.price_text%></th> </tr> </thead> <tbody> <% for (i=0;i<qb_price_tiers.length;i++) { %> <tr> <td><%= qb_price_tiers[i].quantity %></td> <% if(i==(qb_price_tiers.length-1)){ %> <td><%= sc_qb_settings.unlimited_qty_text %></td> <% }else{ %> <td><%= qb_price_tiers[i+1].quantity-1 %></td> <% } %> <td><%= SC_Shopify.formatMoney(qb_price_tiers[i].price*100,money_format) %></td> </tr> <% } %> </tbody> </table> </script> <script type="text/template" id="tpl_detailed_discount_percent_grid_2017210342"> <table class="tbl-qb-grid"> <thead> <tr> <th><%=sc_qb_settings.qty_text%></th> <th><%=sc_qb_settings.price_text%></th> <th><%=sc_qb_settings.percent_discount_text%></th> </tr> </thead> <tbody> <% for (i=0;i<qb_price_tiers.length;i++) { %> <tr> <td><%=sc_qb_settings.buy_qty_text%> <%= qb_price_tiers[i].quantity %></td> <td><%= SC_Shopify.formatMoney(qb_price_tiers[i].price*100,money_format) %> <%=sc_qb_settings.price_each_text%></td> <td><%= parseFloat(qb_price_tiers[i].percent_discount).toFixed(2) %>% <%=sc_qb_settings.percent_off_text%></td> </tr> <% } %> </tbody> </table> </script> <script type="text/template" id="tpl_basic_discount_percent_grid_2017210342"> <table class="tbl-qb-grid"> <thead> <tr> <th><%=sc_qb_settings.qty_text%></th> <th><%=sc_qb_settings.percent_discount_text%></th> </tr> </thead> <tbody> <% for (i=0;i<qb_price_tiers.length;i++) { %> <tr> <td><%=sc_qb_settings.buy_qty_text%> <%= qb_price_tiers[i].quantity %></td> <td><%= parseFloat(qb_price_tiers[i].percent_discount).toFixed(2) %>% <%=sc_qb_settings.percent_off_text%></td> </tr> <% } %> </tbody> </table> </script> <script type="text/template" id="tpl_basic_quantity_range_price_grid_2017210342"> <table class="tbl-qb-grid"> <thead> <tr> <th><%=sc_qb_settings.qty_text%></th> <th><%=sc_qb_settings.price_text%></th> </tr> </thead> <tbody> <% for (i=0;i<qb_price_tiers.length;i++) { %> <tr> <td><%= qb_price_tiers[i].quantity %> - <% if(i==(qb_price_tiers.length-1)){ %> <%= sc_qb_settings.unlimited_qty_text %> <% }else{ %> <%= qb_price_tiers[i+1].quantity-1 %> <% } %> </td> <td><%= SC_Shopify.formatMoney(qb_price_tiers[i].price*100,money_format) %></td> </tr> <% } %> </tbody> </table> </script> <script type="text/template" id="tpl_detailed_discount_amount_grid_2017210342"> <table class="tbl-qb-grid"> <thead> <tr> <th><%=sc_qb_settings.qty_text%></th> <th><%=sc_qb_settings.price_text%></th> <th><%=sc_qb_settings.percent_discount_text%></th> </tr> </thead> <tbody> <% for (i=0;i<qb_price_tiers.length;i++) { %> <tr> <td><%=sc_qb_settings.buy_qty_text%> <%= qb_price_tiers[i].quantity %></td> <td><%= SC_Shopify.formatMoney(qb_price_tiers[i].price*100,money_format) %> <%=sc_qb_settings.price_each_text%></td> <td><%= SC_Shopify.formatMoney(qb_price_tiers[i].discount_amount*100,money_format) %> <%=sc_qb_settings.percent_off_text%> <%=sc_qb_settings.price_each_text%></td> </tr> <% } %> </tbody> </table> </script> <script type="text/template" id="tpl_basic_discount_amount_grid_2017210342"> <table class="tbl-qb-grid"> <thead> <tr> <th><%=sc_qb_settings.qty_text%></th> <th><%=sc_qb_settings.percent_discount_text%></th> </tr> </thead> <tbody> <% for (i=0;i<qb_price_tiers.length;i++) { %> <tr> <td><%=sc_qb_settings.buy_qty_text%> <%= qb_price_tiers[i].quantity %></td> <td><%= SC_Shopify.formatMoney(qb_price_tiers[i].discount_amount*100,money_format) %> <%=sc_qb_settings.percent_off_text%> <%=sc_qb_settings.price_each_text%></td> </tr> <% } %> </tbody> </table> </script> <script type="text/template" id="tpl_basic_quantity_range_discount_percent_grid_2017210342"> <table class="tbl-qb-grid"> <thead> <tr> <th><%=sc_qb_settings.qty_text%></th> <th><%=sc_qb_settings.percent_discount_text%></th> </tr> </thead> <tbody> <% for (i=0;i<qb_price_tiers.length;i++) { %> <tr> <td><%= qb_price_tiers[i].quantity %> - <% if(i==(qb_price_tiers.length-1)){ %> <%= sc_qb_settings.unlimited_qty_text %> <% }else{ %> <%= qb_price_tiers[i+1].quantity-1 %> <% } %> </td> <td><%= parseFloat(qb_price_tiers[i].percent_discount).toFixed(2) %>% <%=sc_qb_settings.percent_off_text%></td> </tr> <% } %> </tbody> </table> </script>