Anchor link scroll where destination is centered on the page

Anchor link scroll where destination is centered on the page

roekudoo
Tourist
8 0 1

Dear Shopifiers,

 

After some trail and error I've managed to have some of the entries of my main navigation menu link to a section down/up somewhere on the home page. I did this by adding the following under "Link" for the specific main navigation menu entry: "https://domainname.com/#shopify-section-template--13454....." .

 

This works, but when I click the link the linked section shows all the way on top. How can I get the section that I'm linking to be centered on the page?

 

i'm using the Kingdom theme for my website.

 

Best regards,

Roekudoo

Replies 2 (2)
roekudoo
Tourist
8 0 1

image1.png

Hi Peter,

 

Thanks for the quick reply. But that unfortunately does not solve the issue we're facing currently.

 

Let me explain more what the issue is we're having using an example. We have in our main menu an entry called "Over Ons". When clicking this we would like the page to scroll down to the relevant sectio n on the homepage. However when we do so now the relevant section shows all the way up top after the scrolling action (image 1) instead of where we ideally would want it, which is in the middle of the page (image 2).

 

image2.png

 

Hope this helps

 

roekudoo
Tourist
8 0 1

I did what you described, but without success unfortunately... I also tried including the ``` characters but this also did not lead to the desired effect. Anything else we can try?

roekudoo_0-1688235165409.png