Anchor link connect to submenu Dawn 14.0

Anchor link connect to submenu Dawn 14.0

Rio_Omnis
Visitor
3 0 0

I am not a coder but I have coded a lot of things thanks to this. My main mega menu has been coded so that if you press the actual name above the dropdown you can go visit the page dedicated to that subject. Problem I have ran into is that my submenu is connected to sections of each page. It all works but if I am in another page and try to use the dropdown to reach another anchor on another page it does not work (check link below). I need a code that will fix this current issue. Or a step by step of where to go in the code to change what I need to change.  Thank you in advance

 

Note: The version i'm working with is not the current live website.

Limitless Draft 14.0 Dawn 

https://www.loom.com/share/b6038931fdd1421da7e9540614083397?sid=4e246cbf-a4b1-4a43-babe-88459fe78c35 

Replies 5 (5)

Sonya_2025
Shopify Partner
198 26 41

Hey @Rio_Omnis 

 

you are building your store in a special way.

we normally using collection list template to achieve this. not using pages in shopify admin.

However you can do it in your way too pls following below steps:

1. Remove the submenu from menu.

2. Add the submenu data using page metafields.

3.show your submenu in the page and add anchor link function.

 

It is not easy to give your code since it is a bit complicated. Feel free to DM or Email if you need any further assistance.

Please let me know if it works by giving it a Like or marking it as a solution!
Feel free to reach out. EMAIL ME  
Motivate me by  PAY ME
Rio_Omnis
Visitor
3 0 0

I am not well versed in metafields so this is straight forward but I do not know how to implement 

Dan-From-Ryviu
Shopify Partner
8414 1654 1668

You must add a full link to your menu instead of just "#ancho-link"

For example, instead of "#shopify-section-template--18024173240579__featured_product_6pmN6z", please add "https://limitlessmfg.com/pages/headache-rack#shopify-section-template--18024173240579__featured_prod..."

- Helpful? Like and Accept solution to let me know or Buy me Coffee ❤️!
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Enjoy 1 month of Shopify for $1. Sign up now.

Rio_Omnis
Visitor
3 0 0

I tried this but when I am in another page and press the submenu items on a seperate page it does not take me to the section it just takes me to the page.

Sonya_2025
Shopify Partner
198 26 41

Hi @Rio_Omnis 

Based on the solution from Dan, you can add a script to make sure it works

 

1. Open the theme code editor and find the main-page.liquid from sections

Sonya_2025_0-1718607162400.png

 

2. Paste the code at the end of file.

<script>
  window.addEventListener("load", (event) => {
    var url = window.location.href;
    var elementIDs = url.split('#');

// Scroll the document to the element with id "divFirst"
var element = document.getElementById(elementIDs[1]);
  element.scrollIntoView(); 
});

</script>

  

Hope this helps.

 

Feel free to reach out if you need any further assistance.

Please let me know if it works by giving it a Like or marking it as a solution!
Feel free to reach out. EMAIL ME  
Motivate me by  PAY ME