How can I make the image banner clickable in the Dawn theme?

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.

Summarized with AI on December 23. AI used: gpt-5.

I can’t get the mobile to work.