How to make entire slideshow area clickable - (Dawn 2.0)

LOL yeah, that totally fixes everything. NOT.

Your solution works for me, no more dropdown conflict with banner

There are main 2 methods used in this discussion thread to make the whole image clickable. Here is how to make both work. Choose which you prefer:

Method 1: as described by LitCommerce and jess-macebo

Positioned above <div class="slideshow__text-wrapper…

Using this method change z-index to 3

then to the end of your base.css file add:

#shopify-section-header { z-index: 5; }

Method 2 as described by AlohaAkahai

wrapping the link arround the content div:

ie

{%- 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 -%}
{{ block.settings.button_label | escape }}
{%- endif -%}

in this case update the opening link to have a z-index of 2

Hope this helps

1 Like

This solution is working fine for me!

It works for the header and banner. But, seems like the solutions make all the link (in text) all unclickable, except for button link. Any solutions for this?

Thank you so much it’s works

This Solution works! I have been searching for months for a solution to this that wouldn’t override the main navigation menu at the top. One note, in Dawn 8.0, the should go on line 122 rather than 133. Thank you thank you!

I truly don’t understand why Shopify does not have this as default functionality in the theme. It seems extremely basic.

Were you able to get this working on Mobile? AlohaAkahai’s method fixes the issue of the navigation bar links all routing to the first slideshow link, but then the Mobile slideshow disappears entirely and it only appears on desktop!

I have the same issue with the Mobile version disappearing after using the code that makes it clickable and fixes the nav bar, but when I check that “Show content below images on mobile” option, it then shows only a small sliver of the banner with the top 3/4 just totally white. Any ideas what other tweaks I could try? Thank you!

Hi DB160

Thanks for this. We tried method 2 and it fixed the menu issue - but when clicking the banner it no longer goes to its destination. We are running Dawn 8.0 - does this make a difference?

Thanks for any light you can shed on this,

Hi Olivia

How did you fix this in 8.0? I can get the menu to work using method 2, but when that is done, the banner doesn’t go anywhere when I click it?

Thanks in advance

Great solution! Was the issue with the banner disappearing on mobile ever resolved?