Hi @hannahdossary ,
Please change all code:
{%- assign direction = 'ltr' -%}
{%- case request.locale.iso_code -%}
{%- when 'ar' or 'arc' or 'dv' or 'fa' or 'ha' or 'he' or 'kwh' or 'ks' or 'ku' or 'ps' or 'ur' or 'yi' -%}
{%- assign direction = 'rtl' -%}
{%- endcase -%}
{% schema %}
{
"name": "Shop the look",
"class": "shopify-section--shop-the-look",
"max_blocks": 7,
"blocks": [
{
"type": "look",
"name": "Look",
"settings": [
{
"type": "image_picker",
"id": "image",
"label": "Image",
"info": "2160 x 1000px .jpg recommended"
},
{
"type": "image_picker",
"id": "mobile_image",
"label": "Mobile image",
"info": "1000 x 800px .jpg recommended. Default image is used if none is selected. To position the hotspots precisely, switch to mobile mode."
},
{
"type": "select",
"id": "dot_type",
"label": "Hotspot style",
"options": [
{
"value": "normal",
"label": "Normal"
},
{
"value": "inverted",
"label": "Inverted"
}
],
"default": "normal"
},
{
"type": "header",
"content": "Product 1"
},
{
"type": "product",
"id": "product_1",
"label": "Product"
},
{
"type": "range",
"id": "product_1_horizontal_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position",
"default": 10
},
{
"type": "range",
"id": "product_1_vertical_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position",
"default": 10
},
{
"type": "range",
"id": "product_1_horizontal_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position (mobile image)",
"default": 10
},
{
"type": "range",
"id": "product_1_vertical_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position (mobile image)",
"default": 10
},
{
"type": "header",
"content": "Product 2"
},
{
"type": "product",
"id": "product_2",
"label": "Product"
},
{
"type": "range",
"id": "product_2_horizontal_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position",
"default": 20
},
{
"type": "range",
"id": "product_2_vertical_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position",
"default": 20
},
{
"type": "range",
"id": "product_2_horizontal_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position (mobile image)",
"default": 20
},
{
"type": "range",
"id": "product_2_vertical_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position (mobile image)",
"default": 20
},
{
"type": "header",
"content": "Product 3"
},
{
"type": "product",
"id": "product_3",
"label": "Product"
},
{
"type": "range",
"id": "product_3_horizontal_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position",
"default": 30
},
{
"type": "range",
"id": "product_3_vertical_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position",
"default": 30
},
{
"type": "range",
"id": "product_3_horizontal_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position (mobile image)",
"default": 30
},
{
"type": "range",
"id": "product_3_vertical_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position (mobile image)",
"default": 30
},
{
"type": "header",
"content": "Product 4"
},
{
"type": "product",
"id": "product_4",
"label": "Product"
},
{
"type": "range",
"id": "product_4_horizontal_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position",
"default": 40
},
{
"type": "range",
"id": "product_4_vertical_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position",
"default": 40
},
{
"type": "range",
"id": "product_4_horizontal_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position (mobile image)",
"default": 40
},
{
"type": "range",
"id": "product_4_vertical_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position (mobile image)",
"default": 40
},
{
"type": "header",
"content": "Product 5"
},
{
"type": "product",
"id": "product_5",
"label": "Product"
},
{
"type": "range",
"id": "product_5_horizontal_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position",
"default": 50
},
{
"type": "range",
"id": "product_5_vertical_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position",
"default": 50
},
{
"type": "range",
"id": "product_5_horizontal_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position (mobile image)",
"default": 50
},
{
"type": "range",
"id": "product_5_vertical_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position (mobile image)",
"default": 50
},
{
"type": "header",
"content": "Product 6"
},
{
"type": "product",
"id": "product_6",
"label": "Product"
},
{
"type": "range",
"id": "product_6_horizontal_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position",
"default": 60
},
{
"type": "range",
"id": "product_6_vertical_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position",
"default": 60
},
{
"type": "range",
"id": "product_6_horizontal_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position (mobile image)",
"default": 60
},
{
"type": "range",
"id": "product_6_vertical_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position (mobile image)",
"default": 60
},
{
"type": "header",
"content": "Product 7"
},
{
"type": "product",
"id": "product_7",
"label": "Product"
},
{
"type": "range",
"id": "product_7_horizontal_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position",
"default": 70
},
{
"type": "range",
"id": "product_7_vertical_position",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position",
"default": 70
},
{
"type": "range",
"id": "product_7_horizontal_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Horizontal position (mobile image)",
"default": 70
},
{
"type": "range",
"id": "product_7_vertical_position_mobile",
"min": 5,
"max": 95,
"step": 1,
"unit": "%",
"label": "Vertical position (mobile image)",
"default": 70
}
]
}
],
"settings": [
{
"type": "checkbox",
"id": "reveal_on_scroll",
"label": "Reveal on scroll",
"info": "Show animation when section becomes visible.",
"default": true
},
{
"type": "text",
"id": "label",
"label": "Navigation label",
"default": "Shop the looks",
"info": "Shown when multiple looks are featured."
}
],
"presets": [
{
"name": "Shop the look",
"blocks": [
{
"type": "look",
"settings": {
"dot_type": "inverted"
}
}
]
}
]
}
{% endschema %}
Hope it helps!