For anyone still looking for a solution, there is an updated tutorial here. Let me know if it doesn’t work, I’m happy to help.
Kind regards,
Diego
Topic summary
Goal: make Dawn theme’s Image Banner clickable without custom blocks.
Core approach proposed: edit image-banner.liquid to add two URL fields (for single or double-image banners) and wrap images with links; then adjust section-image-banner.css so the overlay doesn’t block clicks (notably set .banner::after content to none and disable/adjust overlay opacity). Users must also set the links in the theme editor.
Updates/issues:
- Initial code worked on desktop but some reported mobile problems (banner disappearing or grey/gray screen). Author later posted an updated version “with mobile handling,” noting overlay opacity must be off for clickability and requesting draft links for debugging.
- Mixed results persisted: some saw only the second image clickable on mobile; others confirmed multicolumn clickable code worked reliably after replacing multicolumn.liquid and adding CSS.
- An external, updated tutorial was later shared and then revised again to remove unintended text appearing above the banner.
Status: no out‑of‑the‑box setting; community solutions exist but can be fragile across devices. Latest guidance points to the updated external tutorial; thread remains partially unresolved for some mobile cases.
Notes: Code/CSS snippets and screenshots are central to implementation and troubleshooting.
2 Likes