How to move my product savings percentage next to the old price

Solved
RobMoore007
Explorer
122 1 12

Hi there, Please see image below

  • I need to move my Save 11% detail to the right of the MRRP£449.
  • I also need to remove or hide the two brackets that appear after the 11%
  • The £399 will then move left and be underneath MRRP

This is the page:

https://auchterlonies-com.myshopify.com/collections/taylormade-golf-drivers/products/sim2-driver

Password: awskob

 

Hope youcan help

 

Screen Shot 2021-05-14 at 17.34.26.png

Regards
Rob Moore - NEWBY!!
0 Likes
Michal_Morek
Shopify Partner
498 41 81

Hello ,

 

Here a solution to your problem

You should add this CSS snippet to your CSS theme file after your edit the related Liquid code architecture:

 

span.flex-style {
    display: flex;
}

 

 

You have to edit product.liquid file. The product.liquid file renders a detailed page for an individual product.

Based on the URL your give in your question, I found the portion of code that will solve your problem :

 

 

<p class="modal_price subtitle"> <span class="sold_out"></span> <span class="was-price"><span class="money">£449.00
</span></span> <span class="sale savings">Save 11% (<span class="money">£50.00
</span>)</span> <span class="sale"> <span class="current_price "><span class="money">£399.00
</span></span></span></p>

 

 

And replace it with :

 

 

<p class="modal_price subtitle">
  <span class="sold_out"></span>
  <span class="flex-style">
    <span class="was-price">
      <span class="money">£449.00</span>
    </span>
    <span class="sale savings">
      Save 11% <span class="money">(£50.00)</span>
    </span>
  </span>
  <span class="sale">
    <span class="current_price ">
      <span class="money">£399.00</span>
    </span>
  </span>
</p>

 

 

So you have to do the same work in your product.liquid file accordingly.

You can show me the content of product.liquid file if you want to have the exact solution here.

Please let me know if you have any further questions.

 

Fixed page should look like thisFixed page should look like this

 

If you found this comment useful then please hit Like and Accept the Solution!
If you would like to hire us as Shopify experts, please reach out via email or private message.
Founder of Shopify agency - Accomplishify.com
Contact me on: michal.morek@accomplishify.com
0 Likes
RobMoore007
Explorer
122 1 12

Hi, Thanks for the response

I have opened product.liquid and cannot find this??

<p class="modal_price subtitle"> <span class="sold_out"></span> <span class="was-price"><span class="money">£449.00
</span></span> <span class="sale savings">Save 11% (<span class="money">£50.00
</span>)</span> <span class="sale"> <span class="current_price "><span class="money">£399.00
</span></span></span></p>

 

Regards
Rob Moore - NEWBY!!
0 Likes
RobMoore007
Explorer
122 1 12

Here is my product.liquid as requested

{% comment %}
  Defaults to /sections/product-template.liquid, but default can be changed in Theme Settings > Layout > Product page default template
{% endcomment %}

{% if settings.product_layout == 'sections' %}
{% comment %} Product - sections {% endcomment %}
  <div id="template-{{ template | replace: '.', '-' | handle }}" class="shopify-section product-page">
    <section class="section__wrapper
                    section
                    is-width-wide
                    ">
      <div class="container">

        <div class="section is-width-standard">

          <div class="one-whole column breadcrumb__container is-flex is-justify-space-between is-flex-column-reverse-mobile is-align-center has-padding-bottom">

            <div class="breadcrumb__wrapper">
              {% render 'breadcrumb', context: 'product' %}
            </div>

            {% if collection.previous_product or collection.next_product %}
              <div class="page-navigation-arrows has-padding-top has-padding-bottom is-{{ settings.breadcrumb_capitalization }}">
                {% if collection.previous_product %}
                  <a href="{{ collection.previous_product }}" title="{{ 'products.general.previous_product_html' | t }}" class="page-navigation__next">
                    {{ 'products.general.previous_product_html' | t }}
                  </a>
                {% endif %}
                {% if collection.previous_product and collection.next_product %}
                  <span class="page-navigation__divider"> | </span>
                {% endif %}
                {% if collection.next_product %}
                  <a href="{{collection.next_product}}" title="{{ 'products.general.next_product_html' | t }}" class="page-navigation__next">
                    {{ 'products.general.next_product_html' | t }}
                  </a>
                {% endif %}
              </div>
            {% endif %}

          </div>

        </div>
      </div>

      <div class="container">
        {% section 'product__sidebar' %}
        {% section 'product-sections__main' %}
        {% section 'product__recommendations' %}
      </div>

    </section>
  </div>

{% elsif settings.product_layout == 'image_scroll' %}
{% comment %} Product - image scroll {% endcomment %}
  <div id="template-{{ template | replace: '.', '-' | handle }}" class="shopify-section product-page">
    <section class="section
                    is-width-wide
                    has-padding-top
                    ">
      <div class="container has-padding-left has-padding-right">
        <div class="one-whole column breadcrumb__container is-flex is-justify-space-between is-flex-column-reverse-mobile is-align-center">

          <div class="breadcrumb__wrapper">
            {% render 'breadcrumb', context: 'product' %}
          </div>

          {% if collection.previous_product or collection.next_product %}
            <div class="page-navigation-arrows has-padding-top has-padding-bottom is-{{ settings.breadcrumb_capitalization }}">
              {% if collection.previous_product %}
                <a href="{{ collection.previous_product }}" title="{{ 'products.general.previous_product_html' | t }}" class="page-navigation__next">
                  {{ 'products.general.previous_product_html' | t }}
                </a>
              {% endif %}
              {% if collection.previous_product and collection.next_product %}
                <span class="page-navigation__divider"> | </span>
              {% endif %}
              {% if collection.next_product %}
                <a href="{{collection.next_product}}" title="{{ 'products.general.next_product_html' | t }}" class="page-navigation__next">
                  {{ 'products.general.next_product_html' | t }}
                </a>
              {% endif %}
            </div>
          {% endif %}

        </div>
      </div>
      <div class="container">
        {% section 'product-image-scroll__main' %}
        {% section 'product__recommendations' %}
      </div>
    </section>
  </div>

{% else %}
{% comment %} Product - classic (default) {% endcomment %}
  <div id="template-{{ template | replace: '.', '-' | handle }}" class="shopify-section product-page section__wrapper">
    {% comment %} Breadcrumbs and navigation {% endcomment %}
    <section class="section
                    is-width-standard
                    has-padding-top
                    has-padding-bottom
                    ">
      <div class="container">
        <div class="one-whole column is-flex is-justify-space-between is-flex-column-reverse-mobile is-align-center">

          <div class="breadcrumb__container">
            {% render 'breadcrumb', context: 'product' %}
          </div>

          {% if collection.previous_product or collection.next_product %}
            <div class="page-navigation-arrows has-padding-top has-padding-bottom is-{{ settings.breadcrumb_capitalization }}">
              {% if collection.previous_product %}
                <a href="{{ collection.previous_product }}" title="{{ 'products.general.previous_product_html' | t }}" class="page-navigation__next">
                  {{ 'products.general.previous_product_html' | t }}
                </a>
              {% endif %}
              {% if collection.previous_product and collection.next_product %}
                <span class="page-navigation__divider"> | </span>
              {% endif %}
              {% if collection.next_product %}
                <a href="{{collection.next_product}}" title="{{ 'products.general.next_product_html' | t }}" class="page-navigation__next">
                  {{ 'products.general.next_product_html' | t }}
                </a>
              {% endif %}
            </div>
          {% endif %}

        </div>
      </div>
    </section>

    {% comment %} Product wrapper {% endcomment %}
    <section class="section
                    section--has-sidebar-option">
      <div class="container">
        {% section 'product__sidebar' %}
        {% section 'product__main' %}
        {% section 'product__recommendations' %}
      </div>
    </section>
  </div>
{% endif %}

code

 

Regards
Rob Moore - NEWBY!!
0 Likes
RobMoore007
Explorer
122 1 12

Hi Michal, I hope you are well.

 

Did you see my response ?

 

Can you help please?

 

Regards
Rob Moore - NEWBY!!
0 Likes
Michal_Morek
Shopify Partner
498 41 81

Hello @RobMoore007,

Sure I can help you. Show me the content of :

sections/product-template.liquid

 

If you found this comment useful then please hit Like and Accept the Solution!
If you would like to hire us as Shopify experts, please reach out via email or private message.
Founder of Shopify agency - Accomplishify.com
Contact me on: michal.morek@accomplishify.com
0 Likes
RobMoore007
Explorer
122 1 12

Hi and thanks.. I dont have that file..

 

I have this however: product-sections_main.liquid ?

{% comment %}
** Product - sections view **
- Product template
- Uses blocks
{% endcomment %}

{% assign id = section.id %}
{% comment %} Layout {% endcomment %}
{% assign padding_top = section.settings.padding_top %}
{% assign padding_bottom = section.settings.padding_bottom %}
{% comment %} Advanced {% endcomment %}
{% assign css_class = section.settings.css_class %}
{% assign custom_css = section.settings.custom_css %}

{% comment %} Section specific CSS {% endcomment %}
{% style %}
  .section__wrapper {
    padding-top: {{ padding_top }}px;
    padding-bottom: {{ padding_bottom }}px;
  }

  {% if section.settings.product_breadcrumb == false %}
    .breadcrumb__container {
      display: none;
    }
  {% endif %}

  {% render 'css-loop',
          css: custom_css,
          id: id
  %}
{% endstyle %}

{% assign collection_handles = product.collections | map: 'handle' %}
{% assign variant = product.selected_or_first_available_variant %}
{% assign product_tags = product.tags | join: ' ' %}

{% render 'product__structured-data' %}

