The tutorial makes the image slideshow clickable on the Dawn theme

[Dan-From-Ryviu]

You guys asked many questions about making an image slideshow clickable, you can refer to this article to know how to do it.

Required: you must add link to button of image slide.

After that, you just copy this code below, go to Online store >  Themes > Edit codes > Assets > open base.css and add it at the bottom of your file

.slideshow__text.banner__box,
.slideshow__text-wrapper { max-width: 100% !important; padding: 0 !important; }
.slideshow__text.banner__box { height: 100% !important; width: 100% !important; opacity: 0; }
.banner__buttons .button { position: absolute; top: 0; bottom: 0; right: 0; left: 0; }

Or you can copy this code and add it to Custom CSS of Slideshow section in your Online store > Themes > Customize 

P/S: You can use this code to do the same thing for other Shopify free themes, example for Refresh, Craft, Sense,... 

[StudioEnchant]

Great and simple tutorial, perfect!

Will help a lot of merchants

Thank you!

[Chris742]

Unfortunately, this didn't work for me.

[Dan-From-Ryviu]

Hi @Chris742 Can you share your store URL so I can check and help you? 

[VeronikaF]

Hello,

placed it to custom CSS. But also does not work.

Do you think I can ask you for help?

vesimidesign.com

Veronika

[Dan-From-Ryviu]

Please add link to button link of slide to make it works

[VeronikaF]

I see 🙂

Finally works...thanks a lot

[Dan-From-Ryviu]

You are very welcome

[VeronikaF]

Hello,

can I ask you one more thing? It does not work on mobile.

Dont have have any idea how to make it work?

Thank you.

[Dan-From-Ryviu]

Please send me your store link to check

[VeronikaF]

vesimidesign.com

[Dan-From-Ryviu]

Please try to update code to this and check again 

.slideshow__text.banner__box,
.slideshow__text-wrapper { max-width: 100% !important; padding: 0 !important; position: absolute !important; height: 100% !important; }
.slideshow__text.banner__box { height: 100% !important; width: 100% !important; opacity: 0; }
.banner__buttons .button { position: absolute; top: 0; bottom: 0; right: 0; left: 0; }

[VeronikaF]

wow. It works, thank you so much for your help and amazing work!

[Dan-From-Ryviu]

You are always welcome.

[Chris742]

Okay, now it works for me. Thank you!

[jenok]

Hi - Will this work on an Image Banner? If so, is it the same code? 

[Dan-From-Ryviu]

You can check this instruction for Image banner

https://www.buymeacoffee.com/dandong910/how-make-image-banner-clickable-shopify-dawn-theme

[jasoncristiano]

Hi Dan, I tried implementing your code but it is not working and I placed the link where the button link should go. Could you help please? Our site is not live yet - not sure what you need to have a look at that?