Shopify

{
  "name": "Tenbyte",
  "settings": [
    {
      "type": "paragraph",
      "content": "Tenbyte Image Optimization. See https://docs.tenbyte.io/docs/cdn/image-optimization/integration-guide/shopify"
    },
    {
      "type": "checkbox",
      "id": "enableTenbyte",
      "label": "Enable Tenbyte"
    },
    {
      "type": "text",
      "id": "tenbyteUrl",
      "label": "Tenbyte URL endpoint",
      "info": "Your Tenbyte distribution. Example: https://your-distribution.tenbytecdn.com/"
    },
    {
      "type": "text",
      "id": "tenbyteShopifyCdnUrl",
      "label": "Shopify CDN domain",
      "info": "Leave as //cdn.shopify.com unless you have a proxy in place."
    }
  ]
}

{% capture TENBYTE %}
  {% if settings.enableTenbyte %}
    {% for i in (1..1) %}
      {% unless src or settings.tenbyteUrl != blank %}
        {{ src }}{% break %}
      {% endunless %}

      {% assign cdnUrl = settings.tenbyteShopifyCdnUrl | strip %}
      {% unless src contains cdnUrl %}
        {{ src }}{% break %}
      {% endunless %}

      {% assign tenbyteUrl = settings.tenbyteUrl | strip %}

      {% assign filters = 'w,h,q,fm,fit,dpr,format,quality,bri,con,sat,sharp,blur,auto' | split:',' %}
      {% assign imgWithQuerystring = "?" %}
      {% if src contains '?' %}{% assign imgWithQuerystring = '' %}{% endif %}

      {% for _filter in filters %}
        {% if [_filter] %}
          {% assign imgWithQuerystring = imgWithQuerystring | append:_filter | append:'=' | append:[_filter] | append:'&' %}
        {% endif %}
      {% endfor %}

      {% assign modifySrc = src | split:'?' | first | append:"?" %}
      {% assign newSrc = modifySrc | strip | replace:cdnUrl,tenbyteUrl | append:imgWithQuerystring %}
    {% endfor %}

    {{ newSrc | default:src }}
  {% else %}
    {{ src }}
  {% endif %}
{% endcapture %}{{ TENBYTE | strip | replace:'  ' | strip_newlines }}