Issue Identified:
When using “#” to disable navigation links in Shopify, the anchor works correctly on standard URLs (e.g., mysite.com/pages/something#). However, on localized market sub-folder URLs (e.g., mysite.com/en-us/pages/something), clicking the link redirects users to the localized homepage (mysite.com/en-us#) instead of staying on the current page.
Proposed Solutions:
javascript:void(0) — Suggested as an alternative to “#” to prevent homepage redirection. However, this doesn’t integrate with Shopify’s native menu editor (Content > Menu), which doesn’t accept JavaScript as a valid entry.
Liquid code workaround — The original poster implemented a custom solution using Liquid templating:
{{ link.title }}
This code removes the localization root URL when an anchor is present, effectively fixing the redirect issue.
Status:
The discussion remains open to better solutions, though the Liquid workaround currently addresses the immediate need.
We can disable link in navigation with anchor “#”. However, when someone with localized market sub-folders clicks that link, link redirects to home page. Is there a solution for that?
For example, we can create # link in navigation. If someone clicks that link from mysite.com/pages/something, link is disabled (mysite.com/pages/something#). However, if user clicks link from mysite.com/en-us/pages/something, link is redirecting homepage (mysite.com/en-us#)
Hey @yaltug I hope you are doing well.
Great question — this issue happens because when you’re using a “#” as the href in your Shopify navigation, it behaves slightly differently in localized subfolders (like /en-us/, /de/, etc.).
When a user clicks a # link on /en-us/pages/something, the browser interprets /en-us# as the new URL, which may not resolve correctly and end up redirecting to the localized homepage.
Solution:
Instead of Using the # consider using javascript:void(0) like
About Us
In this way your link will not redirect to homepage even you are on another page.
Hi @TheScriptFlow . Thank you for your answer.
javascript:void(0) can be a solution. However, it doesn’t fit Shopify workflow. User might change menu in Content> Menu options but that menu doesn’t accept javascript:void(0) as possible entry.
As a solution;
I checked and removed localization root url if anchor exist.
{{ link.title }}
I used this one as quick fix, and it covers my current need. If there is a better solution, I am open to it.