{% comment %} HTML markup {% endcomment %}
<section class="section
                is-width-wide
                {{ css_class }}
                ">
  <div class="product-{{ product.id }}">
    <div class="product_section
                js-product_section
                container
                is-justify-center"
                data-rv-handle="{{ product.handle }}">

        {% for block in section.blocks %}
          {% assign animation = block.settings.animation | default: 'none' %}
          {% assign width = block.settings.width %}

          <div id="shopify-section-{{ block.id }}" {{ block.shopify_attributes }}
        class="shopify-section
                product-sections__block
                block__{{ block.type | downcase | replace: '_', '-' }}
                {% if block.type == 'featured_collection' %}
                  jsFeaturedCollection
                {% elsif block.type == 'image_with_overlay' %}
                  overlaid-header-option
                {% elsif block.type == 'featured_product' %}
                  jsProduct
                {% elsif block.type == 'map' %}
                  jsMap
                {% elsif block.type == 'video' %}
                  jsVideo
                {% endif %}"
          {% if animation != "none" %}
            data-scroll-class="{{ animation }}"
          {% endif %}>

          {% if block.type == 'product_gallery' %}
            {% comment %}Product gallery{% endcomment %}
            {% style %}
              #shopify-section-{{ block.id }} {
                padding-top: {{ block.settings.padding_top }}px;
                padding-bottom: {{ block.settings.padding_bottom }}px;
                padding-left: {{ block.settings.padding_left }}px;
                padding-right: {{ block.settings.padding_right }}px;
                {% if block.settings.width == 'wide' -%}
                  width: 100%;
                {%- elsif block.settings.width == 'half' -%}
                  width: 50%;
                {%- endif %}
              }
            {% endstyle %}

            <section class="section
                {{ css_class }}
                is-width-{{ width }}
                product-gallery__block">
              <div class="container product-gallery__container">
                <div class="product__images one-whole column">
                  {% render 'product__images',
                          product: product,
                          display_thumbnails: block.settings.display_thumbnails,
                          thumbnail_position: block.settings.thumbnail_position,
                          enable_thumbnail_slider: block.settings.enable_thumbnail_slider,
                          gallery_arrows: block.settings.gallery_arrows,
                          slideshow_transition: block.settings.slideshow_transition,
                          enable_product_lightbox: block.settings.enable_product_lightbox,
                          enable_zoom: block.settings.enable_zoom
                  %}
                </div>
              </div>
            </section>

            {% comment %} JavaScript {% endcomment %}
            <script
              type="application/json"
              data-section-id="{{ section.id }}"
              data-section-data
            >
              {
                "gallery_arrows": {{ block.settings.gallery_arrows | json }},
                "thumbnail_arrows": {{ block.settings.gallery_arrows | json }},
                "enable_zoom": {{ block.settings.enable_zoom | json }},
                "enable_product_lightbox": {{ block.settings.enable_product_lightbox | json }},
                "enable_thumbnail_slider": {{ block.settings.enable_thumbnail_slider | json }},
                "slideshow_speed": {{ block.settings.slideshow_speed | json }},
                "slideshow_transition": {{ block.settings.slideshow_transition | json }},
                "thumbnails_enabled": {{ block.settings.display_thumbnails | json }},
                "thumbnail_position": {{ block.settings.thumbnail_position | json }},
                "product_media_amount": {{ product.media.size }},
                "template": "sections"
              }
            </script>

          {% elsif block.type == 'product_info' %}
            {% style %}
              #shopify-section-{{ block.id }} {
                padding-top: {{ block.settings.padding_top }}px;
                padding-bottom: {{ block.settings.padding_bottom }}px;
                padding-left: {{ block.settings.padding_left }}px;
                padding-right: {{ block.settings.padding_right }}px;
                {% if block.settings.width == 'wide' -%}
                  width: 100%;
                {%- elsif block.settings.width == 'half' -%}
                  width: 50%;
                {%- endif %}
              }
            {% endstyle %}

            {% comment %} Product information {% endcomment %}
            <section class="section
                {{ css_class }}
                product-info__block
                is-width-{{ width }}">
              <div class="one-whole column">
                <div class="product__information has-product-sticker">

                  {% comment %} Sale sticker {% endcomment %}
                  {% if settings.stickers_enabled %}
                    {% render 'product-thumbnail__sticker',
                            context: 'product',
                            collection_handles: collection_handles
                    %}
                  {% endif %}

                  {% comment %} Review stars {% endcomment %}
                  {% if block.settings.enable_shopify_product_badges and settings.enable_shopify_review_comments %}
                    <div class="spr-badge-container">
                      <span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>
                    </div>
                  {% endif %}

                  {% comment %} Vendor {% endcomment %}
                  {% if block.settings.display_vendor %}
                    <p class="vendor">
                      <span class="vendor">{{ product.vendor | link_to_vendor }}</span>
                    </p>
                  {% endif %}

                  {% comment %} Sku {% endcomment %}
                  {% if variant.sku != blank and block.settings.display_sku %}
                    <p class="sku">
                      {{ variant.sku }}
                    </p>
                  {% endif %}

                  {% comment %} Name {% endcomment %}
                  <h1 class="product_name title">{{ product.title }}</h1>

                  {% for tag in product.tags %}
                    {% if tag contains 'meta-size-chart-' %}
                      {% assign meta-size-chart = true %}
                    {% endif %}
                  {% endfor %}

                  {% comment %} Size chart Mobile {% endcomment %}
                  {% if settings.size_chart != blank or meta-size-chart %}
                    <a href="javascript&colon;;" class="product__size-chart size-chart--medium-down" data-fancybox data-src="#size-chart{{product.id}}" data-type="inline">{{ 'products.product.size_chart' | t }} {% render 'icon', name: 'right-caret' %}</a>
                    {% render 'popup-size-chart', product_id: product.id %}
                  {% endif %}

                  {% comment %} Price {% endcomment %}
                  <p class="modal_price subtitle">
                      {% if collection_handles contains 'coming-soon' %}
                        {% if settings.stickers_enabled == false %}{{ 'collections.general.coming_soon' | t }}{% endif %}
                      {% else %}

                      {% comment %} Sold out {% endcomment %}
                      <span class="sold_out">{% if variant.available == false %}{{ 'products.product.sold_out' | t }}{% endif %}</span>

                  
                      {% comment %} Current price {% endcomment %}
                      <span class="{% if variant.compare_at_price > variant.price %}sale{% endif %}">
                        <span class="current_price {% if product.available == false %}hidden{% endif %}">
                          {% if variant.price > 0 %}
                            <span class="money">
                              {% render 'price-element', price: variant.price %}
                            </span>
                          {% else %}
                            {{ settings.free_price_text }}
                          {% endif %}
                        </span>
                      </span>

                      {% comment %} Compare at (original) price {% endcomment %}
                      <span class="was-price">
                        {% if variant.price < variant.compare_at_price and variant.available %}
                          <span class="money">
                            {% render 'price-element', price: variant.compare_at_price %}
                          </span>
                        {% endif %}
                      </span>

                      {% comment %} Size chart {% endcomment %}
                      {% if settings.size_chart != blank or meta-size-chart %}
                        <a href="javascript&colon;;" class="product__size-chart medium-down--hidden" data-fancybox data-src="#size-chart{{product.id}}" data-type="inline">{{ 'products.product.size_chart' | t }} {% render 'icon', name: 'right-caret' %}</a>
                        {% render 'popup-size-chart', product_id: product.id %}
                      {% endif %}

                      {% comment %} Savings {% endcomment %}
                      {% if block.settings.display_savings %}
                        <span class="sale savings">
                          {% if variant.price < variant.compare_at_price and variant.available %}
                            {{ 'products.product.savings' | t }}  {{ variant.compare_at_price | minus: variant.price | times: 100 | divided_by: variant.compare_at_price }}% (<span class="money">{% assign compare_at = variant.compare_at_price | minus: variant.price %}{% render 'price-element', price: compare_at %}</span>)
                          {% endif %}
                        </span>
                      {% endif %}
                    {% endif %}
                  </p>

                  {% comment %} Description - top {% endcomment %}
                  {% if block.settings.product_description_position == "top" %}
                    {% if product.description != blank %}
                      <div class="description content">
                        {{ product.description | split: '<!-- split -->' | first }}
                      </div>
                    {% endif %}
                  {% endif %}

                  {% comment %} Purchase form {% endcomment %}
                  <div class="product-form-container">

                  {% comment %} Notify form {% endcomment %}
                  {% render 'product__notify-me-form', product: product %}

                    {% comment %} Product form {% endcomment %}
                    {% unless collection_handles contains 'coming-soon' %}
                      {% render 'product__form',
                              context: 'product',
                              show_payment_button: block.settings.show_payment_button,
                              collection_handles: collection_handles
                      %}
                    {% endunless %}
                  </div>

                  {% comment %} Description - bottom {% endcomment %}
                  {% if block.settings.product_description_position == "bottom" %}
                    {% if product.description != blank %}
                      <div class="description content bottom has-padding-top">
                        {{ product.description | split: '<!-- split -->' | first }}
                      </div>
                    {% endif %}
                  {% endif %}

                  {% comment %} Collections, type, tags {% endcomment %}
                  {% if block.settings.display_collections or block.settings.display_tags or block.settings.display_type %}
                    <div class="product__classification-links has-padding-top">
                      {% if block.settings.display_collections %}
                        <p class="product__collections-list tags">
                          <span class="product__classification-title">{{ 'products.product.collections' | t }}:</span>
                          {% for col in product.collections %}
                            <span class="tag tag--{{ settings.tag_style }}">
                              <a href="{{ col.url }}" title="{{ col.title }}">{{ col.title }}</a>
                            </span>
                          {% endfor %}
                        </p>
                      {% endif %}

                      {% if block.settings.display_type %}
                        <p class="product__type-list tags">
                          <span class="product__classification-title">{{ 'products.product.product_types' | t }}:</span>
                          <span class="tag tag--{{ settings.tag_style }}">{{ product.type | link_to_type }}</span>
                        </p>
                      {% endif %}

                      {% if block.settings.display_tags and product.tags.size > 0 %}
                        <p class="product__tags-list  tags">
                          <span class="product__classification-title">{{ 'products.product.tags' | t }}:</span>
                          {% for tag in product.tags %}
                            {% unless tag contains 'meta-' %}
                              <span class="tag tag--{{ settings.tag_style }}">
                                <a href="{{ routes.collections_url }}/{% if collection %}{{ collection.handle }}{% else %}all{% endif %}/{{ tag | handle }}" title="{{ 'products.product.products_tagged' | t: tag: tag }}">{{ tag }}</a>
                              </span>
                            {% endunless %}
                          {% endfor %}
                        </p>
                      {% endif %}
                    </div>
                  {% endif %}

                  {% comment %} Social share icons {% endcomment %}
                  {% if block.settings.display_social_buttons %}
                    <div class="product__social-share has-padding-top">
                      {% render 'social-share-buttons' %}
                    </div>
                  {% endif %}
                </div>
              </div>
            </section>

          {% elsif block.type == 'product_reviews' %}
            {% comment %} Product reviews {% endcomment %}
            {% include 'include-reviews', type: 'block' %}

          {% elsif block.type == 'video' %}
            {% comment %} Featured video {% endcomment %}
            {% include 'include-video', type: 'block' %}

          {% elsif block.type == 'rich_text' %}
            {% comment %} Rich text {% endcomment %}
            {% include 'include-rich-text', type: 'block' %}

          {% elsif block.type == 'image_with_overlay' %}
            {% comment %} Image with text overlay {% endcomment %}
            {% include 'include-image-with-text-overlay', type: 'block' %}

          {% elsif block.type == 'image_with_text' %}
            {% comment %} Image with text {% endcomment %}
            {% include 'include-one-image-with-text', type: 'block' %}

          {% elsif block.type == "blog" %}
            {% comment %} Blog {% endcomment %}
            {% include 'include-featured-blog', type: 'block' %}

          {% elsif block.type == 'featured_collection' %}
            {% comment %} Featured collection {% endcomment %}
            {% include 'include-featured-collection', type: 'block' %}

          {% elsif block.type == 'logo_list' %}
            {% comment %} Logo list {% endcomment %}
            {% include 'include-logo-list', type: 'block' %}

          {% elsif block.type == "divider" %}
            {% comment %} Divider {% endcomment %}
            {% include 'include-divider', type: 'block' %}

          {% elsif block.type == 'map' %}
            {% comment %} Map {% endcomment %}
            {% include 'include-map', type: 'block' %}

          {% elsif block.type == "page" %}
            {% comment %} Page {% endcomment %}
            {% include 'include-content-page', type: 'block' %}

          {% elsif block.type == 'recommended_products' %}
          {% comment %} Recommended products {% endcomment %}
          <section class="section is-width-{{ width }}" data-product-recommendations-container
              {% if animation != "none" %}
                data-scroll-class="{{ animation }}"
              {% endif %}>
          </section>

          {% style %}
            #shopify-section-{{ block.id }} {
              padding-top: {{ block.settings.padding_top }}px;
              padding-bottom: {{ block.settings.padding_bottom }}px;
              width: 95%;
              {% if block.settings.width == 'wide' %}
                width: 100%;
              {% endif %}
            }
          {% endstyle %}

          {% endif %}
        </div>
      {% endfor %}
    </div>
  </div>
</section>

{% comment %} Used to ensure product review app installs succesfully {% endcomment %}
<div class="is-hidden">
  <div id="shopify-product-reviews" data-id="{{ product.id }}">{{ product.metafields.spr.reviews }}</div>
</div>

{% comment %} Shopify-XR {% endcomment %}
{% if product.media %}
  <script>
    window.ShopifyXR=window.ShopifyXR||function(){(ShopifyXR.q=ShopifyXR.q||[]).push(arguments)}
      {% assign models = product.media | where: 'media_type', 'model' | json %}
      ShopifyXR('addModels', {{ models }});
  </script>
{% endif %}

{% comment %} JavaScript {% endcomment %}
<script
  type="application/json"
  data-section-id="{{ section.id }}"
  data-section-data
>
  {
    "template": "sections"
  }
</script>
<script src="{{ 'z__jsProduct.js' | asset_url }}"></script>

{% schema %}

