LensAdvisor FAQ

1. Download this copy of lensadvizor.liquid. Create a new snippet on your theme called lensadvizor.liquid, and copy the contents of the downloaded file into it and save.

2. Add this code block to theme.liquid. It can be anywhere in the file, but the default is just after the body tag. 

<!-- LensAdvizor snippet starts -->
{% if request.page_type == 'product' or request.page_type == 'cart' %}
{% render 'lensadvizor' %}
{% endif %}
<!-- LensAdvizor snippet ends -->

1. In Shopify navigate to Sales Channels > Online Store > Themes
2. For the draft theme you want to deploy to, click 'Customize'
3. From the middle, top dropdown select 'Product' and then 'Default Product'
5. In the left hand panel, under 'Product Information' click the '+ Add Block' link.
6. Select 'LensAdvizor' from the bottom section under APPS
7. Use the right hand drag icon to drag LensAdvizor to where you would like the 'Select Lenses' button to appear
8. From the middle, top dropdown select 'Cart'
9 In the left hand panel, under click '+ Add Section'
10. Select 'LensAdvizor' from the bottom section under APPS

You can show LensAdvisor buttons for any product on any page. To do this:

1. Go to your Sales Channel > Online Store Theme > Customize
2. Click on App Embeds in the far left icon menu
3. Turn on "LensAdvisor Quick Buy"
4. Modify your theme code wherever you would like the button and inject the following:

5. For products assigned directly (not by product collection):

    <lensadvizor-quick-buy
        class="la-select-lenses-btn"
        data-la-quick-buy
        data-la-product-id="{{ product.id }}"
        data-la-variant-id="{{ product.selected_or_first_available_variant.id }}"
        data-la-product-json="{{ product | json | escape }}"
        data-la-flow-id=""
    >
    </lensadvizor-quick-buy>

5. For products assigned by product collection:

    {% liquid
        assign lacollectionId = ""
        unless request.page_type == "collection"
            for collection in product.collections
                if collection.metafields.lensadvisor.collection_id  != blank
                    assign lacollectionId = collection.metafields.lensadvisor.collection_id
                endif
            endfor
        else
            assign lacollectionId = collection.metafields.lensadvisor.collection_id
        endunless
    %}
    <lensadvizor-quick-buy
      class="la-select-lenses-btn"
      data-la-quick-buy
      data-la-product-id="{{ product.id }}"
      data-la-variant-id="{{ product.selected_or_first_available_variant.id }}"
      data-la-product-json="{{ product | json | escape }}"
      data-la-flow-id="{{ lacollectionId }}"
      >
    </lensadvizor-quick-buy>

---

NOTE: Replace product and collection variables with the product and collection variables used in your theme code.

---

If this code is dynamically loaded

(e.g. using the section-rendering concept of Shopify), please also add  data-la-quick-view="1" to <lensadvizor-quick-buy> or call LensAdvizor.init()

---

Advanced

If the product object is not immediately available:

1. You can replace data-la-product-json with data-la-product-handle, and provide the product handle instead.

2. If you are loading the product data from another source, you can omit data-la-product-json and instead load it in javascript, for example: 

    <script type="application/json" data-lensadvizor-product="{{ product.id }}">{{ product | json }}</script> 

 

You can use template variables to test if a Line Item is a lens product and then choose how to display this row. This requires knowledge of HTML, CSS, and Shopify Template code.

If the product vendor has not been modified, you can use this code to test that it is a lens product:

​{% unless item.vendor == "LensAdvizor" %}
{% endunless %}

If the product vendor has been modified, you can iterate over the Line Item properties and test for _productType=="lens"

In your cart.liquid template, you find the code that loops over and displays cart item properties. Just inside this loop, update the code that checks for the first character to the following:​

{% assign first_character_in_key = p.first | truncate: 1, '' %}
{% unless p.last == blank or first_character_in_key == '_' %}
{%endunless%}

Usually you will replace:

{% unless p.last == blank %}

with:

{% assign first_character_in_key = p.first | truncate: 1, '' %}
{% unless p.last == blank or first_character_in_key == '_' %}

You can exclude specific products from a Lens Flow, even if you have assigned by product collection, by adding the tag remove-rx on the frame product. This will prevent the Select Lenses button from appearing on that specific product.

All shopify stores have a default “all” collection which shows every product attached to your store. This means LensAdvisor products may start to appear on your product pages. To remove them: 

1. Go to “Collection”
2. Create a new collection called: “All” 
3. In Collection Type: 

• Automated. 
• Product Must Match: All Collections
• Product Vendor | Is not equal to | LensAdvizor 

4. Save

This process will override the default “all” collection and remove all the LensAdvisor products. 

Please use the Translation left hand navigation menu in the app.

Clicking on the Settings gear icon will allow you to add a new translation for a locale, please make sure the locale is in all lowercase characters, such as 'pt-pt' instead of 'pt-PT'.

- Translate Default Text -

All default text is in English, so you can 'translate English into English' by using the locale code 'en'.

- Find your locale code -

You can find the locale code your theme is using by going to Sales Channels > Online Store > Current Theme > Edit Code. Scroll down and open the 'Locales' folder. You will see files named <locale code>.json.
Example locale codes:
English = 'en'
Spanish = 'es'
French = 'fr'