Make Homepage Images Clickable Link To Collection Pages Without Containers.

Store Design
, ,

Topic summary

A user seeks to make homepage images clickable links to collection pages in Shopify’s Origin theme without visible buttons or containers overlaying the images.

Proposed Solution:

  • Access theme code editor via Shopify admin (Online Store → Themes → Actions → Edit code)
  • Locate the homepage template file (typically index.liquid)
  • Find the code generating the images within the template
  • Wrap image code with anchor tags (<a>) linking to specific collection URLs

Technical Implementation:
Replace image markup with anchor-wrapped version, setting the href attribute to the target collection page URL (format: /collections/your-collection-handle).

Note: The provided code examples appear corrupted or reversed in the original post, making exact implementation details unclear. The discussion remains open with no confirmation of successful implementation.

Summarized with AI on November 20. AI used: claude-sonnet-4-5-20250929.
1

Hi I’m trying to make my homepage images clickable and link to specific collection pages without having any container/button appear over them. Hoping someone can help. Using Origin theme. Thank you! localsummersurf.com/

2

To make your homepage images clickable and link to specific collection pages without any visible container or button overlay in the Origin theme, you can modify the theme’s liquid code. Here’s a general approach to achieve this:

  1. Access the theme editor: Go to your Shopify admin dashboard and navigate to “Online Store” → “Themes”. Find the Origin theme and click on the “Actions” dropdown, then select “Edit code”.

  2. Locate the homepage code: In the theme editor, look for the file that controls the homepage template. This is typically named index.liquid or similar. Open it in the code editor.

  3. Find the image code: Within the homepage template code, search for the code that generates the images you want to make clickable. It might look something like this:

{% for image in section.images %}
  
{% endfor %}
  1. Add the anchor tag: Wrap the image code with an anchor tag (<a>) and set the href attribute to the URL of the specific collection page you want to link to. Here’s an example:
{% for image in section.images %}
  
    
  
{% endfor %}
​
  • Replace /collections/your-collection-handle with the actual URL or handle of the collection page you want to link to.