Open external links in new window

[technase]

Hi,
I need help modifying the last link in the header and the social buttons in the footer so that they open in a new window when clicked. Currently, they are opening in the same window.
store link: https://testingstoresandthemes.myshopify.com/
password: lock
Attaching a screenshot for reference.  

[BSSCommerce-HDL · Accepted solution]

Hi @technase, 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </body> tag:

<script>
let social_links = document.querySelectorAll('.footer__list-social .list-social__item a');
if(social_links.length > 0) {
   social_links.forEach(link => {
     link.setAttribute('target', '_blank');
   });
}
</script>

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[BSSCommerce-HDL · Accepted solution]

Hi @technase, 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </body> tag:

<script>
let social_links = document.querySelectorAll('.footer__list-social .list-social__item a');
if(social_links.length > 0) {
   social_links.forEach(link => {
     link.setAttribute('target', '_blank');
   });
}
</script>

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[technase]

Thank you.. it addresses the links in the footer but the one in header still opens in same window. 

[BSSCommerce-HDL]

Hi @technase, 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </body> tag:

<script>
let social_link_header = document.querySelector('#HeaderMenu-social');
if(social_link_header) {
   social_link_header.setAttribute('target', '_blank');
}
</script>

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you  😍

[technase]

Hey, 

I am so sorry, I updated the menu item title and link, and this code seems to be not working. Would you be able to provide me with the updated code to resolve this?
Thank you so much for all your help!

[BSSCommerce-HDL · Accepted solution]

Hi @technase, Pls try with this code: 

<script>
let social_link_header = document.querySelector('#HeaderMenu-retail-store');
if(social_link_header) {
   social_link_header.setAttribute('target', '_blank');
}
</script>

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[technase]

Thank you so much ❤️

[BSSCommerce-HDL]

@technase, No problem. Have a good day 😍