I have been working on a Shopify project where I implemented a pop-up that appears when the page loads, prompting users to choose between the US and UK websites.
Once a user clicks on one of the options, the pop-up either closes (UK) or redirects them to the US site. Their choice is then stored in a cookie so that upon revisiting the site, they are redirected accordingly without the pop-up showing again.
Below is the code snippet:
<div class="modal fade" id="storeModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<!-- Modal content here -->
</div>
<script>
// JavaScript functions go here
</script>
While this setup works well for direct site visitors, my concern arises when someone enters from a subpage such as https://store.com/collections. In such cases, they should be redirected to the corresponding subpage on the US store like https://us.store.com/collections.
I attempted to achieve this with the following code:
if (storeUS) {
window.location.href = "https://us.store.com/{{current_page}}";
}
However, the redirection resulted in URLs like https://us.store.com/1. Does anyone have suggestions on how to resolve this issue?