Integrate code to theme
If you have any difficulty with integrating the code into the theme, do not hesitate to contact us via email: "[email protected]"
For test purposes, we highly recommend you activate the app embeds on an unpublished theme to avoid any unexpected results on your live theme.
Steps to manage
- 1.From app admin page, click Integrate Theme on the left sidebar.
- 2.Select the theme you want to show the quote function > click Go to Theme Settings > App Embeds button.
- 3.In Theme Editor, activate the app embeds of S:Request a Quote & Hide Price app > Save the changes.
- 4.Check the setting in the app again.
- 5.Check the result on the theme.
Note:
- Preview the theme if it is an unpublished theme
- If the app is installed to live theme, please check the live website
If your theme is an Online Store 2.0, please add an app block to your product template via Theme Editor.
To change the position of the button, simply drag & drop.
Or you can use the short code integration:
- 1.Open the sections/product-template.liquid or sections/main-product.liquid
- 2.Insert the short code below into any position you want
{% render 'storeify-quote',product: product %}
- 1.Select a theme > Edit code > Create a new file storeify-quote.liquid in Snippets folder.
- 2.Insert liquid code below into storeify-quote.liquid
storeify-quote.liquid
{% assign label_btn = "Request a quote" %}
{% if shop.metafields.storeifyquote %}
{% assign locale_current = shop.locale %}
{% assign storeify_quote_mode = shop.metafields.storeifyquote.quote_settings.mode %}
{% assign quote_lang = shop.metafields.storeifyquote.quote_settings.lang %}
{% if quote_lang contains locale_current %}
{% if storeify_quote_mode == 1 %}
{% assign label_btn = quote_lang[locale_current].btn_addquote %}
{% else %}
{% assign label_btn = quote_lang[locale_current].call_for_price %}
{% endif %}
{% else %}
{% if storeify_quote_mode == 1 %}
{% assign label_btn = quote_lang.default.btn_addquote %}
{% else %}
{% assign label_btn = quote_lang.default.call_for_price %}
{% endif %}
{% endif %}
{% endif %}
<div class="ify-hide ify-quote-group ify-quote-group-{{product.id}}" data-targetid="{{product.id}}" data-targethandle="{{product.handle}}">
<button type="button" class="storeify-quote-btn-trigger-popup btn button button--primary ify-button-code" data-product="{{ product.handle }}">{{ label_btn }}</button>
{% assign productCollections = product.collections | map:'id' %}
<script id="ify_script_item_{{product.id}}">
var storeifyRequestaquote = storeifyRequestaquote || {};
storeifyRequestaquote.productdata = storeifyRequestaquote.productdata || {};
storeifyRequestaquote.productdata['{{product.id}}'] = {"id":{{ product.id }},"title":{{ product.title | json }},"handle":"{{ product.handle }}","available":{{ product.available }},"vendor":"{{ product.vendor }}","type":"{{ product.type }}","tags":{{ product.tags | json }},"price":{{ product.price }}};
storeifyRequestaquote.collections = storeifyRequestaquote.collections || {};
storeifyRequestaquote.collections['{{product.id}}'] = {{ productCollections | json }};
</script>
</div>
- 3.Insert the short code below into the collection product grid template. This file depends on the custom theme you are using. In this guide, we will the Dawn theme > snippets/product-card.liquid
{% render 'storeify-quote',product: product_card_product %}
or snippets/card-product.liquid
{% render 'storeify-quote',product: card_product %}
Last modified 1mo ago