How to add link in the Slideshow banner image

[smsigroup]

Good day!

How can you embed a clickable link into a Slideshow banner image?

https://sebago.com.ph/

Thank you!

[Navigate]

Hi @smsigroup 

To have the clickable banner slider, you have to amend the theme code from the Shopify admin. 

For this, you have to log in to Shopify Admin and access the theme code following: 

• From your Shopify admin, go to "Online Store" > "Themes."
• Find and click the "Actions" button for your current theme, and select "Edit code."

Depending upon the theme, you have to find the banner component and add the URL of your choice to the image. In general, it could be anything like: "Bannerslider.liquid", index.liquid or sections/slideshow.liquid. Look for the code that controls the slideshow.

Then you have to add the URL with an anchor tag to that HTML code. For this, you need to have the understanding of the HTML code. 

Let us know if you want us to help you out with this. You can invite us to your store, and will assist you. 

Hope this makes sense to your issue and helps you solve it. 

Best,
Navigate Commerce Team 

[smsigroup]

hi @Navigate  thank you for our reply

[Anonymous]

You need to wrap the slide show image with an anchor tag.

example -

<a href="..."><img/></a>

[smsigroup]

where to add the anchor tag? Thank you!

[Dan-From-Ryviu]

Hi @smsigroup 

Please add link to your button of your slider and then add this code before </body> in your theme.liquid file to check if it is working 

{% if template == 'index' %}
<script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="sha256-ZosEbRLbNQzLpnKIkEdrPv7lOy9C27hHQ+Xp8a4MxAQ=" crossorigin="anonymous"></script>
<script>
  $(".slideshow__image").on('click', function (event) {
     $( ".slideshow__btn-wrapper .slideshow__btn").trigger( "click");
  });
</script>
{% endif %}

[smsigroup]

Hi @Dan-From-Ryviu , thank you for your reply

its not working