{
  "name": "Product - sections",
  "max_blocks": 15,
  "class": "product-template product-main has-sidebar-option product-sections-template jsProduct",
  "settings": [
    {
      "type": "checkbox",
      "id": "product_breadcrumb",
      "label": "Show breadcrumb links"
    },
    {
      "type": "header",
      "content": "Layout"
    },
    {
      "type": "range",
      "id": "padding_top",
      "label": "Top spacing",
      "min": 0,
      "max": 80,
      "default": 20,
      "unit": "px"
    },
    {
      "type": "range",
      "id": "padding_bottom",
      "label": "Bottom spacing",
      "min": 0,
      "max": 80,
      "default": 0,
      "unit": "px"
    },
    {
      "type": "header",
      "content": "Advanced",
      "info": "[Learn more](https://help.outofthesandbox.com/hc/en-us/articles/360022329373)"
    },
    {
      "type": "text",
      "id": "css_class",
      "label": "CSS Class"
    },
    {
      "type": "textarea",
      "id": "custom_css",
      "label": "Custom CSS"
    }
  ],
  "blocks": [
    {
      "type": "blog",
      "name": "Blog posts",
      "settings": [
        {
          "type": "text",
          "id": "title",
          "label": "Heading",
          "default": "Recent blog posts"
        },
        {
          "type": "blog",
          "id": "blog_widget_select",
          "label": "Blog"
        },
        {
          "type": "range",
          "id": "home_page_articles",
          "label": "Posts",
          "min": 2,
          "max": 4,
          "default": 3
        },
        {
          "type": "checkbox",
          "id": "blog_show_tags",
          "label": "Show tags",
          "default": true
        },
        {
          "type": "checkbox",
          "id": "blog_author",
          "label": "Show author",
          "default": true
        },
        {
          "type": "checkbox",
          "id": "read_time",
          "label": "Show estimated read time",
          "default": true
        },
        {
          "type": "checkbox",
          "id": "blog_date",
          "label": "Show date",
          "default": true
        },
        {
          "type": "checkbox",
          "id": "blog_comment_count",
          "label": "Show comment count",
          "default": false
        },
        {
          "type": "checkbox",
          "id": "blog_show_excerpt",
          "label": "Show excerpts",
          "default": true
        },
        {
          "type": "checkbox",
          "id": "show-border",
          "label": "Show border",
          "default": true
        },
        {
          "type": "text",
          "id": "button_label",
          "label": "Button label",
          "default": "Read more"
        },
        {
          "type": "select",
          "id": "button_type",
          "label": "Button style",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "button--primary",
              "label": "Primary"
            },
            {
              "value": "button--secondary",
              "label": "Secondary"
            }
          ],
          "default": "button--primary"
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "select",
          "id": "width",
          "label": "Width",
          "options": [
            {
              "value": "standard",
              "label": "Standard"
            },
            {
              "value": "wide",
              "label": "Wide"
            }
          ],
          "default": "standard"
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 20,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "default": 0,
          "min": 0,
          "max": 80,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            }
          ]
        }
      ]
    },
    {
      "type": "divider",
      "name": "Divider",
      "settings": [
        {
          "type": "select",
          "id": "divider_style",
          "label": "Style",
          "options": [
            {
              "value": "short",
              "label": "Short horizontal"
            },
            {
              "value": "long",
              "label": "Long horizontal"
            },
            {
              "value": "vertical",
              "label": "Vertical"
            }
          ],
          "default": "short"
        },
        {
          "type": "range",
          "id": "divider_width",
          "label": "Thickness",
          "min": 0,
          "max": 5,
          "default": 2,
          "unit": "px"
        },
        {
          "type": "color",
          "id": "divider_color",
          "label": "Color",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "select",
          "id": "alignment",
          "label": "Alignment",
          "options": [
            {
              "value": "start",
              "label": "Left"
            },
            {
              "value": "center",
              "label": "Center"
            },
            {
              "value": "end",
              "label": "Right"
            }
          ],
          "default": "center"
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "select",
          "id": "width",
          "label": "Width",
          "default": "standard",
          "options": [
            {
              "value": "standard",
              "label": "Standard"
            },
            {
              "value": "wide",
              "label": "Wide"
            }
          ]
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 20,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "min": 0,
          "max": 80,
          "default": 20,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            },
            {
              "value": "zoomIn",
              "label": "Zoom in"
            }
          ]
        }
      ]
    },
    {
      "type": "featured_collection",
      "name": "Featured collection",
      "settings": [
        {
          "type": "text",
          "id": "title",
          "label": "Heading",
          "default": "Featured collection"
        },
        {
          "type": "collection",
          "id": "collection",
          "label": "Collection"
        },
        {
          "type": "header",
          "content": "Product"
        },
        {
          "type": "range",
          "id": "products_per",
          "label": "Products per row",
          "min": 2,
          "max": 7,
          "default": 3
        },
        {
          "type": "select",
          "id": "mobile_products_per_row",
          "label": "Products per row on mobile",
          "info": "Applied only when 'Collection layout' is set to 'Grid'.",
          "options": [
            {
              "value": "1",
              "label": "1"
            },
            {
              "value": "2",
              "label": "2"
            }
          ],
          "default": "1"
        },
        {
          "type": "range",
          "id": "products_limit",
          "label": "Limit products",
          "min": 3,
          "max": 20,
          "default": 6
        },
        {
          "type": "checkbox",
          "id": "align_height",
          "label": "Align to height"
        },
        {
          "type": "range",
          "id": "collection_height",
          "label": "Product image height",
          "min": 150,
          "max": 400,
          "step": 10,
          "default": 200,
          "unit": "px",
          "info": "Applied when 'Align to height' is also enabled. [Learn more](https://help.outofthesandbox.com/hc/en-us/articles/360022543913)"
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "radio",
          "id": "collection_style",
          "label": "Collection layout",
          "default": "grid",
          "options": [
            {
              "value": "slider",
              "label": "Slider"
            },
            {
              "value": "grid",
              "label": "Grid"
            }
          ]
        },
        {
          "type": "select",
          "id": "width",
          "label": "Width",
          "options": [
            {
              "value": "standard",
              "label": "Standard"
            },
            {
              "value": "wide",
              "label": "Wide"
            }
          ],
          "default": "standard"
        },
        {
          "type": "checkbox",
          "id": "show_gutter",
          "label": "Show gutter",
          "default": true
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 20,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "min": 0,
          "max": 80,
          "default": 20,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            }
          ]
        }
      ]
    },
    {
      "type": "image_with_overlay",
      "name": "Image with text overlay",
      "settings": [
        {
          "type": "header",
          "content": "Image"
        },
        {
          "type": "image_picker",
          "id": "image",
          "label": "Image",
          "info": "1800 x 900px recommended"
        },
        {
          "type": "image_picker",
          "id": "mobile_image",
          "label": "Mobile image",
          "info": "900 x 1800px recommended"
        },
        {
          "type": "url",
          "id": "link",
          "label": "Link",
          "info": "Only active in absence of buttons"
        },
        {
          "type": "header",
          "content": "Text"
        },
        {
          "type": "richtext",
          "id": "pretext",
          "label": "Preheading",
          "default": "<p>Preheading</p>"
        },
        {
          "type": "text",
          "id": "title",
          "label": "Heading",
          "default": "Image with Text Overlay"
        },
        {
          "type": "richtext",
          "id": "subtitle",
          "label": "Subheading",
          "default": "<p>Additional info in the subheading</p>"
        },
        {
          "type": "color",
          "id": "pretext_color",
          "label": "Preheading",
          "default": "#000000"
        },
        {
          "type": "color",
          "id": "heading_color",
          "label": "Heading",
          "default": "#000000"
        },
        {
          "type": "color",
          "id": "subheading_color",
          "label": "Subheading",
          "default": "#000000"
        },
        {
          "type": "select",
          "id": "text_alignment",
          "label": "Text alignment",
          "options": [
            {
              "value": "left",
              "label": "Left"
            },
            {
              "value": "center",
              "label": "Center"
            },
            {
              "value": "right",
              "label": "Right"
            }
          ],
          "default": "center"
        },
        {
          "type": "select",
          "id": "text_horizontal_position",
          "label": "Horizontal position",
          "options": [
            {
              "value": "left",
              "label": "Left"
            },
            {
              "value": "center",
              "label": "Center"
            },
            {
              "value": "right",
              "label": "Right"
            }
          ],
          "default": "center"
        },
        {
          "type": "select",
          "id": "text_vertical_position",
          "label": "Vertical position",
          "options": [
            {
              "value": "top",
              "label": "Top"
            },
            {
              "value": "middle",
              "label": "Middle"
            },
            {
              "value": "bottom",
              "label": "Bottom"
            }
          ],
          "default": "middle"
        },
        {
          "type": "header",
          "content": "Text background"
        },
        {
          "type": "color",
          "id": "background_color",
          "label": "Background",
          "default": "#FFFFFF"
        },
        {
          "type": "range",
          "id": "background_opacity",
          "label": "Background opacity",
          "min": 0,
          "max": 100,
          "default": 77,
          "unit": "%"
        },
        {
          "type": "color",
          "id": "border_color",
          "label": "Border",
          "default": "#FFFFFF"
        },
        {
          "type": "range",
          "id": "border_width",
          "label": "Border width",
          "min": 0,
          "max": 20,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "text_width",
          "label": "Text width",
          "min": 40,
          "max": 100,
          "default": 40,
          "unit": "%"
        },
        {
          "type": "header",
          "content": "Buttons"
        },
        {
          "type": "text",
          "id": "button_1",
          "label": "Button 1 label",
          "default": "Button 1"
        },
        {
          "type": "url",
          "id": "button_1_link",
          "label": "Button 1 link"
        },
        {
          "type": "select",
          "id": "button_1_style",
          "label": "Button 1 style",
          "options": [
            {
              "value": "button--primary",
              "label": "Primary"
            },
            {
              "value": "button--secondary",
              "label": "Secondary"
            },
            {
              "value": "button--link-style",
              "label": "Link style"
            }
          ],
          "default": "button--secondary"
        },
        {
          "type": "text",
          "id": "button_2",
          "label": "Button 2 label",
          "default": "Button 2"
        },
        {
          "type": "url",
          "id": "button_2_link",
          "label": "Button 2 link"
        },
        {
          "type": "select",
          "id": "button_2_style",
          "label": "Button 2 style",
          "options": [
            {
              "value": "button--primary",
              "label": "Primary"
            },
            {
              "value": "button--secondary",
              "label": "Secondary"
            },
            {
              "value": "button--link-style",
              "label": "Link style"
            }
          ],
          "default": "button--secondary"
        },
        {
          "type": "header",
          "content": "Mobile"
        },
        {
          "type": "select",
          "id": "mobile_image_crop",
          "label": "Image cropping",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "left",
              "label": "Left"
            },
            {
              "value": "center",
              "label": "Center"
            },
            {
              "value": "right",
              "label": "Right"
            }
          ]
        },
        {
          "type": "checkbox",
          "id": "mobile_text_below_image",
          "label": "Show text below image",
          "default": true
        },
        {
          "type": "color",
          "id": "pretext_color_mobile",
          "label": "Preheading",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "color",
          "id": "heading_color_mobile",
          "label": "Heading",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "color",
          "id": "subheading_color_mobile",
          "label": "Subheading",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "select",
          "id": "width",
          "label": "Width",
          "options": [
            {
              "value": "half",
              "label": "Half"
            },
            {
              "value": "standard",
              "label": "Standard"
            },
            {
              "value": "wide",
              "label": "Wide"
            }
          ],
          "default": "wide"
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "default": 0,
          "min": 0,
          "max": 80,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_left",
          "label": "Left spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_right",
          "label": "Right spacing",
          "default": 0,
          "min": 0,
          "max": 80,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            }
          ]
        }
      ]
    },
    {
      "type": "image_with_text",
      "name": "Image with text",
      "settings": [
        {
          "type": "header",
          "content": "Image"
        },
        {
          "type": "select",
          "id": "image_position",
          "label": "Image position",
          "options": [
            {
              "value": "left",
              "label": "Left"
            },
            {
              "value": "right",
              "label": "Right"
            }
          ]
        },
        {
          "type": "image_picker",
          "id": "image",
          "label": "Image",
          "info": "1024 x 1024px recommended"
        },
        {
          "type": "select",
          "id": "image_crop",
          "label": "Image cropping",
          "default": "none",
          "info": "Only applied when text area is taller than the image.",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "left",
              "label": "Left"
            },
            {
              "value": "center",
              "label": "Center"
            },
            {
              "value": "right",
              "label": "Right"
            }
          ]
        },
        {
          "type": "url",
          "id": "image_link",
          "label": "Link"
        },
        {
          "type": "header",
          "content": "Text"
        },
        {
          "type": "text",
          "id": "title",
          "label": "Heading",
          "default": "Heading text here"
        },
        {
          "type": "select",
          "id": "heading_size",
          "label": "Base size",
          "options": [
            {
              "value": "small",
              "label": "Small"
            },
            {
              "value": "regular",
              "label": "Regular"
            },
            {
              "value": "large",
              "label": "Large"
            }
          ],
          "default": "regular"
        },
        {
          "type": "richtext",
          "id": "text",
          "label": "Text",
          "default": "<p>Use this text to share information about your brand with your customers. Describe a product, share announcements, or welcome customers to your store.</p>"
        },
        {
          "type": "text",
          "id": "button_label",
          "label": "Button label",
          "default": "View all"
        },
        {
          "type": "url",
          "id": "link",
          "label": "Button link"
        },
        {
          "type": "select",
          "id": "button_style",
          "label": "Button style",
          "options": [
            {
              "value": "button--primary",
              "label": "Primary"
            },
            {
              "value": "button--secondary",
              "label": "Secondary"
            },
            {
              "value": "button--link-style",
              "label": "Link style"
            }
          ],
          "default": "button--primary"
        },
        {
          "type": "header",
          "content": "Text layout"
        },
        {
          "type": "select",
          "id": "alignment",
          "label": "Alignment",
          "options": [
            {
              "value": "left",
              "label": "Left"
            },
            {
              "value": "center",
              "label": "Center"
            },
            {
              "value": "right",
              "label": "Right"
            }
          ],
          "default": "left"
        },
        {
          "type": "select",
          "id": "vertical_position",
          "label": "Vertical position",
          "options": [
            {
              "value": "start",
              "label": "Top"
            },
            {
              "value": "center",
              "label": "Middle"
            },
            {
              "value": "end",
              "label": "Bottom"
            }
          ],
          "default": "center"
        },
        {
          "type": "header",
          "content": "Colors"
        },
        {
          "type": "color",
          "id": "background",
          "label": "Background",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "color",
          "id": "text_color",
          "label": "Text",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "select",
          "id": "width",
          "label": "Width",
          "default": "standard",
          "options": [
            {
              "value": "standard",
              "label": "Standard"
            },
            {
              "value": "wide",
              "label": "Wide"
            }
          ]
        },
        {
          "type": "checkbox",
          "id": "show_gutter",
          "label": "Show gutter",
          "default": true
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 20,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "min": 0,
          "max": 80,
          "default": 20,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            },
            {
              "value": "zoomIn",
              "label": "Zoom in"
            }
          ]
        }
      ]
    },
    {
      "type": "logo_list",
      "name": "Logo list",
      "settings": [
        {
          "type": "range",
          "id": "logos_per_row",
          "label": "Logos per row",
          "min": 1,
          "max": 8,
          "default": 4
        },
        {
          "type": "select",
          "id": "logo_size",
          "label": "Logo size",
          "default": "medium",
          "options": [
            {
              "value": "small",
              "label": "Small"
            },
            {
              "value": "medium",
              "label": "Medium"
            },
            {
              "value": "large",
              "label": "Large"
            }
          ]
        },
        {
          "type": "header",
          "content": "Content"
        },
        {
          "type": "checkbox",
          "id": "show_logo1",
          "label": "Show logo 1",
          "default": true
        },
        {
          "type": "image_picker",
          "id": "image1",
          "label": "Logo 1",
          "info": "800 x 800px recommended"
        },
        {
          "type": "url",
          "id": "link1",
          "label": "Link 1"
        },
        {
          "type": "checkbox",
          "id": "show_logo2",
          "label": "Show logo 2",
          "default": true
        },
        {
          "type": "image_picker",
          "id": "image2",
          "label": "Logo 2",
          "info": "800 x 800px recommended"
        },
        {
          "type": "url",
          "id": "link2",
          "label": "Link 2"
        },
        {
          "type": "checkbox",
          "id": "show_logo3",
          "label": "Show logo 3",
          "default": true
        },
        {
          "type": "image_picker",
          "id": "image3",
          "label": "Logo 3",
          "info": "800 x 800px recommended"
        },
        {
          "type": "url",
          "id": "link3",
          "label": "Link 3"
        },
        {
          "type": "checkbox",
          "id": "show_logo4",
          "label": "Show logo 4",
          "default": true
        },
        {
          "type": "image_picker",
          "id": "image4",
          "label": "Logo 4",
          "info": "800 x 800px recommended"
        },
        {
          "type": "url",
          "id": "link4",
          "label": "Link 4"
        },
        {
          "type": "checkbox",
          "id": "show_logo5",
          "label": "Show logo 5"
        },
        {
          "type": "image_picker",
          "id": "image5",
          "label": "Logo 5",
          "info": "800 x 800px recommended"
        },
        {
          "type": "url",
          "id": "link5",
          "label": "Link 5"
        },
        {
          "type": "checkbox",
          "id": "show_logo6",
          "label": "Show logo 6"
        },
        {
          "type": "image_picker",
          "id": "image6",
          "label": "Logo 6",
          "info": "800 x 800px recommended"
        },
        {
          "type": "url",
          "id": "link6",
          "label": "Link 6"
        },
        {
          "type": "checkbox",
          "id": "show_logo7",
          "label": "Show logo 7"
        },
        {
          "type": "image_picker",
          "id": "image7",
          "label": "Logo 7",
          "info": "800 x 800px recommended"
        },
        {
          "type": "url",
          "id": "link7",
          "label": "Link 7"
        },
        {
          "type": "checkbox",
          "id": "show_logo8",
          "label": "Show logo 8"
        },
        {
          "type": "image_picker",
          "id": "image8",
          "label": "Logo 8",
          "info": "800 x 800px recommended"
        },
        {
          "type": "url",
          "id": "link8",
          "label": "Link 8"
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 20,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            },
            {
              "value": "zoomIn",
              "label": "Zoom in"
            }
          ]
        }
      ]
    },
    {
      "type": "map",
      "name": "Map",
      "settings": [
        {
          "type": "text",
          "id": "map_address",
          "label": "Address",
          "info": "Google Maps will find the exact location"
        },
        {
          "type": "range",
          "id": "map_height",
          "min": 300,
          "max": 600,
          "step": 10,
          "unit": "px",
          "label": "Map height",
          "default": 400
        },
        {
          "type": "range",
          "id": "zoom_level",
          "min": 1,
          "max": 20,
          "step": 1,
          "unit": "x",
          "label": "Map zoom level",
          "default": 16
        },
        {
          "type": "image_picker",
          "id": "map_image",
          "label": "Image",
          "info": "Displayed when map isn't loaded"
        },
        {
          "type": "header",
          "content": "API key"
        },
        {
          "type": "text",
          "id": "api_key",
          "label": "Google Maps API key",
          "info": "You’ll need to [register a Google Maps API Key](https://help.shopify.com/manual/using-themes/troubleshooting/map-section-api-key) to display the map"
        },
        {
          "type": "checkbox",
          "id": "show_pin",
          "label": "Show pin",
          "info": "Requires use of API key",
          "default": true
        },
        {
          "type": "select",
          "id": "map_style",
          "label": "Map color scheme",
          "options": [
            {
              "value": "default",
              "label": "Default"
            },
            {
              "value": "aubergine",
              "label": "Aubergine"
            },
            {
              "value": "night",
              "label": "Night"
            },
            {
              "value": "retro",
              "label": "Retro"
            },
            {
              "value": "silver",
              "label": "Silver"
            }
          ],
          "default": "default",
          "info": "Requires use of API key"
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "select",
          "id": "width",
          "label": "Width",
          "default": "wide",
          "options": [
            {
              "value": "half",
              "label": "Half"
            },
            {
              "value": "standard",
              "label": "Standard"
            },
            {
              "value": "wide",
              "label": "Wide"
            }
          ]
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_left",
          "label": "Left spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_right",
          "label": "Right spacing",
          "default": 0,
          "min": 0,
          "max": 80,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            },
            {
              "value": "zoomIn",
              "label": "Zoom in"
            }
          ]
        }
      ]
    },
    {
      "type": "page",
      "name": "Page",
      "settings": [
        {
          "type": "page",
          "id": "content_page",
          "label": "Content page"
        },
        {
          "type": "header",
          "content": "Background"
        },
        {
          "type": "color",
          "id": "background",
          "label": "Background",
          "default": "#EEEEEE"
        },
        {
          "type": "color",
          "id": "gradient",
          "label": "Gradient",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "range",
          "id": "gradient_rotation",
          "label": "Gradient rotation",
          "min": 0,
          "max": 180,
          "step": 10,
          "default": 0,
          "unit": "deg"
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "select",
          "id": "width",
          "label": "Width",
          "default": "standard",
          "options": [
            {
              "value": "half",
              "label": "Half"
            },
            {
              "value": "standard",
              "label": "Standard"
            },
            {
              "value": "wide",
              "label": "Wide"
            }
          ]
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 40,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "min": 0,
          "max": 80,
          "default": 40,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_left",
          "label": "Left spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_right",
          "label": "Right spacing",
          "default": 0,
          "min": 0,
          "max": 80,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            },
            {
              "value": "zoomIn",
              "label": "Zoom in"
            }
          ]
        }
      ]
    },
    {
      "type": "product_gallery",
      "name": "Product gallery",
      "limit": 1,
      "settings": [
        {
          "type": "checkbox",
          "id": "display_thumbnails",
          "label": "Show thumbnails",
          "default": true
        },
        {
          "type": "checkbox",
          "id": "gallery_arrows",
          "label": "Show arrows",
          "info": "Applies to desktop only.",
          "default": true
        },
        {
          "type": "checkbox",
          "id": "enable_zoom",
          "label": "Magnify on hover",
          "default": true
        },
        {
          "type": "checkbox",
          "id": "enable_product_lightbox",
          "label": "Enable lightbox",
          "default": true
        },
        {
          "type": "range",
          "id": "slideshow_speed",
          "label": "Gallery speed",
          "min": 0,
          "max": 6,
          "unit": "sec",
          "default": 0,
          "info": "Set to 0 to disable autoplay."
        },
        {
          "type": "select",
          "id": "slideshow_transition",
          "label": "Gallery transition",
          "options": [
            {
              "value": "slide",
              "label": "Slide"
            },
            {
              "value": "fade",
              "label": "Fade"
            }
          ],
          "default": "slide"
        },
        {
          "type": "select",
          "id": "thumbnail_position",
          "label": "Thumbnails",
          "default": "bottom-thumbnails",
          "options": [
            {
              "value": "left-thumbnails",
              "label": "Left"
            },
            {
              "value": "right-thumbnails",
              "label": "Right"
            },
            {
              "value": "bottom-thumbnails",
              "label": "Bottom"
            }
          ]
        },
        {
          "type": "checkbox",
          "id": "enable_thumbnail_slider",
          "label": "Enable thumbnail slider",
          "default": true
        },
        {
          "type": "header",
          "content": "Media",
          "info": "Learn more about [media types](https://help.shopify.com/en/manual/products/product-media)"
        },
        {
          "type": "checkbox",
          "id": "set_product_height",
          "label": "Set height of product media",
          "default": false
        },
        {
          "type": "range",
          "id": "product_height",
          "label": "Product media height",
          "min": 200,
          "max": 800,
          "step": 10,
          "default": 500,
          "unit": "px"
        },
        {
          "type": "checkbox",
          "id": "video_looping",
          "label": "Enable video looping",
          "default": false
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "select",
          "id": "width",
          "label": "Width",
          "default": "standard",
          "options": [
            {
              "value": "half",
              "label": "Half"
            },
            {
              "value": "standard",
              "label": "Standard"
            },
            {
              "value": "wide",
              "label": "Wide"
            }
          ]
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_left",
          "label": "Left spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_right",
          "label": "Right spacing",
          "default": 0,
          "min": 0,
          "max": 80,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            },
            {
              "value": "zoomIn",
              "label": "Zoom in"
            }
          ]
        }
      ]
    },
    {
      "type": "product_info",
      "name": "Product information",
      "limit": 1,
      "settings": [
        {
          "type": "checkbox",
          "id": "display_vendor",
          "label": "Show vendor"
        },
        {
          "type": "checkbox",
          "id": "display_sku",
          "label": "Show SKU"
        },
        {
          "type": "checkbox",
          "id": "enable_shopify_product_badges",
          "label": "Show star rating",
          "info": "Reviews app must be enabled. [Learn more](https://help.outofthesandbox.com/hc/en-us/articles/360008549274#section2)",
          "default": false
        },
        {
          "type": "checkbox",
          "id": "display_savings",
          "label": "Show price savings",
          "default": true
        },
        {
          "type": "checkbox",
          "id": "display_collections",
          "label": "Show collections"
        },
        {
          "type": "checkbox",
          "id": "display_type",
          "label": "Show type"
        },
        {
          "type": "checkbox",
          "id": "display_tags",
          "label": "Show tags"
        },
        {
          "type": "checkbox",
          "id": "display_social_buttons",
          "label": "Show social media share icons",
          "default": true
        },
        {
          "type": "radio",
          "id": "product_description_position",
          "label": "Description position",
          "default": "top",
          "options": [
            {
              "value": "top",
              "label": "Above 'add to cart'"
            },
            {
              "value": "bottom",
              "label": "Below 'add to cart'"
            }
          ]
        },
        {
          "type": "header",
          "content": "Dynamic Checkout Button"
        },
        {
          "type": "checkbox",
          "id": "show_payment_button",
          "label": "Show dynamic checkout button",
          "default": true,
          "info": "Each customer will see their preferred payment method from those available on your store, such as PayPal or Apple Pay. [Learn more](https:\/\/help.shopify.com\/manual\/using-themes\/change-the-layout\/dynamic-checkout)"
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "select",
          "id": "width",
          "label": "Width",
          "default": "standard",
          "options": [
            {
              "value": "half",
              "label": "Half"
            },
            {
              "value": "standard",
              "label": "Standard"
            },
            {
              "value": "wide",
              "label": "Wide"
            }
          ]
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_left",
          "label": "Left spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_right",
          "label": "Right spacing",
          "default": 0,
          "min": 0,
          "max": 80,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            },
            {
              "value": "zoomIn",
              "label": "Zoom in"
            }
          ]
        }
      ]
    },
    {
      "type": "product_reviews",
      "name": "Product reviews",
      "limit": 1,
      "settings": [
        {
          "type": "paragraph",
          "content": "Reviews app must be enabled. [Learn more](https://help.outofthesandbox.com/hc/en-us/articles/360008549274#section2)"
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            },
            {
              "value": "zoomIn",
              "label": "Zoom in"
            }
          ]
        }
      ]
    },
    {
      "name": "Recommended products",
      "type": "recommended_products",
      "limit": 1,
      "settings": [
        {
          "type": "paragraph",
          "content": "This block can be configured using the Recommended Products section settings. [Learn more](https://help.outofthesandbox.com/hc/en-us/articles/360022889333)"
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "select",
          "id": "width",
          "label": "Width",
          "default": "wide",
          "options": [
            {
              "value": "standard",
              "label": "Standard"
            },
            {
              "value": "wide",
              "label": "Wide"
            }
          ]
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 20,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "min": 0,
          "max": 80,
          "default": 20,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            },
            {
              "value": "zoomIn",
              "label": "Zoom in"
            }
          ]
        }
      ]
    },
    {
      "type": "rich_text",
      "name": "Rich text",
      "settings": [
        {
          "type": "header",
          "content": "Heading"
        },
        {
          "type": "text",
          "id": "title",
          "label": "Heading",
          "default": "Catchy heading"
        },
        {
          "type": "font_picker",
          "id": "heading_font",
          "label": "Font",
          "default": "open_sans_n4"
        },
        {
          "type": "color",
          "id": "heading_color",
          "label": "Heading",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "select",
          "id": "heading_alignment",
          "label": "Alignment",
          "options": [
            {
              "value": "left",
              "label": "Left"
            },
            {
              "value": "center",
              "label": "Center"
            },
            {
              "value": "justify",
              "label": "Justified"
            },
            {
              "value": "right",
              "label": "Right"
            }
          ],
          "default": "center"
        },
        {
          "type": "range",
          "id": "heading_size",
          "label": "Base size",
          "min": 20,
          "max": 120,
          "default": 30,
          "unit": "px"
        },
        {
          "type": "header",
          "content": "Text"
        },
        {
          "type": "richtext",
          "id": "text",
          "label": "Text",
          "default": "<p>Use this section to create some callout text on your page, or add more details about your shop, services, promotions, etc.<br>You can keep the background color solid or use a background image instead.</p>"
        },
        {
          "type": "font_picker",
          "id": "text_font",
          "label": "Font",
          "default": "open_sans_n4"
        },
        {
          "type": "color",
          "id": "text_color",
          "label": "Text",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "select",
          "id": "text_alignment",
          "label": "Text alignment",
          "options": [
            {
              "value": "left",
              "label": "Left"
            },
            {
              "value": "center",
              "label": "Center"
            },
            {
              "value": "justify",
              "label": "Justified"
            },
            {
              "value": "right",
              "label": "Right"
            }
          ],
          "default": "center"
        },
        {
          "type": "range",
          "id": "text_size",
          "label": "Base size",
          "min": 8,
          "max": 40,
          "default": 14,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "columns",
          "label": "Columns",
          "min": 1,
          "max": 3,
          "default": 1
        },
        {
          "type": "header",
          "content": "Button"
        },
        {
          "type": "text",
          "id": "button_label",
          "label": "Button label",
          "default": "Read more"
        },
        {
          "type": "url",
          "id": "button_link",
          "label": "Button link"
        },
        {
          "type": "select",
          "id": "button_alignment",
          "label": "Alignment",
          "options": [
            {
              "value": "center",
              "label": "Center"
            },
            {
              "value": "left",
              "label": "Left"
            },
            {
              "value": "right",
              "label": "Right"
            }
          ],
          "default": "center"
        },
        {
          "type": "select",
          "id": "button_style",
          "label": "Style",
          "options": [
            {
              "value": "button--primary",
              "label": "Primary"
            },
            {
              "value": "button--secondary",
              "label": "Secondary"
            },
            {
              "value": "button--link-style",
              "label": "Link style"
            }
          ],
          "default": "button--primary"
        },
        {
          "type": "header",
          "content": "Background"
        },
        {
          "type": "color",
          "id": "background",
          "label": "Background",
          "default": "#EEEEEE"
        },
        {
          "type": "color",
          "id": "gradient",
          "label": "Gradient",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "range",
          "id": "gradient_rotation",
          "label": "Gradient rotation",
          "min": 0,
          "max": 180,
          "step": 10,
          "default": 0,
          "unit": "deg"
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "select",
          "id": "width",
          "label": "Width",
          "default": "standard",
          "options": [
            {
              "value": "half",
              "label": "Half"
            },
            {
              "value": "standard",
              "label": "Standard"
            },
            {
              "value": "wide",
              "label": "Wide"
            }
          ]
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 40,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "min": 0,
          "max": 80,
          "default": 40,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_left",
          "label": "Left spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_right",
          "label": "Right spacing",
          "default": 0,
          "min": 0,
          "max": 80,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            },
            {
              "value": "zoomIn",
              "label": "Zoom in"
            }
          ]
        }
      ]
    },
    {
      "type": "video",
      "name": "Video",
      "settings": [
        {
          "type": "select",
          "id": "aspect_ratio",
          "label": "Aspect ratio",
          "options": [
            {
              "value": "16:9",
              "label": "16:9"
            },
            {
              "value": "4:3",
              "label": "4:3"
            }
          ],
          "default": "16:9"
        },
        {
          "type": "checkbox",
          "id": "autoplay",
          "label": "Autoplay video",
          "info": "Limited browser support for autoplaying video. [Learn more](https:\/\/help.outofthesandbox.com\/hc\/en-us\/articles\/360000661568)",
          "default": false
        },
        {
          "type": "checkbox",
          "id": "autoloop",
          "label": "Autoloop video",
          "default": true
        },
        {
          "type": "checkbox",
          "id": "mute_video",
          "label": "Mute video",
          "default": false
        },
        {
          "type": "checkbox",
          "id": "controls",
          "label": "Show video controls",
          "default": true
        },
        {
          "type": "video_url",
          "id": "iframe_video",
          "label": "YouTube or Vimeo video URL",
          "accept": ["youtube", "vimeo"],
          "default": "https://www.youtube.com/watch?v=8NxS0vrPcsA"
        },
        {
          "type": "text",
          "id": "html5_video",
          "label": "HTML5 MP4/OGV File URL"
        },
        {
          "type": "header",
          "content": "Content"
        },
        {
          "type": "image_picker",
          "id": "image",
          "label": "Image",
          "info": "1600 x 900px recommended"
        },
        {
          "type": "text",
          "id": "pretext",
          "label": "Preheading"
        },
        {
          "type": "text",
          "id": "title",
          "label": "Heading",
          "default": "Featured video"
        },
        {
          "type": "text",
          "id": "subtitle",
          "label": "Subheading",
          "default": "Embed a Youtube or Vimeo video."
        },
        {
          "type": "color",
          "id": "pretext_color",
          "label": "Preheading",
          "default": "#000000"
        },
        {
          "type": "color",
          "id": "heading_color",
          "label": "Heading",
          "default": "#000000"
        },
        {
          "type": "color",
          "id": "subheading_color",
          "label": "Subheading",
          "default": "#000000"
        },
        {
          "type": "select",
          "id": "horizontal_text_position",
          "label": "Horizontal position",
          "options": [
            {
              "value": "left",
              "label": "Left"
            },
            {
              "value": "center",
              "label": "Center"
            },
            {
              "value": "right",
              "label": "Right"
            }
          ],
          "default": "center"
        },
        {
          "type": "select",
          "id": "vertical_text_position",
          "label": "Vertical position",
          "options": [
            {
              "value": "start",
              "label": "Top"
            },
            {
              "value": "center",
              "label": "Middle"
            },
            {
              "value": "end",
              "label": "Bottom"
            }
          ],
          "default": "center"
        },
        {
          "type": "select",
          "id": "text_align",
          "label": "Text alignment",
          "options": [
            {
              "value": "left",
              "label": "Left"
            },
            {
              "value": "center",
              "label": "Center"
            },
            {
              "value": "right",
              "label": "Right"
            }
          ],
          "default": "center"
        },
        {
          "type": "text",
          "id": "button_label",
          "label": "Button label",
          "default": "Play video"
        },
        {
          "type": "select",
          "id": "button_style",
          "label": "Button style",
          "default": "button--secondary",
          "options": [
            {
              "value": "button--primary",
              "label": "Primary"
            },
            {
              "value": "button--secondary",
              "label": "Secondary"
            },
            {
              "value": "button--link-style",
              "label": "Link style"
            }
          ]
        },
        {
          "type": "header",
          "content": "Overlay"
        },
        {
          "type": "select",
          "id": "overlay_style",
          "label": "Overlay style",
          "default": "text_only",
          "options": [
            {
              "value": "full",
              "label": "Full"
            },
            {
              "value": "text_only",
              "label": "Text only"
            },
            {
              "value": "none",
              "label": "None"
            }
          ]
        },
        {
          "type": "color",
          "id": "video_overlay_color",
          "label": "Overlay",
          "default": "#ffffff"
        },
        {
          "type": "color",
          "id": "gradient",
          "label": "Gradient",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "range",
          "id": "gradient_rotation",
          "label": "Gradient rotation",
          "min": 0,
          "max": 180,
          "default": 180,
          "unit": "deg",
          "step": 10
        },
        {
          "type": "range",
          "id": "background_opacity",
          "label": "Background opacity",
          "default": 77,
          "min": 0,
          "max": 100,
          "unit": "%"
        },
        {
          "type": "range",
          "id": "text_width",
          "label": "Text width",
          "min": 40,
          "max": 100,
          "default": 70,
          "unit": "%"
        },
        {
          "type": "header",
          "content": "Mobile"
        },
        {
          "type": "checkbox",
          "id": "mobile_text_below_video",
          "label": "Show text below image",
          "default": true
        },
        {
          "type": "color",
          "id": "pretext_color_mobile",
          "label": "Preheading",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "color",
          "id": "heading_color_mobile",
          "label": "Heading",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "color",
          "id": "subheading_color_mobile",
          "label": "Subheading",
          "default": "rgba(0,0,0,0)"
        },
        {
          "type": "header",
          "content": "Layout"
        },
        {
          "type": "select",
          "id": "width",
          "label": "Width",
          "default": "wide",
          "options": [
            {
              "value": "half",
              "label": "Half"
            },
            {
              "value": "standard",
              "label": "Standard"
            },
            {
              "value": "wide",
              "label": "Wide"
            }
          ]
        },
        {
          "type": "range",
          "id": "padding_top",
          "label": "Top spacing",
          "min": 0,
          "max": 80,
          "default": 20,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_bottom",
          "label": "Bottom spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_left",
          "label": "Left spacing",
          "min": 0,
          "max": 80,
          "default": 0,
          "unit": "px"
        },
        {
          "type": "range",
          "id": "padding_right",
          "label": "Right spacing",
          "default": 0,
          "min": 0,
          "max": 80,
          "unit": "px"
        },
        {
          "type": "select",
          "id": "animation",
          "label": "Animation",
          "default": "none",
          "options": [
            {
              "value": "none",
              "label": "None"
            },
            {
              "value": "fadeIn",
              "label": "Fade in"
            },
            {
              "value": "fadeInDown",
              "label": "Fade in down"
            },
            {
              "value": "fadeInLeft",
              "label": "Fade in left"
            },
            {
              "value": "fadeInRight",
              "label": "Fade in right"
            },
            {
              "value": "slideInLeft",
              "label": "Slide in left"
            },
            {
              "value": "slideInRight",
              "label": "Slide in right"
            },
            {
              "value": "zoomIn",
              "label": "Zoom in"
            }
          ]
        }
      ]
    }
  ],
  "default": {
    "settings": {

    },
    "blocks": [
      {
        "type": "product_info",
        "settings": {
          "width": "half"
        }
      },
      {
        "type": "product_gallery",
        "settings": {
          "width": "half"
        }
      },
      {
        "type": "recommended_products",
        "settings": {
        }
      }
    ]
  }
}

{% endschema %}
Regards
Rob Moore - NEWBY!!
0 Likes
RobMoore007
Explorer
122 1 12

There is also product_main.liquid that seems to have some of the info

 

{% comment %}
** Product - main content area **
- Product template
{% endcomment %}

{% assign id = section.id %}
{% comment %} Layout {% endcomment %}
{% assign width = section.settings.width %}
{% assign padding_top = section.settings.padding_top %}
{% assign padding_bottom = section.settings.padding_bottom %}
{% comment %} Advanced {% endcomment %}
{% assign css_class = section.settings.css_class %}
{% assign custom_css = section.settings.custom_css %}

{% comment %} Section specific CSS {% endcomment %}
{% style %}
  .section__wrapper {
    padding-top: {{ padding_top }}px;
    padding-bottom: {{ padding_bottom }}px;
  }

  .section--has-sidebar-option.has-sidebar-enabled {
    {% if width == 'wide' -%}
      width: 100%;
      max-width: 95%;
    {%- endif %}
  }

  .section--has-sidebar-option.has-sidebar-disabled {
    width: 100%;
    max-width: none;
  }

  {% if section.settings.product_breadcrumb == false %}
    .breadcrumb__container {
      display: none;
    }

  {% endif %}

  {% render 'css-loop',
          css: custom_css,
          id: id
  %}
{% endstyle %}

