Hello , i want to ask the experts how can you make an image to be clickable on the debute theme , i dont want to have the text in the middle and the button on the image so i removed them , but i cannot see any option to link the image to a link .
My website: https://ultrabass.myshopify.com/
Password: 1234
Thankyou !
Hi Roland,
Just took a look at your site . Which images ate you trying to add a link to? Everything on the homepage should have that feature built in already and you can change those links through thr customizer tool. If you can point me in the right spot illI be happy to let you know what code youāll need changed.
Thanks,
I am trying to add a like to the slide images , at the slide there are 4 images that change every 5 seconds , i want to add link to those 4 images.
Roland,
What I would recommend, since youāre not using the button or text overlay which come standard on this theme, would be to alter the code in your hero.liquid and slideshow.liquid files to pull the link url from the āButton Linkā field in your customization settings. This will make it easy to change the link as you change/update the individual slides/photos in the future rather than hard coding that information in. Of course, youād have to change the code to apply the link to the hero image itself, and not the button.
This would require a solid understanding of html, css and liquid to change. Iām happy to help get this done for you if you need further assistance. Feel free to drop me an email.
Thanks,
I have basic understanding in html , so if someone can point out for me what to edit in code , i can do it, so can you explain what do i have to edit in the slideshow.liquid ?
I tried to add the following code into the hero.liquid :
But sadly it doesnt do anything ā¦
Nobody had this problem ?
Nobody ???
I have this issue to Roland. Sorry no one has replied with a quick fix and not just someone looking to get paid. I am fine with people getting paid for their time but this should really be a default option in shopify. Crazy that it isnāt.
Hey there Roland. I just sent you a collab invite. I can not say 100% that this will be an easy change, but more than happy to take look for you. NO charge 
here it is in a video step by step
Hey,
So much for this!
Iāve just tried this - but i dont have ā<div class="slideshow__image boxā in my slideshow.liquid
iām using Venture theme
Do you have any advice or any update that I could use to make this work for me please?
Thanks so much,
Aneesha
Code from the video above, if anyone needs:
Part 1.
{% if block.settings.image_link != blank %}
{% endif %}
Part 2.
{
ātypeā: āurlā,
āidā: āimage_linkā,
ālabelā: āImage Linkā
},
Sadly, I have a debut theme and the second code was rejected as an error. Can you advice? Thank you
Thanks for the tutorial!
Somehow it didnāt work for my theme, so I took a less clean solution instead.
I took the file āslider.liquidā, there the slider is divied into several divs and also includes a
I placed a hard coded link in the line above the opening
Like this:
Just in case anyone knows the solution:
I tried the solution in the tutorial before, although the theme is slightly different.
If anyone knows where the error was, Iād be thankful but until then the hard coded link might work.
Iāve been trying to get this code to work for the Narrative theme but I canāt get the link to work. There is a place in the sections area to add a link, so that part of the code worked, but the image is not clickable. Iām sure that there is something I need to do differently since this is a different theme than the one in the video.
Has anyone been able to get this to work for the Narrative theme?
Bro, I do have de same problem as you, did you find a way to fix this it?
Hi @Carlos6
Thank you for the video! I am on the Palo Alto theme and have quasi-gotten this to work. Both the desktop and mobile images link to the page that I would like, but for some reason the mobile section shows both the desktop and mobile version (vertically with the mobile on top). Iāve tried moving the , adding the code to both the desktop image and mobile image sections and I cannot find a way for the link to work without also having the mobile image issue. Are you able to see what Iām doing wrong? We would really appreciate your advice! Thank you, Kristin
{%- assign transition = section.settings.transition -%}
{%- assign autoplay = section.settings.autoplay -%}
{%- assign duration = section.settings.duration | times: 1000 -%}
{%- assign content_alignment = section.settings.content_alignment -%}
{%- assign slide_height = section.settings.slide_height -%}
{%- assign slides_count = section.blocks.size -%}
{%- if section.blocks.size > 0 -%}
{%- if section.settings.show_nav_arrows and section.blocks.size > 1 -%}
{%- endif -%}
{%- for block in section.blocks -%}
{%- assign overlayOpacity = block.settings.overlay_opacity | times: 0.01 -%}
{%- if block.settings.slide_btn_link != blank -%}
{%- assign btn_link = block.settings.slide_btn_link -%}
{%- else -%}
{%- assign btn_link = "#" -%}
{%- endif -%}
{%- if block.settings.slide_btn_link_2 != blank -%}
{%- assign btn_link_2 = block.settings.slide_btn_link_2 -%}
{%- else -%}
{%- assign btn_link_2 = "#" -%}
{%- endif -%}
{%- if block.settings.slide_btn_text != blank or block.settings.slide_btn_text_2 != blank -%}
{%- endif -%}
{%- if slide_height == 'original-height' -%}
{% comment %} Mobile image {% endcomment %}
{%- unless block.settings.image_mobile == blank -%}
{%- assign image = block.settings.image_mobile -%}
{%- assign image_widths = '295,394,590,700,800,1000,1200,1500,1800,2000,2400' -%}
{%- include 'theme-rias' -%}
{%- endunless -%}
{% comment %} Desktop image {% endcomment %}
{%- unless block.settings.image == blank -%}
{%- assign image = block.settings.image -%}
{%- assign image_widths = '295,394,590,700,800,1000,1200,1500,1800,2000,2400' -%}
{%- include 'theme-rias' -%}
{% if block.settings.image_link !=blank %}
{% endif %}
{%- else -%}
{{- 'lifestyle-1' | placeholder_svg_tag: 'placeholder-svg-filled' -}}
{%- endunless -%}
{%- else -%}
{% comment %} Mobile image {% endcomment %}
{%- unless block.settings.image_mobile == blank -%}
{%- endunless -%}
{% comment %} Desktop image {% endcomment %}
{%- unless block.settings.image == blank -%}
{%- else -%}
{{- 'lifestyle-1' | placeholder_svg_tag: 'placeholder-svg-filled' -}}
{%- endunless -%}
{%- endif -%}
{%- if block.settings.slide_heading != blank -%}
# {{ block.settings.slide_heading | escape }}
{%- endif -%}
{%- if block.settings.slide_subheading != blank -%}
## {{ block.settings.slide_subheading | escape | newline_to_br }}
{%- endif -%}
{%- if block.settings.slide_btn_text != blank -%}
1 %} tabindex="-1"{% endif %}>{{ block.settings.slide_btn_text | escape }}
{%- endif -%}
{%- if block.settings.slide_btn_text_2 != blank -%}
1 %} tabindex="-1"{% endif %}>{{ block.settings.slide_btn_text_2 | escape }}
{%- endif -%}
{%- if block.settings.video_btn_text != blank -%}
1 %} tabindex="-1"{% endif %} data-play-button>
{{ block.settings.video_btn_text }}
{%- endif -%}
{%- endfor -%}
{%- endif -%}
{%- if section.settings.show_arrow_down -%}
1 %} tabindex="-1"{% endif %}>
{%- include 'icon-arrow-down' -%}
{%- endif -%}
{% schema %}
{
"name": "Slideshow LINK II",
"max_blocks": 10,
"class": "slideshow full-header",
"settings": [
{
"type": "header",
"content": "layout"
},
{
"type": "select",
"id": "slide_height",
"label": "Height",
"default": "one-hundred-height-hero",
"options": [
{
"value": "one-hundred-height-hero",
"label": "Full screen"
},
{
"value": "original-height",
"label": "Original"
},
{
"value": "seven-fifty-height-hero",
"label": "750px"
},
{
"value": "sixty-fifty-height-hero",
"label": "650px"
},
{
"value": "five-fifty-height-hero ",
"label": "550px"
},
{
"value": "four-fifty-height-hero",
"label": "450px"
}
]
},
{
"type": "select",
"id": "content_alignment",
"label": "Content alignment",
"default": "center",
"options": [
{ "value": "left", "label": "Left" },
{ "value": "center", "label": "Center" },
{ "value": "right", "label": "Right" },
{ "value": "bottom-left", "label": "Bottom left" },
{ "value": "bottom-right", "label": "Bottom right" }
]
},
{
"type": "checkbox",
"id": "show_nav_dots",
"label": "Show slide navigation dots",
"default": true
},
{
"type": "checkbox",
"id": "show_nav_arrows",
"label": "Show slide navigation arrows",
"default": true
},
{
"type": "checkbox",
"id": "show_arrow_down",
"label": "Show down arrow",
"default": false
},
{
"type": "header",
"content": "Autoplay"
},
{
"type": "checkbox",
"id": "autoplay",
"label": "Autoplay slideshow",
"default": false
},
{
"type": "range",
"id": "duration",
"min": 2,
"max": 5,
"step": 1,
"unit": "sec",
"label": "Change slides every",
"default": 4
},
{
"type": "select",
"id": "transition",
"label": "Transition style",
"default": "slide",
"options": [
{ "label": "Slide", "value": "slide" },
{ "label": "Fade", "value": "fade" },
{ "label": "Zoom out", "value": "zoom-out" }
]
}
],
"blocks": [
{
"type": "image",
"name": "Slide",
"settings": [
{
"type": "header",
"content": "Image"
},
{
"type": "image_picker",
"id": "image",
"label": "Image",
"info": "2048px width recommended"
},
{
"type": "image_picker",
"id": "image_mobile",
"label": "Mobile image",
"info": "Optional"
},
{
"type": "url",
"id": "image_link",
"label": "Image link"
},
{
"type": "select",
"id": "bg_position",
"label": "Position",
"default": "bg-pos-center-center",
"options": [
{ "label": "Top", "value": "bg-pos-top-center" },
{ "label": "Right", "value": "bg-pos-right-center" },
{ "label": "Center", "value": "bg-pos-center-center" },
{ "label": "Left", "value": "bg-pos-left-center" },
{ "label": "Bottom", "value": "bg-pos-bottom-center" }
]
},
{
"type": "range",
"id": "overlay_opacity",
"label": "Overlay opacity",
"min": 0,
"max": 95,
"step": 5,
"unit": "%",
"default": 20
},
{
"type": "header",
"content": "Text"
},
{
"type": "select",
"id": "text_color",
"label": "Color",
"default": "text-light",
"options": [
{
"value": "text-light",
"label": "Light"
},
{
"value": "text-dark",
"label": "Dark"
}
]
},
{
"type": "text",
"id": "slide_heading",
"label": "Heading",
"default": "Welcome to Palo Alto"
},
{
"type": "range",
"id": "heading_font_size",
"label": "Heading size",
"unit": "px",
"step": 4,
"min": 40,
"max": 64,
"default": 48
},
{
"type": "textarea",
"id": "slide_subheading",
"label": "Subheading",
"default": "This subheading helps you provide some more detail to the title above."
},
{
"type": "range",
"id": "text_font_size",
"label": "Text size",
"unit": "px",
"step": 2,
"min": 16,
"max": 28,
"default": 20
},
{
"type": "header",
"content": "Buttons"
},
{
"type": "text",
"id": "slide_btn_text",
"label": "Button text",
"default": "Welcome"
},
{
"type": "url",
"id": "slide_btn_link",
"label": "Button URL"
},
{
"type": "select",
"id": "slide_btn_style",
"label": "Button style",
"default": "primary",
"options": [
{ "label": "Primary", "value": "primary" },
{ "label": "Secondary", "value": "secondary" }
]
},
{
"type": "text",
"id": "slide_btn_text_2",
"label": "Second button text"
},
{
"type": "url",
"id": "slide_btn_link_2",
"label": "Second button URL"
},
{
"type": "select",
"id": "slide_btn_style_2",
"label": "Second button style",
"default": "secondary",
"options": [
{ "label": "Primary", "value": "primary" },
{ "label": "Secondary", "value": "secondary" }
]
},
{
"type": "text",
"id": "video_btn_text",
"label": "Video button text",
"default": "Watch the Video"
},
{
"type": "video_url",
"id": "video_btn_link",
"label": "Video URL",
"accept": [
"youtube",
"vimeo"
],
"default": "https://www.youtube.com/watch?v=_9VUPq3SxOc"
}
]
}
],
"presets": [
{
"name": "Slideshow LINK II",
"category": "Image",
"blocks": [
{
"type": "image"
},
{
"type": "image"
}
]
}
]
}
{% endschema %}
Best video ever! thanks to it and the first comment I was finally available to add a link to the slideshow. THANK YOU SOO MUCH 
what if I cant find slideshow_image
I have venture them but that code isnt there
Lost of Hero_image