A link to a specific section of a page

Store Design

Topic summary

A user seeks help creating buttons that link directly to specific sections of their website, specifically to product review sections and an email subscription form at the bottom of pages, to avoid requiring customers to scroll.

Solution provided:

  • Add HTML anchor links in product descriptions or page content using custom liquid code or the code editor
  • Use <a href="#section_id"> tags that reference the target section’s ID attribute
  • Example structure: Link tag points to #div_id which matches the id attribute of the target <section> element

Enhancement:

  • Add scroll-behavior: smooth; to the main CSS file’s html selector for animated scrolling transitions

Status: Solution provided with code examples; implementation pending by original poster.

Summarized with AI on October 31. AI used: claude-sonnet-4-5-20250929.
1

I need assistance setting up a button that links to certain parts of my website? For example is there a way to direct customers to the review section of each product directly rather than having to scroll to the bottom of the product’s page. Similarly i’m trying to get customers to my email subscription section which is at the bottom of my home page- just wondering if there is a smoother way to navigate customers directly to that section rather than asking them to scroll all the way down? website: penwiwar.com

2

You can add buttons or kind of links in your product description like check reviews or subscribe to newsletter which will link to particular sections. Once the user clicks any of them it will direct smoothly to that section.

3

thanks, any idea how i can do this?

4

Yup. So you can add a button link html a tag using custom liquid code or from the code editor itself.

Create an a tag, for example like this

Go to section

Suppose this is the section

Note the href tag in the a tag is the same as the section id starting with a #. This will create a link to that specific section.

For a smooth scroll if it’s not already implemented add this on your main css file at the very top

html{

scroll-behavior: smooth;

}