{% assign collection_handles = product.collections | map: 'handle' %}
{% assign variant = product.selected_or_first_available_variant %}
{% assign product_tags = product.tags | join: ' ' %}

{% render 'product__structured-data' %}

{% comment %} HTML markup {% endcomment %}
<section class="section is-width-{{ width }} {{ css_class }}">
  <div class="product-{{ product.id }}">
    <div class="product_section
                js-product_section
                container
                is-justify-space-between
                has-padding-bottom
                {% if section.settings.product_images_position == 'right' %}
                  is-flex-row-reverse
                {% endif %}"
                data-rv-handle="{{ product.handle }}">

      <div class="product__images
                  one-half
                  column
                  medium-down--one-whole">
        {% render 'product__images',
                product: product,
                display_thumbnails: section.settings.display_thumbnails,
                thumbnail_position: section.settings.thumbnail_position,
                enable_thumbnail_slider: section.settings.enable_thumbnail_slider,
                product_height: section.settings.product_height,
                set_product_height: section.settings.set_product_height,
                video_looping: section.settings.video_looping
                gallery_arrows: section.settings.gallery_arrows,
                slideshow_transition: section.settings.slideshow_transition,
                enable_product_lightbox: section.settings.enable_product_lightbox,
                enable_zoom: section.settings.enable_zoom
        %}
      </div>

      <div class="product__information
                  has-product-sticker
                  one-half
                  column
                  medium-down--one-whole">

        {% comment %} Sale sticker {% endcomment %}
        {% if settings.stickers_enabled %}
          {% render 'product-thumbnail__sticker',
                  context: 'product',
                  collection_handles: collection_handles
          %}
        {% endif %}

        {% comment %} Review stars {% endcomment %}
        {% if section.settings.enable_shopify_product_badges and settings.enable_shopify_review_comments %}
          <div class="spr-badge-container">
            <span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>
          </div>
        {% endif %}

        {% comment %} Vendor {% endcomment %}
        {% if section.settings.display_vendor %}
          <p class="vendor">
            <span class="vendor">{{ product.vendor | link_to_vendor }}</span>
          </p>
        {% endif %}

        {% comment %} Sku {% endcomment %}
        {% if variant.sku != blank and section.settings.display_sku %}
          <p class="sku">
            {{ variant.sku }}
          </p>
        {% endif %}

        <div>

          {% comment %} Name {% endcomment %}
          <h1 class="product_name title">{{ product.title }}</h1>

          {% for tag in product.tags %}
            {% if tag contains 'meta-size-chart-' %}
              {% assign meta-size-chart = true %}
            {% endif %}
          {% endfor %}

          {% comment %} Size chart Mobile {% endcomment %}
          {% if settings.size_chart != blank or meta-size-chart %}
            <a href="javascript&colon;;" class="product__size-chart size-chart--medium-down" data-fancybox data-src="#size-chart{{product.id}}" data-type="inline">{{ 'products.product.size_chart' | t }} {% render 'icon', name: 'right-caret' %}</a>
            {% render 'popup-size-chart', product_id: product.id %}
          {% endif %}

          {% comment %} Price {% endcomment %}
          <p class="modal_price subtitle">
            {% if collection_handles contains 'coming-soon' %}
              {% if settings.stickers_enabled == false %}
                {{ 'collections.general.coming_soon' | t }}
              {% endif %}
            {% else %}

              {% comment %} Sold out {% endcomment %}
              <span class="sold_out">{% if variant.available == false %}{{ 'products.product.sold_out' | t }}{% endif %}</span>

              {% comment %} Compare at (original) price {% endcomment %}
              <span class="was-price">
                {% if variant.price < variant.compare_at_price and variant.available %}
                  <span class="money">
                    {% render 'price-element', price: variant.compare_at_price %}
                  </span>
                {% endif %}
              </span>
            
                          {% comment %} Savings {% endcomment %}
              {% if section.settings.display_savings %}
            <span class="sale savings">
                  {% if variant.price < variant.compare_at_price and variant.available %}
                    {{ 'products.product.savings' | t }}  {{ variant.compare_at_price | minus: variant.price | times: 100 | divided_by: variant.compare_at_price }}% (<span class="money">{% assign compare_at = variant.compare_at_price | minus: variant.price %}{% render 'price-element', price: compare_at %}</span>)
                  {% endif %}
                </span>
              {% endif %}
            
             
             {% comment %} Current price {% endcomment %}
              <span class="{% if variant.compare_at_price > variant.price %}sale{% endif %}">
                <span class="current_price {% if product.available == false %}hidden{% endif %}">
                  {% if variant.price > 0 %}
                    <span class="money">
                      {% render 'price-element', price: variant.price %}
                    </span>
                  {% else %}
                    {{ settings.free_price_text }}
                  {% endif %}
                </span>
              </span>
              {% comment %} Size chart {% endcomment %}
              {% if settings.size_chart != blank or meta-size-chart %}
                <a href="javascript&colon;;" class="product__size-chart medium-down--hidden" data-fancybox data-src="#size-chart{{product.id}}" data-type="inline">{{ 'products.product.size_chart' | t }} {% render 'icon', name: 'right-caret' %}</a>
                {% render 'popup-size-chart', product_id: product.id %}
              {% endif %}


            {% endif %}
          </p>
        </div>

        {% comment %} Description - top {% endcomment %}
        {% if section.settings.product_description_position == "top" %}
          {% if product.description != blank %}
            <div class="description content has-padding-top">
              {{ product.description | split: '<!-- split -->' | first }}
            </div>
          {% endif %}
        {% endif %}
        <!--Advanced Product Start-->
   <!--Advanced Product end -->
        {% comment %} Purchase form {% endcomment %}
        <div class="product-form-container has-padding-top">

          {% comment %} Notify form {% endcomment %}
          {% render 'product__notify-me-form', product: product %}

          {% comment %} Product form {% endcomment %}
          {% unless collection_handles contains 'coming-soon' %}
            {% render 'product__form',
                    context: 'product',
                    show_payment_button: section.settings.show_payment_button,
                    collection_handles: collection_handles
            %}
          {% endunless %}
          
        </div>

        {% comment %} Description - bottom {% endcomment %}
        {% if section.settings.product_description_position == "bottom" %}
          {% if product.description != blank %}
            <div class="description content bottom has-padding-top">
              {{ product.description | split: '<!-- split -->' | first }}
            </div>
          {% endif %}
        {% endif %}
 
        <!--Start tab labels-->
<div class="row">
<div class="nine columns alpha">

       <div class="row cc-two-columns">
<div class="sixteen columns alpha">
</div>
        {% comment %} Collections, type, tags {% endcomment %}
        {% if section.settings.display_collections or section.settings.display_tags or section.settings.display_type %}
          <div class="product__classification-links has-padding-top">
            {% if section.settings.display_collections %}
              <p class="product__collections-list tags">
                <span class="product__classification-title">{{ 'products.product.collections' | t }}:</span>
                {% for col in product.collections %}
                  <span class="tag tag--{{ settings.tag_style }}">
                    <a href="{{ col.url }}" title="{{ col.title }}">{{ col.title }}</a>
                  </span>
                {% endfor %}
              </p>
            {% endif %}

            {% if section.settings.display_type %}
              <p class="product__type-list tags">
                <span class="product__classification-title">{{ 'products.product.product_types' | t }}:</span>
                <span class="tag tag--{{ settings.tag_style }}">{{ product.type | link_to_type }}</span>
              </p>
            {% endif %}

            {% if section.settings.display_tags and product.tags.size > 0 %}
              <p class="product__tags-list tags">
                <span class="product__classification-title">{{ 'products.product.tags' | t }}:</span>
                {% for tag in product.tags %}
                  {% unless tag contains 'meta-' %}
                    <span class="tag tag--{{ settings.tag_style }}">
                      <a href="{{ routes.collections_url }}/{% if collection %}{{ collection.handle }}{% else %}all{% endif %}/{{ tag | handle }}" title="{{ 'products.product.products_tagged' | t: tag: tag }}">{{ tag }}</a>
                    </span>
                  {% endunless %}
                {% endfor %}
              </p>
            {% endif %}
          </div>
        {% endif %}

        {% comment %} Social share icons {% endcomment %}
        {% if section.settings.display_social_buttons %}
          <div class="product__social-share has-padding-top">
            {% render 'social-share-buttons' %}
          </div>
        {% endif %}

      </div>
    </div>

    {% comment %} Description - split {% endcomment %}
    {% if product.description contains "<!-- split -->"  %}
      <div class="product-description-split">
        <div class="description content">
          {{ product.description | split: '<!-- split -->' | last }}
        </div>
      </div>
    {% endif %}
  </div>
</section>
{% comment %} JavaScript {% endcomment %}
<script
  type="application/json"
  data-section-id="{{ section.id }}"
  data-section-data
>
  {
    "gallery_arrows": {{ section.settings.gallery_arrows | json }},
    "thumbnail_arrows": {{ section.settings.gallery_arrows | json }},
    "enable_zoom": {{ section.settings.enable_zoom | json }},
    "enable_product_lightbox": {{ section.settings.enable_product_lightbox | json }},
    "enable_thumbnail_slider": {{ section.settings.enable_thumbnail_slider | json }},
    "slideshow_speed": {{ section.settings.slideshow_speed | json }},
    "slideshow_transition": {{ section.settings.slideshow_transition | json }},
    "thumbnails_enabled": {{ section.settings.display_thumbnails | json }},
    "thumbnail_position": {{ section.settings.thumbnail_position | json }},
    "product_media_amount": {{ product.media.size }},
    "template": "classic"
  }
</script>
<script src="{{ 'z__jsProduct.js' | asset_url }}"></script>
<div>
</section>
<section class="section is-width-{{ width }} {{ css_class }}">
   <!--Start CSS For Tabs-->
        
