Snippets examples

Create new currency switcher

<footer>
    ...
    {% render "ls-currencies-switcher", id: 82289733 %}
    ...
</footer>

Add language value for product property

{% form "product", product %}

    <input type="hidden" name="properties[Language]" value="{%- render "ls-language" -%}">
    ...

    <input type="submit" value="Add to cart" />

{% endform %}

Use sections only for certain language

<div id="PageContainer">
    ...
    {%- capture LS_LANGUAGE -%}{%- render "ls-language" -%}{%- endcapture -%}
    {% if LS_LANGUAGE == "fr" %}
        {% section "footer" %}
    {% endif %}
    ...
</div>

Show content only for default language

<div id="PageContainer">
    ...
    {%- capture LS_LANGUAGE -%}{%- render "ls-language" -%}{%- endcapture -%}
    {%- capture LS_DEFAULT_LANGUAGE -%}{%- render "ls-default-language" -%}{%- endcapture -%}
    {% if LS_LANGUAGE == LS_DEFAULT_LANGUAGE %}
        {% render "content" %}
    {% endif %}
    ...
</div>

Include different snippets per each language

{%- capture LS_LANGUAGE -%}{%- render "ls-language" -%}{%- endcapture -%}
{% assign snippet_name = "snippet-for-" | append: LS_LANGUAGE %}
{% render snippet_name %}

Replace product image output with localized version

Default usage

<meta itemprop="image" content="{ { product.featured_image | img_url: "600x", scale: 2, crop: "center" } }">

<!--
    <meta itemprop="image" content="//cdn.shopify.com/s/files/1/0087/0462/products/image_600x_crop_center@2x.jpg?v=1309278311">
-->

Localization

<meta itemprop="image" content="{%- render "ls-img-url", image: product.featured_image, img_url: "600x", scale: 2, crop: "center" -%}">

<!--
    <meta itemprop="image" content="//cdn.shopify.com/s/files/1/0057/5317/6131/t/130/assets/image-for-current-language_600x_crop_center@2x.jpg?86920">
-->

Use image ALT localization

Default usage

<img src="..." alt="{ { product.featured_image.alt } }">

<!--
    <img src="..." alt="Original alt">
-->

Localization

<img src="..." alt="{%- render "ls-alt", image: product.featured_image -%}">

<!--
    <img src="..." alt="Alt originale">
-->

Load Facebook SDK with localization parameter

{%- capture LS_LANGUAGE -%}{%- render "ls-language" -%}{%- endcapture -%}
{%- assign FB_LANGUAGE = LS_LANGUAGE | replace: "-", "_" -%}

<!-- Load Facebook SDK for JavaScript -->
<div id="fb-root"></div>
<script>(function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "https://connect.facebook.net/{ { FB_LANGUAGE } }/sdk.js#xfbml=1&version=v3.0";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>