Anchor links in Narrative theme?

Highlighted
Tourist
6 0 1

Hello!

New shopify user here! I am trying to add links in my main menu navigation that go to particular locations on my home page (anchor links). I've found a few threads that discuss this generally but I can't figure out where to add the anchor link HTML to the narrative theme. 

I tried using a custom html section, but I am unable to access that custom html section from the "add item to main menu" area:

Custom html block okCustom html block okbut can't add it to main menubut can't add it to main menu

0 Likes
Highlighted
Shopify Partner
3167 696 842

@EricLearnsShpfy 

I think you need a menu item for a section within a page. Please check the following links that will help you to make it possible.

1) Link Anchor within a page

2) Insert Anchor link within a page

hope this helps.

Thanks!

 

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
1 Like
Highlighted
Tourist
6 0 1

Thanks for the reply dmwwebartisan! I did see those links, but they don't specify how to add the html required for the anchor link. I wanted to confirm if the way I was doing it (with a custom HTML block) was the right way. 

And also, even though I can add a an anchor link, how do I add that link to the main menu?

0 Likes
Highlighted
Shopify Partner
3167 696 842

@EricLearnsShpfy 

Custom HTML is fine but in custom HTML you can use the code like the following not Anchor link

<div id="sectionid">New section</div>

 

After that in navigation, you can use anchor like following

/#sectionid

 

That should work. Hope you understand.

Thanks!

 

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
1 Like
Highlighted
Tourist
6 0 1

Thanks again for the quick reply! I will give this a try after dinner and update the thread!

1 Like
Highlighted
Tourist
6 0 1

Ok so I got the anchor link in, and it works from the menu (/#ourteam) if I am navigating from any page other than the home page.

Here's the custom HTML block: <h2 style="color:#242424;)"><center><a name="ourteam">Our Team</a></center></h2>

However, clicking on it doesn't work if I'm already on the home page. So if I was using the menu to navigate around the home page it wouldn't work. Any thoughts on how to address this? Thanks!

Eric

 

0 Likes
Highlighted
Shopify Partner
3167 696 842

@EricLearnsShpfy 

Try to use full link address e.g "http://www.abc.com/##ourteam"

Hope this helps.

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
1 Like
Highlighted
Tourist
6 0 1

No luck - even with the full link in the menu (https://www.rationaldesign.com/#ourteam) clicking on the link from the home page doesn't do anything.

0 Likes
Highlighted
Tourist
6 0 1

@dmwwebartisan if you have any other thoughts on how to address this I would immensely appreciate them! Thanks!

0 Likes