Need "Debut" theme submenu links to open in new tab

Highlighted
New Member
6 0 0

Hi everyone,

I was wondering if it was possible to make some of my submenu links open in a new tab. Basically under "Social" on my main menu I have facebook and Instagram child links and want them to open in new tab or window instead if navigate away from page.

 Ideally, i'd rather have links in the header with icons, like in the footer but there doesn't seem to be a way to do that so the menu links seems like the next best thing.

Any help would be greatly appreciated!! thank you

https://barnesandmaracle.myshopify.com/

0 Likes
Highlighted
Astronaut
1085 177 213

Hey,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:

<script>
var sublinks = document.querySelectorAll(`.mobile-nav__sublist-link`);

if (sublinks){
for (var each of sublinks){
each.setAttribute('target', '_blank');
}
}

</script>




Please let me know whether it works.

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes
Highlighted
New Member
6 0 0
Hi Diego,
Thank you for your help I really appreciate it!
Unfortunately I still have the same issue of the social links navigating
away from the site after inserting your code above the

0 Likes
Highlighted
Astronaut
1085 177 213

Please send a screenshot of where you pasted the code

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes
Highlighted
Astronaut
1085 177 213

@westvandal 

I just checked your website now and the code is not below the </body> 

dantepw_0-1598234152911.png


Did you click on the save button after pasting it in?

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes
Highlighted
Astronaut
1085 177 213

@westvandal 

Delete the previous code and use this one please:

 

<script>

var sublinks = document.querySelectorAll(`a[class*='mobile-nav']`);

if (sublinks){
for (var each of sublinks){
each.setAttribute('target', '_blank');
}
}

</script>

 

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes
Highlighted
New Member
6 0 0
Attached
0 Likes
Highlighted
Astronaut
1085 177 213

@westvandal 

Try the last code I sent you, it should work now

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes
Highlighted
New Member
6 0 0
I did try and I am getting the same problem..you want it just above the
closing body tag right? line 145?
Thanks again for your time, super appreciated
0 Likes
Highlighted
Astronaut
1085 177 213

Sorry, it was my bad, it was working only on mobile.

<script>
var sublinks = document.querySelectorAll(`.mobile-nav__sublist-link, .site-nav__child-link`);

if (sublinks){
for (var each of sublinks){
each.setAttribute('target', '_blank');
}
}
</script>


Please replace the previous code with this one. When you click on "About" and then on "Sarah Barnes" it will open up on a new tab.

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Hire me! Recommended by 25+ customers on Facebook. Click here to read their reviews.
◦ Contact me at: diego.boarutto.fortes@gmail.com
0 Likes