Can I make image banners or slideshows clickable without having the button on them? CRAFT

Is there any way I can make image banners or slideshows clickable without having the button on them? I use the CRAFT theme

Hi @BYTHB ,

Follow this video tutorial on how.

Hello, do you offer a service where you could do this ? if so how much does it cost

Yes I do. You can visit my website noted below so we can talk more in details

@BYTHB If you are still looking for a solution, I might be able to help. I used Made4uo’s video above and though it requires to update your code, it’s not very complicated.

I just ran into the same issue and posted my solution on a few others threads too.

This is what I did:

Keep in mind my solution might not necessarily be an exact match for your site, AND always backup your code before messing with it, unless you are a Code Grand Master :slightly_smiling_face:

  • Online Store / Action / Edit Code
  • Under Templates, find the Slideshow.liquid file
    • Row 75, you should see this code:

          

            {%- if block.settings.heading != blank -%}
              ## {{ block.settings.heading | escape }}
            {%- endif -%}
            {%- if block.settings.subheading != blank -%}
              
                {{ block.settings.subheading | escape }}
              

            {%- endif -%}
            {%- if block.settings.button_label != blank -%}
              
                

            {%- endif -%}
          

          


          

            {%- if block.settings.heading != blank -%}
              ## {{ block.settings.heading | escape }}
            {%- endif -%}
            {%- if block.settings.subheading != blank -%}
              
                {{ block.settings.subheading | escape }}
              

            {%- endif -%}
            {%- if block.settings.button_label != blank -%}
              

                
              

            {%- endif -%}
          

          

Next steps:

  • Scroll down to row 250-ish and look for the following:
"blocks": [
    {
      "type": "slide",
      "name": "t:sections.slideshow.blocks.slide.name",
      "limit": 5,
      "settings": [

Add a line after the [ and add the following code:

{
		"type": "url",
		"id": "slideshow_image_link",
		"label": "Slideshow Image Link"
		},

The video on YouTube explains what all of that is for, but high level, you are adding a section in your Slideshow Template so you can specifically call out the link you want (external link, product, collection…) for each image in the Slideshow. (See screenshot below)

Select 1 of the slides from your Slideshow, on the Top, you should see the “Slideshow Image Link” and just below, the option to selection a Product, a Collection, Blog Post, etc…

I hope this helps!

That almost worked for me, it made the top part of the slides clickable, but it just links back to the home page with the 3 slides I use, which all have a different link applied to them. any recomendations?

thanks

Hi there,

I used the code but unfortunately it only linking the first slide and not the others. Please help. :folded_hands: