Anchor Links Directing Customer to Lower Portion of the Page

Store Design
, ,

Topic summary

A user is attempting to create anchor links on a Shopify landing page to help customers navigate to specific product sections (like Medical Products) further down the same page.

Current Implementation:

  • Top of page: <a href="#Medical">Click Here for Medical Products</a>
  • Target section: <h2 id="Medical">Medical Grade Products</h2>

The Problem:
When clicking the anchor link, the URL changes but the page doesn’t scroll to the intended section. The user shared screenshots showing the link generates a URL with the anchor (#Medical) but navigation fails.

Status:
The issue remains unresolved. The user is seeking help or suggestions to fix the anchor link functionality, as the current code isn’t automatically directing visitors to the lower portion of the page as intended.

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

I have a hidden Shopify page I am working on. It is a landing page featuring products for a specific outlet. There are so many types of products the page is a bit long. I want to say “Click Here to View Medical Products” and when the user clicks on that phrase, they are automated to a lower portion of the same webpage for the Medical Product section. I assumed this would be anchor links. I attached the code in a pdf file format.

Here is the code I have: (User Clicks on this at the top portion of the page)

Click Here for Medical Products.

ACWORKS_0-1712347165305.png
ACWORKS_0-1712347165305.png1003×458 109 KB

This is where I want the user to end up:

Medical Grade Products

ACWORKS_1-1712347262253.png
ACWORKS_1-1712347262253.png1129×458 33.3 KB

When I click on the link I created at the top, I get the following link:

https://7l4yv2ip1tarcwhz-14910210.shopifypreview.com/%E2%80%9D#Medical%E2%80%9D

ACWORKS_2-1712347522891.png
ACWORKS_2-1712347522891.png1357×679 69.6 KB

Any ideas?? Help or Suggestions appreciated. Thanks in advance.