<style>
    ul.tabs  {
    display: none
    font-family: sans-serif;
    font-size: 16px;
    font-weight: 510;
    padding-top: 0px;
	padding-bottom: 0px;
    align-items: left;
    background: lightgrey; /* CHANGE THE COLOUR HERE */
	border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

  .twelve {
  border-color: #71823c;
  border-style: solid;
  border-width: 1px;
  border-bottom-width: 3px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  }

  li.tabs {
  cursor: pointer;
  }

  ul.tabs-content {
  font-family: sans-serif;
  align-items: left;
  justify-content: top;
  margin-bottom: 1px;
  padding: 2.2em 2.2em;
  vertical-align: top;  
  padding-top: 0em;
}
  
  .accordion {
  
  }

</style>
<div class="row">
  <div class="twelve columns alpha desktop-tabs {% if product.handle == "gift-card" %}hide{% endif %}"> 
  <ul class="tabs">{% if product.metafields.overview.info != blank %}
  <li><a class="tabs active" href="#tab1">Overview</a></li>
  {% endif %}
  {% if product.metafields.features.detail != blank %}
  <li><a{% if product.metafields.overview.info == blank %} class="active"{% endif %} href="#tab2">Features</a></li>
  {% endif %}
  {% if product.metafields.size.guide != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail == blank %} class="active"{% endif %} href="#tab3">Size Guide</a></li>
  {% endif %}
  {% if product.metafields.custom.fit != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit == blank %} class="active"{% endif %} href="#tab4">Custom Fit</a></li>
  {% endif %}
  {% if product.metafields.techi.info != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info == blank %} class="active"{% endif %} href="#tab5">Tech Info</a></li>
  {% endif %}
  {% if product.metafields.terms.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text == blank %} class="active"{% endif %} href="#tab6">T&Cs</a></li>
  {% endif %}
  {% if product.metafields.specifications.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text == blank %} class="active"{% endif %} href="#tab7">Specifications</a></li>
  {% endif %}
  {% if product.metafields.lithium.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text == blank %} class="active"{% endif %} href="#tab8">Lithium</a></li>
  {% endif %}
  {% if product.metafields.charging.advice != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice == blank %} class="active"{% endif %} href="#tab9">Charging Advice</a></li>
  {% endif %}
  {% if product.metafields.warranty.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text == blank %} class="active"{% endif %} href="#tab10">Warranty</a></li>
  {% endif %}
  {% if product.metafields.care_instructions.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text and product.metafields.care_instructions.text == blank %} class="active"{% endif %} href="#tab11">Care Instructions</a></li>
  {% endif %}
  {% if product.metafields.returns.policy != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text and product.metafields.care_instructions.text and product.metafields.returns.policy == blank %} class="active"{% endif %} href="#tab12">Returns</a></li>
  {% endif %}
  {% if product.metafields.goretex.info != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text and product.metafields.care_instructions.text and product.metafields.returns.policy and product.metafields.goretex.info  == blank %} class="active"{% endif %} href="#tab13">Gore Tex Info</a></li>
  {% endif %}
  {% if product.metafields.interface1.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text and product.metafields.care_instructions.text and product.metafields.returns.policy and product.metafields.goretex.info and product.metafields.interface1.text  == blank %} class="active"{% endif %} href="#tab14">Interface-1</a></li>
  {% endif %}
  {% if product.metafields.video.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text and product.metafields.care_instructions.text and product.metafields.returns.policy and product.metafields.goretex.info and product.metafields.interface1.text and product.metafields.video.text  == blank %} class="active"{% endif %} href="#tab15">Video</a></li>
  {% endif %}
  {% if product.metafields.Personalisation.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text and product.metafields.care_instructions.text and product.metafields.returns.policy and product.metafields.goretex.info and product.metafields.interface1.text and product.metafields.video.text and product.metafields.Personalisation.text  == blank %} class="active"{% endif %} href="#tab16">Personalisation</a></li>
  {% endif %}</ul>
  
  <!--Start tab content-->
  <ul class="tabs-content">{% if product.metafields.overview.info !=blank %}
  <li class="tab1 active">{{product.metafields.overview.info}}
  {% endif %} 
  {% if product.metafields.features.detail !=blank %}
  <li class="tab2">{{product.metafields.features.detail}}</li>
  {% endif %} 
  {% if product.metafields.size.guide !=blank %}
  <li id="tab3">{{product.metafields.size.guide}}</li>
  {% endif %}
  {% if product.metafields.custom.fit !=blank %}
  <li id="tab4">{{product.metafields.custom.fit}}</li>
  {% endif %}
  {% if product.metafields.techi.info !=blank %}
  <li id="tab5">{{product.metafields.techi.info}}</li>
  {% endif %}
  {% if product.metafields.terms.text !=blank %}
  <li id="tab6">{{product.metafields.terms.text}}</li>
  {% endif %}
  {% if product.metafields.specifications.text !=blank %}
  <li id="tab7">{{product.metafields.specifications.text}}</li>
  {% endif %}
  {% if product.metafields.lithium.text !=blank %}
  <li id="tab8">{{product.metafields.lithium.text}}</li>
  {% endif %}
  {% if product.metafields.charging.advice !=blank %}
  <li id="tab9">{{product.metafields.charging.advice}}</li>
  {% endif %}
  {% if product.metafields.warranty.text !=blank %}
  <li id="tab10">{{product.metafields.warranty.text}}</li>
  {% endif %}
  {% if product.metafields.care_instructions.text !=blank %}
  <li id="tab11">{{product.metafields.care_instructions.text}}</li>
  {% endif %}
  {% if product.metafields.returns.policy !=blank %}
  <li id="tab12">{{product.metafields.returns.policyt}}</li>
  {% endif %}
  {% if product.metafields.goretex.info !=blank %}
  <li id="tab13">{{product.metafields.goretex.info}}</li>
  {% endif %}
  {% if product.metafields.interface1.text !=blank %}
  <li id="tab14">{{product.metafields.interface1.text}}</li>
  {% endif %}
  {% if product.metafields.video.text !=blank %}
  <li id="tab15">{{product.metafields.video.text}}</li>
  {% endif %}
  {% if product.metafields.Personalisation.text !=blank %}
  <li id="tab16">{{product.metafields.personalisation.text}}</li>
  {% endif %}</ul>
    </div>
  
  
  <!--Start mobile accordion content-->
  
  <div class="mobile-accordion four columns omega {% if product.handle == "gift-card" %}hide{% endif %}">
    <div id="accordion">
    {% if product.metafields.overview.info != blank %}
      <div class="button mobile-accordion-button active" role="button">
          <h5>Overview</h5>
      </div>
      <div  class="slide mobile-accordion-slide {% if product.metafields.overview.info != blank %}overview-slide{% endif %}">
        {% if product.metafields.overview.info !=blank %}
          <p>{{product.metafields.overview.info}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.features.detail!= blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Features</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.features.detail !=blank %}
          {{product.metafields.features.detail}}
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.size.guide != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Size Guide</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.size.guide !=blank %}
          <p>{{product.metafields.size.guide}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.custom.fit != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Custom Fit</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.custom.fit !=blank %}
          <p>{{product.metafields.custom.fit}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.techi.info != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Tech Info</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.techi.info !=blank %}
          <p>{{product.metafields.techi.info}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.terms.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>T&Cs</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.terms.text !=blank %}
          <p>{{product.metafields.terms.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.specifications.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Specifications</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.specifications.text !=blank %}
          <p>{{product.metafields.specifications.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.lithium.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Lithium</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.lithium.text !=blank %}
          <p>{{product.metafields.lithium.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.charging.advice != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Charging Advice</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.charging.advice !=blank %}
          <p>{{product.metafields.charging.advice}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.warranty.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Warranty</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.warranty.text !=blank %}
          <p>{{product.metafields.warranty.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.care_instructions.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Care Instructions</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.care_instructions.text !=blank %}
          <p>{{product.metafields.care_instructions.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
    
    {% if product.metafields.returns.policy != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Returns</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.returns.policy !=blank %}
          <p>{{product.metafields.returns.policy}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.goretex.info != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Gore Tex Info</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.goretex.info !=blank %}
          <p>{{product.metafields.goretex.info}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.interface1.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Interface-1</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.interface1.text !=blank %}
          <p>{{product.metafields.interface1.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.video.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Video</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.video.text !=blank %}
          <p>{{product.metafields.video.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
      {% if product.metafields.Personalisation.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Personalisation</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.Personalisation.text !=blank %}
          <p>{{product.metafields.Personalisation.text}}</p>
        {% endif %} 
      </div>
      {% endif %}
  
    </div>
  </div>
  <!--End mobile accordion content-->
  {% comment%}
  <div class="four columns omega {% if product.handle == "gift-card" %}hide{% endif %}">
  <dl class="accordion bottom-accordion">
  <dt><a href="/products/gift-card"><i class="fa fa-gift" aria-hidden="true"></i>Gift Vouchers<small class="right"><i class="fa fa-chevron-down" aria-hidden="false"></i></small></a></dt>
  <dd>
    Available from £10 to any value. The cards can be used online or at our shops in St Andrews.
    <a class="desc-link" href="#">Buy here <i class="fa fa-chevron-right" aria-hidden="false"></i></a>
  </dd>
  <dt><a href="#"><i class="fa fa-wrench custom-icons" aria-hidden="true"></i>Golf Services<small class="right"><i class="fa fa-chevron-down" aria-hidden="true"></i></small></a></dt>
  <dd>
    We have a full custom fitting suite in St Andrews using state of the art Trackman technology where our qualified custom fitters will help and advise you on the most suitable fit and brand of clubs for your game.
    <a class="desc-link" href="/pages/custom-club-fitting-services">Book A Custom Fitting <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
  	<a class="desc-link" href="/pages/club-rental-services"><br>Club Rental <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
    <a class="desc-link" href="/pages/golf-workshop-repair-services"><br>Golf Workshop Services <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
    </dd>
  <dt><a href="#"><i class="fa fa-shopping-basket" aria-hidden="true"></i>Old Course<small class="right"><i class="fa fa-chevron-down" aria-hidden="true"></i></small></a></dt>
  <dd>
    The Old Course collection from Auchterlonies of St Andrews features a wide range of clothing, accessories and apparel with our unique Old Course St Andrews crest.
    <a class="desc-link" href="/collections/old-course-catalogue">Explore the range <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
  </dd>
  <dt><a href="#"><i class="fa fa-truck custom-icons" aria-hidden="true"></i>Shipping Info<small class="right"><i class="fa fa-chevron-down" aria-hidden="true"></i></small></a></dt>
  <dd>
    We are currently offering free UK shipping on all purchases over £75 in basket for UK and EU customers and £100 for US and rest of the world customers. (Free shipping applies to non-discounted items)
    <a class="desc-link" href="#">Find out more <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
  </dd>
  <dt><a href="#"><i class="fa fa-check-circle custom-icons" aria-hidden="true"></i> Authorised Stock<small class="right"><i class="fa fa-chevron-down" aria-hidden="true"></i></small></a></dt>
  <dd>
    We are Authorised Stockists of the finest golf brands. All available online and in our store here in St Andrews.
    <a class="desc-link" href="/pages/collections">Search our brands <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
  </dd>
  </dl>
  </div>
  {% endcomment %}
  
  <div class="description-accordion four columns omega {% if product.handle == "gift-card" %}hide{% endif %}">
    <div class="testingexample" id="accordion">
  
      <div class="button description-accordion-button active" role="button">
          <i class="fa fa-gift" aria-hidden="true"></i><h5>Gift Vouchers</h5><i class="fa fa-chevron-down" aria-hidden="true"></i>
      </div>
      <div class="slide description-slide first-slide">
        Available from £10 to any value. The cards can be used online or at our shops in St Andrews.
        <a class="desc-link" href="/products/gift-card"><br>Buy here <i class="fa fa-chevron-right" aria-hidden="false"></i></a>
      </div>
  
      <div class="button description-accordion-button" role="button">
        <i class="fa fa-wrench custom-icons" aria-hidden="true"></i><h5>Golf Services</h5><i class="fa fa-chevron-down" aria-hidden="true"></i>
      </div>
      <div class="slide description-slide">
        We have a full custom fitting suite in St Andrews using state of the art Trackman technology where our qualified custom fitters will help and advise you on the most suitable fit and brand of clubs for your game. We also have the latest clubs for hire and a full club repair service.
        <a class="desc-link" href="/pages/custom-club-fitting-services"><br>Book A Custom Fitting <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
      	<a class="desc-link" href="/pages/club-rental-services"><br>Club Rental <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
        <a class="desc-link" href="/pages/golf-workshop-repair-services"><br>Golf Workshop Services <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
      </div>
  
      <div class="button description-accordion-button" role="button">
        <i class="fa fa-shopping-basket" aria-hidden="true"></i><h5>Old Course</h5><i class="fa fa-chevron-down" aria-hidden="true"></i>
      </div>
      <div class="slide description-slide">
        The Old Course collection from Auchterlonies of St Andrews features a wide range of clothing, accessories and apparel with our unique Old Course St Andrews crest.
        <a class="desc-link" href="/collections/old-course-catalogue"><br>Explore the range <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
      </div>
  
      <div class="button description-accordion-button" role="button">
        <i class="fa fa-truck custom-icons" aria-hidden="true"></i><h5>Shipping Info</h5><i class="fa fa-chevron-down" aria-hidden="true"></i>
      </div>
      <div class="slide description-slide">
        We are currently offering free UK shipping on all purchases over £75 in basket for UK and EU customers and £100 for US and rest of the world customers. (Free shipping applies to non-discounted items)
        <a class="desc-link" href="#"><br>Find out more <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
      </div>
  
      <div class="button description-accordion-button" role="button">
        <i class="fa fa-check-circle custom-icons" aria-hidden="true"></i><h5>Authorised Stock</h5><i class="fa fa-chevron-down" aria-hidden="true"></i>
      </div>
      <div class="slide description-slide">
        We are Authorised Stockists of the finest golf brands. All available online and in our store here in St Andrews.
        <a class="desc-link" href="/pages/collections"><br>Search our brands <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
      </div>
    </div>
  </div>
         
{% render "custom-video" %}
  
{% comment %} Shopify-XR {% endcomment %}
{% if product.media %}
  <script>
    window.ShopifyXR=window.ShopifyXR||function(){(ShopifyXR.q=ShopifyXR.q||[]).push(arguments)}
      {% assign models = product.media | where: 'media_type', 'model' | json %}
      ShopifyXR('addModels', {{ models }});
  </script>
{% endif %}

{% if section.blocks.size > 0 %}

  <div class="product__blocks dynamic-blocks is-flex is-flex-wrap is-justify-center" data-check-for-order="true">
    {% for block in section.blocks %}
      {%- assign animation = block.settings.animation | default: 'none' -%}
      {%- assign width = block.settings.width -%}

      <div id="shopify-section-{{ block.id }}" {{ block.shopify_attributes }} class="shopify-section product__block block__{{ block.type | downcase | replace: '_', '-' }}
        {% if block.type == 'featured_collection' %}
          jsFeaturedCollection
        {% elsif block.type == 'image_with_overlay' %}
          overlaid-header-option
        {% elsif block.type == 'featured_product' %}
          jsProduct
        {% elsif block.type == 'map' %}
          jsMap
        {% elsif block.type == 'video' %}
          jsVideo
        {% endif %}">
        {% if block.type == 'product_reviews' %}
          {% comment %} Product reviews {% endcomment %}
          {% include 'include-reviews', type: 'block' %}

        {% elsif block.type == 'image_with_overlay' %}
          {% comment %} Image with text overlay {% endcomment %}
          {% include 'include-image-with-text-overlay', type: 'block' %}

        {% elsif block.type == 'image_with_text' %}
          {% comment %} Image with text {% endcomment %}
          {% include 'include-one-image-with-text', type: 'block' %}

        {% elsif block.type == 'rich_text' %}
          {% comment %} Rich text {% endcomment %}
          {% include 'include-rich-text', type: 'block' %}

        {% elsif block.type == 'video' %}
          {% comment %} Featured video {% endcomment %}
          {% include 'include-video', type: 'block' %}

        {% elsif block.type == "blog" %}
          {% comment %} Blog {% endcomment %}
          {% include 'include-featured-blog', type: 'block' %}

        {% elsif block.type == 'featured_collection' %}
          {% comment %} Featured collection {% endcomment %}
          {% include 'include-featured-collection', type: 'block' %}

        {% elsif block.type == 'logo_list' %}
          {% comment %} Logo list {% endcomment %}
          {% include 'include-logo-list', type: 'block' %}

        {% elsif block.type == "divider" %}
          {% comment %} Divider {% endcomment %}
          {% include 'include-divider', type: 'block' %}

        {% elsif block.type == 'map' %}
          {% comment %} Map {% endcomment %}
          {% include 'include-map', type: 'block' %}

        {% elsif block.type == "page" %}
          {% comment %} Page {% endcomment %}
          {% include 'include-content-page', type: 'block' %}

        {% elsif block.type == 'recommended_products' %}
          {% comment %} Recommended products {% endcomment %}
          <section class="section is-width-{{ width }}" data-product-recommendations-container
              {% if animation != "none" %}
                data-scroll-class="{{ animation }}"
              {% endif %}>
          </section>

          {% style %}
            #shopify-section-{{ block.id }} {
              padding-top: {{ block.settings.padding_top }}px;
              padding-bottom: {{ block.settings.padding_bottom }}px;
              width: 95%;
              {% if block.settings.width == 'wide' %}
                width: 100%;
              {% endif %}
            }
          {% endstyle %}

        {% endif %}
      </div>

    {% endfor %}

  </div>
{% endif %}

{% comment %} Used to ensure product review app installs succesfully {% endcomment %}
<div class="is-hidden">
  <div id="shopify-product-reviews" data-id="{{ product.id }}">
    {{ product.metafields.spr.reviews }}
  </div>
</div>

 

Regards
Rob Moore - NEWBY!!
0 Likes
Michal_Morek
Shopify Partner
498 41 81

Hello @RobMoore007

Backup product_main.liquid and replaces its content with:

{% comment %}
** Product - main content area **
- Product template
{% endcomment %}

{% assign id = section.id %}
{% comment %} Layout {% endcomment %}
{% assign width = section.settings.width %}
{% assign padding_top = section.settings.padding_top %}
{% assign padding_bottom = section.settings.padding_bottom %}
{% comment %} Advanced {% endcomment %}
{% assign css_class = section.settings.css_class %}
{% assign custom_css = section.settings.custom_css %}

{% comment %} Section specific CSS {% endcomment %}
{% style %}
  .section__wrapper {
    padding-top: {{ padding_top }}px;
    padding-bottom: {{ padding_bottom }}px;
  }

span.flex-style {
    display: flex;
}

  .section--has-sidebar-option.has-sidebar-enabled {
    {% if width == 'wide' -%}
      width: 100%;
      max-width: 95%;
    {%- endif %}
  }

  .section--has-sidebar-option.has-sidebar-disabled {
    width: 100%;
    max-width: none;
  }

  {% if section.settings.product_breadcrumb == false %}
    .breadcrumb__container {
      display: none;
    }

  {% endif %}

  {% render 'css-loop',
          css: custom_css,
          id: id
  %}
{% endstyle %}

{% assign collection_handles = product.collections | map: 'handle' %}
{% assign variant = product.selected_or_first_available_variant %}
{% assign product_tags = product.tags | join: ' ' %}

{% render 'product__structured-data' %}

{% comment %} HTML markup {% endcomment %}
<section class="section is-width-{{ width }} {{ css_class }}">
  <div class="product-{{ product.id }}">
    <div class="product_section
                js-product_section
                container
                is-justify-space-between
                has-padding-bottom
                {% if section.settings.product_images_position == 'right' %}
                  is-flex-row-reverse
                {% endif %}"
                data-rv-handle="{{ product.handle }}">

      <div class="product__images
                  one-half
                  column
                  medium-down--one-whole">
        {% render 'product__images',
                product: product,
                display_thumbnails: section.settings.display_thumbnails,
                thumbnail_position: section.settings.thumbnail_position,
                enable_thumbnail_slider: section.settings.enable_thumbnail_slider,
                product_height: section.settings.product_height,
                set_product_height: section.settings.set_product_height,
                video_looping: section.settings.video_looping
                gallery_arrows: section.settings.gallery_arrows,
                slideshow_transition: section.settings.slideshow_transition,
                enable_product_lightbox: section.settings.enable_product_lightbox,
                enable_zoom: section.settings.enable_zoom
        %}
      </div>

      <div class="product__information
                  has-product-sticker
                  one-half
                  column
                  medium-down--one-whole">

        {% comment %} Sale sticker {% endcomment %}
        {% if settings.stickers_enabled %}
          {% render 'product-thumbnail__sticker',
                  context: 'product',
                  collection_handles: collection_handles
          %}
        {% endif %}

        {% comment %} Review stars {% endcomment %}
        {% if section.settings.enable_shopify_product_badges and settings.enable_shopify_review_comments %}
          <div class="spr-badge-container">
            <span class="shopify-product-reviews-badge" data-id="{{ product.id }}"></span>
          </div>
        {% endif %}

        {% comment %} Vendor {% endcomment %}
        {% if section.settings.display_vendor %}
          <p class="vendor">
            <span class="vendor">{{ product.vendor | link_to_vendor }}</span>
          </p>
        {% endif %}

        {% comment %} Sku {% endcomment %}
        {% if variant.sku != blank and section.settings.display_sku %}
          <p class="sku">
            {{ variant.sku }}
          </p>
        {% endif %}

        <div>

          {% comment %} Name {% endcomment %}
          <h1 class="product_name title">{{ product.title }}</h1>

          {% for tag in product.tags %}
            {% if tag contains 'meta-size-chart-' %}
              {% assign meta-size-chart = true %}
            {% endif %}
          {% endfor %}

          {% comment %} Size chart Mobile {% endcomment %}
          {% if settings.size_chart != blank or meta-size-chart %}
            <a href="javascript&colon;;" class="product__size-chart size-chart--medium-down" data-fancybox data-src="#size-chart{{product.id}}" data-type="inline">{{ 'products.product.size_chart' | t }} {% render 'icon', name: 'right-caret' %}</a>
            {% render 'popup-size-chart', product_id: product.id %}
          {% endif %}

          {% comment %} Price {% endcomment %}
          <p class="modal_price subtitle">
            {% if collection_handles contains 'coming-soon' %}
              {% if settings.stickers_enabled == false %}
                {{ 'collections.general.coming_soon' | t }}
              {% endif %}
            {% else %}

              {% comment %} Sold out {% endcomment %}
              <span class="sold_out">{% if variant.available == false %}{{ 'products.product.sold_out' | t }}{% endif %}</span>

             
               <span class="flex-style">
                   {% comment %} Compare at (original) price {% endcomment %}
                   <span class="was-price">
                        {% if variant.price < variant.compare_at_price and variant.available %}
                            <span class="money">
                                {% render 'price-element', price: variant.compare_at_price %}
                            </span>
                        {% endif %}
                     </span>

        {% comment %} Savings {% endcomment %}
              {% if section.settings.display_savings %}
            <span class="sale savings">
                  {% if variant.price < variant.compare_at_price and variant.available %}
                    {{ 'products.product.savings' | t }}  {{ variant.compare_at_price | minus: variant.price | times: 100 | divided_by: variant.compare_at_price }}% <span class="money">({% assign compare_at = variant.compare_at_price | minus: variant.price %}{% render 'price-element', price: compare_at %})</span>
                  {% endif %}
                </span>
              {% endif %}

               </span>
  
             {% comment %} Current price {% endcomment %}
              <span class="{% if variant.compare_at_price > variant.price %}sale{% endif %}">
                <span class="current_price {% if product.available == false %}hidden{% endif %}">
                  {% if variant.price > 0 %}
                    <span class="money">
                      {% render 'price-element', price: variant.price %}
                    </span>
                  {% else %}
                    {{ settings.free_price_text }}
                  {% endif %}
                </span>
              </span>
              {% comment %} Size chart {% endcomment %}
              {% if settings.size_chart != blank or meta-size-chart %}
                <a href="javascript&colon;;" class="product__size-chart medium-down--hidden" data-fancybox data-src="#size-chart{{product.id}}" data-type="inline">{{ 'products.product.size_chart' | t }} {% render 'icon', name: 'right-caret' %}</a>
                {% render 'popup-size-chart', product_id: product.id %}
              {% endif %}


            {% endif %}
          </p>
        </div>

        {% comment %} Description - top {% endcomment %}
        {% if section.settings.product_description_position == "top" %}
          {% if product.description != blank %}
            <div class="description content has-padding-top">
              {{ product.description | split: '<!-- split -->' | first }}
            </div>
          {% endif %}
        {% endif %}
        <!--Advanced Product Start-->
   <!--Advanced Product end -->
        {% comment %} Purchase form {% endcomment %}
        <div class="product-form-container has-padding-top">

          {% comment %} Notify form {% endcomment %}
          {% render 'product__notify-me-form', product: product %}

          {% comment %} Product form {% endcomment %}
          {% unless collection_handles contains 'coming-soon' %}
            {% render 'product__form',
                    context: 'product',
                    show_payment_button: section.settings.show_payment_button,
                    collection_handles: collection_handles
            %}
          {% endunless %}
          
        </div>

        {% comment %} Description - bottom {% endcomment %}
        {% if section.settings.product_description_position == "bottom" %}
          {% if product.description != blank %}
            <div class="description content bottom has-padding-top">
              {{ product.description | split: '<!-- split -->' | first }}
            </div>
          {% endif %}
        {% endif %}
 
        <!--Start tab labels-->
<div class="row">
<div class="nine columns alpha">

       <div class="row cc-two-columns">
<div class="sixteen columns alpha">
</div>
        {% comment %} Collections, type, tags {% endcomment %}
        {% if section.settings.display_collections or section.settings.display_tags or section.settings.display_type %}
          <div class="product__classification-links has-padding-top">
            {% if section.settings.display_collections %}
              <p class="product__collections-list tags">
                <span class="product__classification-title">{{ 'products.product.collections' | t }}:</span>
                {% for col in product.collections %}
                  <span class="tag tag--{{ settings.tag_style }}">
                    <a href="{{ col.url }}" title="{{ col.title }}">{{ col.title }}</a>
                  </span>
                {% endfor %}
              </p>
            {% endif %}

            {% if section.settings.display_type %}
              <p class="product__type-list tags">
                <span class="product__classification-title">{{ 'products.product.product_types' | t }}:</span>
                <span class="tag tag--{{ settings.tag_style }}">{{ product.type | link_to_type }}</span>
              </p>
            {% endif %}

            {% if section.settings.display_tags and product.tags.size > 0 %}
              <p class="product__tags-list tags">
                <span class="product__classification-title">{{ 'products.product.tags' | t }}:</span>
                {% for tag in product.tags %}
                  {% unless tag contains 'meta-' %}
                    <span class="tag tag--{{ settings.tag_style }}">
                      <a href="{{ routes.collections_url }}/{% if collection %}{{ collection.handle }}{% else %}all{% endif %}/{{ tag | handle }}" title="{{ 'products.product.products_tagged' | t: tag: tag }}">{{ tag }}</a>
                    </span>
                  {% endunless %}
                {% endfor %}
              </p>
            {% endif %}
          </div>
        {% endif %}

        {% comment %} Social share icons {% endcomment %}
        {% if section.settings.display_social_buttons %}
          <div class="product__social-share has-padding-top">
            {% render 'social-share-buttons' %}
          </div>
        {% endif %}

      </div>
    </div>

    {% comment %} Description - split {% endcomment %}
    {% if product.description contains "<!-- split -->"  %}
      <div class="product-description-split">
        <div class="description content">
          {{ product.description | split: '<!-- split -->' | last }}
        </div>
      </div>
    {% endif %}
  </div>
</section>
{% comment %} JavaScript {% endcomment %}
<script
  type="application/json"
  data-section-id="{{ section.id }}"
  data-section-data
>
  {
    "gallery_arrows": {{ section.settings.gallery_arrows | json }},
    "thumbnail_arrows": {{ section.settings.gallery_arrows | json }},
    "enable_zoom": {{ section.settings.enable_zoom | json }},
    "enable_product_lightbox": {{ section.settings.enable_product_lightbox | json }},
    "enable_thumbnail_slider": {{ section.settings.enable_thumbnail_slider | json }},
    "slideshow_speed": {{ section.settings.slideshow_speed | json }},
    "slideshow_transition": {{ section.settings.slideshow_transition | json }},
    "thumbnails_enabled": {{ section.settings.display_thumbnails | json }},
    "thumbnail_position": {{ section.settings.thumbnail_position | json }},
    "product_media_amount": {{ product.media.size }},
    "template": "classic"
  }
</script>
<script src="{{ 'z__jsProduct.js' | asset_url }}"></script>
<div>
</section>
<section class="section is-width-{{ width }} {{ css_class }}">
   <!--Start CSS For Tabs-->
        
<style>
    ul.tabs  {
    display: none
    font-family: sans-serif;
    font-size: 16px;
    font-weight: 510;
    padding-top: 0px;
	padding-bottom: 0px;
    align-items: left;
    background: lightgrey; /* CHANGE THE COLOUR HERE */
	border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

  .twelve {
  border-color: #71823c;
  border-style: solid;
  border-width: 1px;
  border-bottom-width: 3px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  }

  li.tabs {
  cursor: pointer;
  }

  ul.tabs-content {
  font-family: sans-serif;
  align-items: left;
  justify-content: top;
  margin-bottom: 1px;
  padding: 2.2em 2.2em;
  vertical-align: top;  
  padding-top: 0em;
}
  
  .accordion {
  
  }

</style>
<div class="row">
  <div class="twelve columns alpha desktop-tabs {% if product.handle == "gift-card" %}hide{% endif %}"> 
  <ul class="tabs">{% if product.metafields.overview.info != blank %}
  <li><a class="tabs active" href="#tab1">Overview</a></li>
  {% endif %}
  {% if product.metafields.features.detail != blank %}
  <li><a{% if product.metafields.overview.info == blank %} class="active"{% endif %} href="#tab2">Features</a></li>
  {% endif %}
  {% if product.metafields.size.guide != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail == blank %} class="active"{% endif %} href="#tab3">Size Guide</a></li>
  {% endif %}
  {% if product.metafields.custom.fit != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit == blank %} class="active"{% endif %} href="#tab4">Custom Fit</a></li>
  {% endif %}
  {% if product.metafields.techi.info != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info == blank %} class="active"{% endif %} href="#tab5">Tech Info</a></li>
  {% endif %}
  {% if product.metafields.terms.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text == blank %} class="active"{% endif %} href="#tab6">T&Cs</a></li>
  {% endif %}
  {% if product.metafields.specifications.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text == blank %} class="active"{% endif %} href="#tab7">Specifications</a></li>
  {% endif %}
  {% if product.metafields.lithium.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text == blank %} class="active"{% endif %} href="#tab8">Lithium</a></li>
  {% endif %}
  {% if product.metafields.charging.advice != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice == blank %} class="active"{% endif %} href="#tab9">Charging Advice</a></li>
  {% endif %}
  {% if product.metafields.warranty.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text == blank %} class="active"{% endif %} href="#tab10">Warranty</a></li>
  {% endif %}
  {% if product.metafields.care_instructions.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text and product.metafields.care_instructions.text == blank %} class="active"{% endif %} href="#tab11">Care Instructions</a></li>
  {% endif %}
  {% if product.metafields.returns.policy != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text and product.metafields.care_instructions.text and product.metafields.returns.policy == blank %} class="active"{% endif %} href="#tab12">Returns</a></li>
  {% endif %}
  {% if product.metafields.goretex.info != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text and product.metafields.care_instructions.text and product.metafields.returns.policy and product.metafields.goretex.info  == blank %} class="active"{% endif %} href="#tab13">Gore Tex Info</a></li>
  {% endif %}
  {% if product.metafields.interface1.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text and product.metafields.care_instructions.text and product.metafields.returns.policy and product.metafields.goretex.info and product.metafields.interface1.text  == blank %} class="active"{% endif %} href="#tab14">Interface-1</a></li>
  {% endif %}
  {% if product.metafields.video.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text and product.metafields.care_instructions.text and product.metafields.returns.policy and product.metafields.goretex.info and product.metafields.interface1.text and product.metafields.video.text  == blank %} class="active"{% endif %} href="#tab15">Video</a></li>
  {% endif %}
  {% if product.metafields.Personalisation.text != blank %}
  <li><a{% if product.metafields.overview.info == blank and product.metafields.features.detail and product.metafields.custom.fit and product.metafields.techi.info and product.metafields.terms.text and product.metafields.specifications.text and product.metafields.lithium.text and product.metafields.charging.advice and product.metafields.warranty.text and product.metafields.care_instructions.text and product.metafields.returns.policy and product.metafields.goretex.info and product.metafields.interface1.text and product.metafields.video.text and product.metafields.Personalisation.text  == blank %} class="active"{% endif %} href="#tab16">Personalisation</a></li>
  {% endif %}</ul>
  
  <!--Start tab content-->
  <ul class="tabs-content">{% if product.metafields.overview.info !=blank %}
  <li class="tab1 active">{{product.metafields.overview.info}}
  {% endif %} 
  {% if product.metafields.features.detail !=blank %}
  <li class="tab2">{{product.metafields.features.detail}}</li>
  {% endif %} 
  {% if product.metafields.size.guide !=blank %}
  <li id="tab3">{{product.metafields.size.guide}}</li>
  {% endif %}
  {% if product.metafields.custom.fit !=blank %}
  <li id="tab4">{{product.metafields.custom.fit}}</li>
  {% endif %}
  {% if product.metafields.techi.info !=blank %}
  <li id="tab5">{{product.metafields.techi.info}}</li>
  {% endif %}
  {% if product.metafields.terms.text !=blank %}
  <li id="tab6">{{product.metafields.terms.text}}</li>
  {% endif %}
  {% if product.metafields.specifications.text !=blank %}
  <li id="tab7">{{product.metafields.specifications.text}}</li>
  {% endif %}
  {% if product.metafields.lithium.text !=blank %}
  <li id="tab8">{{product.metafields.lithium.text}}</li>
  {% endif %}
  {% if product.metafields.charging.advice !=blank %}
  <li id="tab9">{{product.metafields.charging.advice}}</li>
  {% endif %}
  {% if product.metafields.warranty.text !=blank %}
  <li id="tab10">{{product.metafields.warranty.text}}</li>
  {% endif %}
  {% if product.metafields.care_instructions.text !=blank %}
  <li id="tab11">{{product.metafields.care_instructions.text}}</li>
  {% endif %}
  {% if product.metafields.returns.policy !=blank %}
  <li id="tab12">{{product.metafields.returns.policyt}}</li>
  {% endif %}
  {% if product.metafields.goretex.info !=blank %}
  <li id="tab13">{{product.metafields.goretex.info}}</li>
  {% endif %}
  {% if product.metafields.interface1.text !=blank %}
  <li id="tab14">{{product.metafields.interface1.text}}</li>
  {% endif %}
  {% if product.metafields.video.text !=blank %}
  <li id="tab15">{{product.metafields.video.text}}</li>
  {% endif %}
  {% if product.metafields.Personalisation.text !=blank %}
  <li id="tab16">{{product.metafields.personalisation.text}}</li>
  {% endif %}</ul>
    </div>
  
  
  <!--Start mobile accordion content-->
  
  <div class="mobile-accordion four columns omega {% if product.handle == "gift-card" %}hide{% endif %}">
    <div id="accordion">
    {% if product.metafields.overview.info != blank %}
      <div class="button mobile-accordion-button active" role="button">
          <h5>Overview</h5>
      </div>
      <div  class="slide mobile-accordion-slide {% if product.metafields.overview.info != blank %}overview-slide{% endif %}">
        {% if product.metafields.overview.info !=blank %}
          <p>{{product.metafields.overview.info}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.features.detail!= blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Features</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.features.detail !=blank %}
          {{product.metafields.features.detail}}
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.size.guide != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Size Guide</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.size.guide !=blank %}
          <p>{{product.metafields.size.guide}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.custom.fit != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Custom Fit</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.custom.fit !=blank %}
          <p>{{product.metafields.custom.fit}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.techi.info != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Tech Info</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.techi.info !=blank %}
          <p>{{product.metafields.techi.info}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.terms.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>T&Cs</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.terms.text !=blank %}
          <p>{{product.metafields.terms.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.specifications.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Specifications</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.specifications.text !=blank %}
          <p>{{product.metafields.specifications.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.lithium.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Lithium</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.lithium.text !=blank %}
          <p>{{product.metafields.lithium.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.charging.advice != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Charging Advice</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.charging.advice !=blank %}
          <p>{{product.metafields.charging.advice}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.warranty.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Warranty</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.warranty.text !=blank %}
          <p>{{product.metafields.warranty.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.care_instructions.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Care Instructions</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.care_instructions.text !=blank %}
          <p>{{product.metafields.care_instructions.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
    
    {% if product.metafields.returns.policy != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Returns</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.returns.policy !=blank %}
          <p>{{product.metafields.returns.policy}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.goretex.info != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Gore Tex Info</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.goretex.info !=blank %}
          <p>{{product.metafields.goretex.info}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.interface1.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Interface-1</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.interface1.text !=blank %}
          <p>{{product.metafields.interface1.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
    {% if product.metafields.video.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Video</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.video.text !=blank %}
          <p>{{product.metafields.video.text}}</p>
        {% endif %} 
      </div>
    {% endif %}
  
      {% if product.metafields.Personalisation.text != blank %}
      <div class="button mobile-accordion-button" role="button">
          <h5>Personalisation</h5>
      </div>
      <div class="slide mobile-accordion-slide">
        {% if product.metafields.Personalisation.text !=blank %}
          <p>{{product.metafields.Personalisation.text}}</p>
        {% endif %} 
      </div>
      {% endif %}
  
    </div>
  </div>
  <!--End mobile accordion content-->
  {% comment%}
  <div class="four columns omega {% if product.handle == "gift-card" %}hide{% endif %}">
  <dl class="accordion bottom-accordion">
  <dt><a href="/products/gift-card"><i class="fa fa-gift" aria-hidden="true"></i>Gift Vouchers<small class="right"><i class="fa fa-chevron-down" aria-hidden="false"></i></small></a></dt>
  <dd>
    Available from £10 to any value. The cards can be used online or at our shops in St Andrews.
    <a class="desc-link" href="#">Buy here <i class="fa fa-chevron-right" aria-hidden="false"></i></a>
  </dd>
  <dt><a href="#"><i class="fa fa-wrench custom-icons" aria-hidden="true"></i>Golf Services<small class="right"><i class="fa fa-chevron-down" aria-hidden="true"></i></small></a></dt>
  <dd>
    We have a full custom fitting suite in St Andrews using state of the art Trackman technology where our qualified custom fitters will help and advise you on the most suitable fit and brand of clubs for your game.
    <a class="desc-link" href="/pages/custom-club-fitting-services">Book A Custom Fitting <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
  	<a class="desc-link" href="/pages/club-rental-services"><br>Club Rental <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
    <a class="desc-link" href="/pages/golf-workshop-repair-services"><br>Golf Workshop Services <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
    </dd>
  <dt><a href="#"><i class="fa fa-shopping-basket" aria-hidden="true"></i>Old Course<small class="right"><i class="fa fa-chevron-down" aria-hidden="true"></i></small></a></dt>
  <dd>
    The Old Course collection from Auchterlonies of St Andrews features a wide range of clothing, accessories and apparel with our unique Old Course St Andrews crest.
    <a class="desc-link" href="/collections/old-course-catalogue">Explore the range <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
  </dd>
  <dt><a href="#"><i class="fa fa-truck custom-icons" aria-hidden="true"></i>Shipping Info<small class="right"><i class="fa fa-chevron-down" aria-hidden="true"></i></small></a></dt>
  <dd>
    We are currently offering free UK shipping on all purchases over £75 in basket for UK and EU customers and £100 for US and rest of the world customers. (Free shipping applies to non-discounted items)
    <a class="desc-link" href="#">Find out more <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
  </dd>
  <dt><a href="#"><i class="fa fa-check-circle custom-icons" aria-hidden="true"></i> Authorised Stock<small class="right"><i class="fa fa-chevron-down" aria-hidden="true"></i></small></a></dt>
  <dd>
    We are Authorised Stockists of the finest golf brands. All available online and in our store here in St Andrews.
    <a class="desc-link" href="/pages/collections">Search our brands <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
  </dd>
  </dl>
  </div>
  {% endcomment %}
  
  <div class="description-accordion four columns omega {% if product.handle == "gift-card" %}hide{% endif %}">
    <div class="testingexample" id="accordion">
  
      <div class="button description-accordion-button active" role="button">
          <i class="fa fa-gift" aria-hidden="true"></i><h5>Gift Vouchers</h5><i class="fa fa-chevron-down" aria-hidden="true"></i>
      </div>
      <div class="slide description-slide first-slide">
        Available from £10 to any value. The cards can be used online or at our shops in St Andrews.
        <a class="desc-link" href="/products/gift-card"><br>Buy here <i class="fa fa-chevron-right" aria-hidden="false"></i></a>
      </div>
  
      <div class="button description-accordion-button" role="button">
        <i class="fa fa-wrench custom-icons" aria-hidden="true"></i><h5>Golf Services</h5><i class="fa fa-chevron-down" aria-hidden="true"></i>
      </div>
      <div class="slide description-slide">
        We have a full custom fitting suite in St Andrews using state of the art Trackman technology where our qualified custom fitters will help and advise you on the most suitable fit and brand of clubs for your game. We also have the latest clubs for hire and a full club repair service.
        <a class="desc-link" href="/pages/custom-club-fitting-services"><br>Book A Custom Fitting <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
      	<a class="desc-link" href="/pages/club-rental-services"><br>Club Rental <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
        <a class="desc-link" href="/pages/golf-workshop-repair-services"><br>Golf Workshop Services <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
      </div>
  
      <div class="button description-accordion-button" role="button">
        <i class="fa fa-shopping-basket" aria-hidden="true"></i><h5>Old Course</h5><i class="fa fa-chevron-down" aria-hidden="true"></i>
      </div>
      <div class="slide description-slide">
        The Old Course collection from Auchterlonies of St Andrews features a wide range of clothing, accessories and apparel with our unique Old Course St Andrews crest.
        <a class="desc-link" href="/collections/old-course-catalogue"><br>Explore the range <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
      </div>
  
      <div class="button description-accordion-button" role="button">
        <i class="fa fa-truck custom-icons" aria-hidden="true"></i><h5>Shipping Info</h5><i class="fa fa-chevron-down" aria-hidden="true"></i>
      </div>
      <div class="slide description-slide">
        We are currently offering free UK shipping on all purchases over £75 in basket for UK and EU customers and £100 for US and rest of the world customers. (Free shipping applies to non-discounted items)
        <a class="desc-link" href="#"><br>Find out more <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
      </div>
  
      <div class="button description-accordion-button" role="button">
        <i class="fa fa-check-circle custom-icons" aria-hidden="true"></i><h5>Authorised Stock</h5><i class="fa fa-chevron-down" aria-hidden="true"></i>
      </div>
      <div class="slide description-slide">
        We are Authorised Stockists of the finest golf brands. All available online and in our store here in St Andrews.
        <a class="desc-link" href="/pages/collections"><br>Search our brands <i class="fa fa-chevron-right" aria-hidden="true"></i></a>
      </div>
    </div>
  </div>
         
{% render "custom-video" %}
  
{% comment %} Shopify-XR {% endcomment %}
{% if product.media %}
  <script>
    window.ShopifyXR=window.ShopifyXR||function(){(ShopifyXR.q=ShopifyXR.q||[]).push(arguments)}
      {% assign models = product.media | where: 'media_type', 'model' | json %}
      ShopifyXR('addModels', {{ models }});
  </script>
{% endif %}

{% if section.blocks.size > 0 %}

  <div class="product__blocks dynamic-blocks is-flex is-flex-wrap is-justify-center" data-check-for-order="true">
    {% for block in section.blocks %}
      {%- assign animation = block.settings.animation | default: 'none' -%}
      {%- assign width = block.settings.width -%}

      <div id="shopify-section-{{ block.id }}" {{ block.shopify_attributes }} class="shopify-section product__block block__{{ block.type | downcase | replace: '_', '-' }}
        {% if block.type == 'featured_collection' %}
          jsFeaturedCollection
        {% elsif block.type == 'image_with_overlay' %}
          overlaid-header-option
        {% elsif block.type == 'featured_product' %}
          jsProduct
        {% elsif block.type == 'map' %}
          jsMap
        {% elsif block.type == 'video' %}
          jsVideo
        {% endif %}">
        {% if block.type == 'product_reviews' %}
          {% comment %} Product reviews {% endcomment %}
          {% include 'include-reviews', type: 'block' %}

        {% elsif block.type == 'image_with_overlay' %}
          {% comment %} Image with text overlay {% endcomment %}
          {% include 'include-image-with-text-overlay', type: 'block' %}

        {% elsif block.type == 'image_with_text' %}
          {% comment %} Image with text {% endcomment %}
          {% include 'include-one-image-with-text', type: 'block' %}

        {% elsif block.type == 'rich_text' %}
          {% comment %} Rich text {% endcomment %}
          {% include 'include-rich-text', type: 'block' %}

        {% elsif block.type == 'video' %}
          {% comment %} Featured video {% endcomment %}
          {% include 'include-video', type: 'block' %}

        {% elsif block.type == "blog" %}
          {% comment %} Blog {% endcomment %}
          {% include 'include-featured-blog', type: 'block' %}

        {% elsif block.type == 'featured_collection' %}
          {% comment %} Featured collection {% endcomment %}
          {% include 'include-featured-collection', type: 'block' %}

        {% elsif block.type == 'logo_list' %}
          {% comment %} Logo list {% endcomment %}
          {% include 'include-logo-list', type: 'block' %}

        {% elsif block.type == "divider" %}
          {% comment %} Divider {% endcomment %}
          {% include 'include-divider', type: 'block' %}

        {% elsif block.type == 'map' %}
          {% comment %} Map {% endcomment %}
          {% include 'include-map', type: 'block' %}

        {% elsif block.type == "page" %}
          {% comment %} Page {% endcomment %}
          {% include 'include-content-page', type: 'block' %}

        {% elsif block.type == 'recommended_products' %}
          {% comment %} Recommended products {% endcomment %}
          <section class="section is-width-{{ width }}" data-product-recommendations-container
              {% if animation != "none" %}
                data-scroll-class="{{ animation }}"
              {% endif %}>
          </section>

          {% style %}
            #shopify-section-{{ block.id }} {
              padding-top: {{ block.settings.padding_top }}px;
              padding-bottom: {{ block.settings.padding_bottom }}px;
              width: 95%;
              {% if block.settings.width == 'wide' %}
                width: 100%;
              {% endif %}
            }
          {% endstyle %}

        {% endif %}
      </div>

    {% endfor %}

  </div>
{% endif %}

{% comment %} Used to ensure product review app installs succesfully {% endcomment %}
<div class="is-hidden">
  <div id="shopify-product-reviews" data-id="{{ product.id }}">
    {{ product.metafields.spr.reviews }}
  </div>
</div>

 

If you found this comment useful then please hit Like and Accept the Solution!
If you would like to hire us as Shopify experts, please reach out via email or private message.
Founder of Shopify agency - Accomplishify.com
Contact me on: michal.morek@accomplishify.com
0 Likes
RobMoore007
Explorer
122 1 12

Thanks very much but I can still see the brackets at the end of saving () 

I need to hide these.. See screen shot below

t?Screen Shot 2021-05-17 at 07.05.06.png

Regards
Rob Moore - NEWBY!!
0 Likes