Make text column with images (Images) clickable

Technical Q&A
1

I’m facing a problem I’d like to add link to every images in (text column with images) .

I tried more than one code and all of them is not working .

thank you

{% liquid
assign sid = section.id
assign arrows = section.settings.arrows
assign dots = section.settings.dots

%}

{%- for i in (1..1) -%}
{%- if section.settings.hidden %}{% break %}{% endif -%}

{% if section.settings.title!= blank %}

{% if section.settings.sub_title!= blank %}
{{section.settings.sub_title}}
{% endif %}

{% if section.settings.title != blank %}

{{section.settings.title}}

{% endif %}

{% if section.settings.content!= blank %}

{{section.settings.content}}
{% endif %}
{% endif %} {% include 'grid-slider', settings:section.settings %}
{%- for block in section.blocks -%} {%- assign image = block.settings.image -%} {%- assign url = block.settings.url -%}
{%- if block.settings.enable_image -%}
{%- if image != blank %}{% assign img_url = image | img_url: '1x1' | replace: '_1x1.', '_{width}x.' -%}
{%- else -%} {%- endif -%}
{%- endif -%}
{% if block.settings.title != blank %}

{{ block.settings.title | escape }}

{% endif %}

{% if block.settings.text != blank %}

{{ block.settings.text }}
{% endif %} {% if block.settings.btn_title != blank %} {%endif%}
{%- endfor -%}
{%if dots %}
{%endif%} {%if arrows%}
{% endif %}
{%- render 'section_style' -%} {%- endfor -%}

