How do i create anchor links for a Brands A-Z Page?

Store Design

Topic summary

A user wants to add alphabetical anchor links (A-Z navigation) to a long brands page built with a “logo list section” in their Shopify theme. The goal is to let visitors click a letter and jump directly to brands starting with that letter.

Core Challenge:
The logo list section doesn’t automatically generate the HTML IDs needed for anchor links to function.

Proposed Solution:

  1. Edit the logo list section code to wrap each letter group in a container with a unique ID (e.g., <div id="brand-A"> for A brands, <div id="brand-B"> for B brands).
  2. Add a row of links at the top pointing to these IDs (#brand-A, #brand-B, etc.).
  3. Save the section and ensure the page uses the updated version, not a cached one.

Alternative Approach:
If editing theme code is undesirable, consider using a dedicated Shopify app like “Brand Page A‐Z Brands List Pro” that includes built-in A-Z navigation and jump links.

The user is not a coder and seeks guidance on implementation.

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

I have created a Brands A-Z Page using the “logo list section”. I have added all brand logos in an A-Z order and the page is very long. I would like to create seperate links at the top of the page which would look something like… |A|B|C|D|E|F|G|H|I|J|K|L|M|N|O|P|Q|R|S|T|U|V|W|X|Y|Z|. One the letter has been pressed on, it would scroll down the page and land on the specific letter. I am not a coder and have no idea how to implement this to my website. So help would be greatly appreciated.

I have seen other forums and they have used the text within the “page” section but, as I have used the logo list section on the page builder within themes, it’s completely different and i can’t seem to work it out.

2

Which page builder did you use?

3

I created it myself manually. I created a page within my active theme and used “logo list” in order to add all logos on to the page.

4

Short answer: you need IDs in the markup before anchor links can work. The logo list section on its own does not create those, so you have to add them in the section code or use a section that does.

A simple pattern is:

  1. In your brand list section, wrap each letter group with a container that has an ID, for example <div id="brand-A"> around all A brands, <div id="brand-B"> around B brands, and so on.
  2. At the top of the section, add a row of links that point to those IDs: #brand-A, #brand-B, etc.
  3. Save the section and make sure your A to Z page is using that updated section, not a cached older version.

If you do not want to edit theme code, it can be easier to use a brand index app that already includes A to Z navigation and jump links. I tend to use Brand Page Pro A‑Z Brands List on the Shopify App Store with my own merchants, and the free version covers basic A to Z brand pages.