{%- schema -%}
{
“name”: “Text Column With Image”,
“class”: “cms_section type_gallery laber_text-column-with-image”,
“max_blocks”: 30,
“settings”: [
{
“type”: “checkbox”,
“id”: “hidden”,
“label”: “Hidden Section?”,
“default”: false
},
{
“type”: “header”,
“content”: “== Title Settings”
},
{
“type”: “text”,
“id”: “title”,
“label”: “Heading”,
“default”: “Text column with image”
},
{
“type”: “text”,
“id”: “sub_title”,
“label”: “Sub Text”
},
{
“type”: “textarea”,
“id”: “content”,
“label”: “Content”,
“default”: “Commodo sociosqu venenatis cras dolor sagittis integer luctus maecenas.”
},
{
“type”: “header”,
“content”: “---- Slider Show Collection ----”,
“info”: “Refer to the attribute values here”
},
{
“type”: “checkbox”,
“id”: “use-slider”,
“label”: “Use slider?”,
“default”: true
},
{
“type”: “range”,
“id”: “slides-To-Scroll”,
“label”: “Slide to scroll”,
“info”: “The number of items slide to scroll”,
“min”: 1,
“max”: 8,
“step”: 1,
“unit”: “pds”,
“default”: 1
},
{
“type”: “range”,
“id”: “visible”,
“label”: “Columns in Visible”,
“info”: “Item(s) in screen ( Size >= 1920 )”,
“min”: 1,
“max”: 8,
“step”: 1,
“unit”: “pds”,
“default”: 5
},
{
“type”: “range”,
“id”: “widescreen”,
“label”: “Columns in Widescreen”,
“info”: “Item(s) in screen ( 1366 <= Size < 1920 )”,
“min”: 1,
“max”: 8,
“step”: 1,
“unit”: “pds”,
“default”: 4
},
{
“type”: “range”,
“id”: “desktop”,
“label”: “Columns in Desktop”,
“info”: “Item(s) in screen ( 1200 <= Size < 1480 )”,
“min”: 1,
“max”: 8,
“step”: 1,
“unit”: “pds”,
“default”: 4
},
{
“type”: “range”,
“id”: “laptop”,
“label”: “Columns in Laptop”,
“info”: “Item(s) in screen ( 992 <= Size < 1200 )”,
“min”: 1,
“max”: 8,
“step”: 1,
“unit”: “pds”,
“default”: 4
},
{
“type”: “range”,
“id”: “notebook”,
“label”: “Columns in Notebook”,
“info”: “Item(s) in screen ( 768 <= Size < 992 )”,
“min”: 1,
“max”: 8,
“step”: 1,
“unit”: “pds”,
“default”: 3
},
{
“type”: “range”,
“id”: “tablet”,
“label”: “Columns in Tablet”,
“info”: “Item(s) in screen ( 576 <= Size < 768 )”,
“min”: 1,
“max”: 8,
“step”: 1,
“unit”: “pds”,
“default”: 3
},
{
“type”: “range”,
“id”: “landscape”,
“label”: “Columns in Landscape”,
“info”: “Item(s) in screen ( 480 <= Size < 576 )”,
“min”: 1,
“max”: 6,
“step”: 1,
“unit”: “pds”,
“default”: 2
},
{
“type”: “range”,
“id”: “portrait”,
“label”: “Columns in Portrait”,
“info”: “Item(s) in screen ( 360 < Size < 480 )”,
“min”: 1,
“max”: 6,
“step”: 1,
“unit”: “pds”,
“default”: 2
},
{
“type”: “range”,
“id”: “mobile”,
“label”: “Columns in Mobile”,
“info”: “Item(s) in screen ( Size < = 360 )”,
“min”: 1,
“max”: 4,
“step”: 1,
“unit”: “pds”,
“default”: 1
},
{
“type”: “range”,
“id”: “rows”,
“label”: “Rows Slider”,
“min”: 1,
“max”: 3,
“step”: 1,
“unit”: “pds”,
“default”: 1
},
{
“type”: “checkbox”,
“id”: “autoplay”,
“label”: “Autoplay”,
“default”: true
},
{
“type”: “text”,
“id”: “speed”,
“label”: “Speed”,
“default”: “300”,
“info”: “Autoplay Speed in milliseconds”
},
{
“type”: “text”,
“id”: “autoplay-Speed”,
“label”: “Auto Play Speed”,
“default”: “3000”,
“info”: “Autoplay Speed in milliseconds”
},
{
“type”: “checkbox”,
“id”: “arrows”,
“label”: “Arrows”,
“default”: true
},
{
“type”: “checkbox”,
“id”: “fade”,
“label”: “Fade”,
“default”: false,
“info”: “Only use for 1 column”
},
{
“type”: “checkbox”,
“id”: “center-Mode”,
“label”: “Center Mode”,
“default”: false
},
{
“type”: “checkbox”,
“id”: “adaptive-Height”,
“label”: “Adaptive Height”,
“default”: false
},
{
“type”: “checkbox”,
“id”: “dots”,
“label”: “Dots”,
“default”: false
},
{
“type”: “checkbox”,
“id”: “infinite”,
“label”: “Infinite”,
“default”: false
},
{
“type”: “range”,
“id”: “padding”,
“label”: “padding”,
“info”: “Distance between items”,
“min”: 0,
“max”: 30,
“step”: 5,
“unit”: “px”,
“default”: 10
},
{
“type”: “checkbox”,
“id”: “vertical”,
“label”: “Vertical”,
“default”: false
},

{
“type”: “header”,
“content”: “== Design Options”
},
{
“type”: “select”,
“id”: “layout”,
“options”: [
{
“value”: “container”,
“label”: “Container”
},
{
“value”: “full-width”,
“label”: “Full Width”
}
],
“label”: “Layout”
},
{
“type”: “color”,
“id”: “cl_bg”,
“label”: “Background color”,
“default”: “#fff”
},
{
“type”: “text”,
“id”: “mg”,
“label”: “Margin”,
“info”:“Margin top, margin right, margin bottom, margin left. If you not use to blank”
},
{
“type”: “text”,
“id”: “pd”,
“label”: “Padding”,
“info”:“Padding top, padding right, padding bottom, padding left. If you not use to blank”
},
{
“type”: “header”,
“content”: “== Design Mobile Options”
},
{
“type”: “text”,
“id”: “mg_mb”,
“label”: “Margin”
},
{
“type”: “text”,
“id”: “pd_mb”,
“label”: “Padding”
}
],
“blocks”: [{
“type”: “text_block”,
“name”: “Column”,
“settings”: [
{
“type”: “checkbox”,
“id”: “enable_image”,
“label”: “Show image?”,
“default”: true
},
{
“type”: “image_picker”,
“id”: “image”,
“label”: “Image”
},
{
“type”: “text”,
“id”: “title”,
“label”: “Heading”,
“default”: “Add a title or tagline”
},
{
“type”: “richtext”,
“id”: “text”,
“label”: “Text”,
“default”: “

Share blog posts, products, or promotions with your customers. Use this text to describe products, share details on availability and style, or as a space to display recent reviews or FAQs.

”
},
{
“type”: “text”,
“id”: “btn_title”,
“label”: “Button label”,
“default”:“MORE INFO <i class="icon-chevrons-right">”
},
{
“type”: “url”,
“id”: “btn_link”,
“label”: “Button link”,
“info”: “Note: if you want to display this button then you need to fill button link”
},
{
“type”: “select”,
“id”: “open_link”,
“options”: [
{
“value”: “_self”,
“label”: “Current window (_self)”
},
{
“value”: “_blank”,
“label”: “New window (_blank)”
}
],
“label”: “Open link in”,
“default”: “_blank”
}

]
}],
“presets”: [
{
“name”: “Text column with image”,
“category”: “Images”,
“blocks”: [
{ “type”: “text_block” },
{ “type”: “text_block” },
{ “type”: “text_block” }
]
}
]
}
{% endschema %}

2

Hello , How can I add manually . There is no add link box