If you have a Shopify store with some links going to other websites, you may want them to open up in a new tab.
I have this problem on my own site, where I want people to visit my Youtube channel but I don’t want them to leave my site either.
It would be nice if the Shopify navigation page had a checkbox saying open in new tab, but there isn’t anything like that.
The simplest solution is actually just a few lines of javascript, that will automatically open ANY external link on your entire website, in a new tab.
To do this, first copy the code:
(function () {
var links = document.links;
for (let i = 0, linksLength = links.length ; i < linksLength ; i++) {
if (links[i].hostname !== window.location.hostname) {
links[i].target = '_blank';
links[i].rel = 'noreferrer noopener';
}
}
})();Next go to your themes page, click Actions > edit code. You want to find your themes main javascript file which will have a .js in the name. Use search to find it quickly.
- If you’re using Dawn or any of the free Shopify 2.0 themes, it’s called global.js.
- If you’re using Debut it’s called theme.js
- On other themes it could also be called theme.js.liquid or custom.js.
Scroll to the bottom of the file, paste in the code. And you’re done!
Leave a comment if you have any questions and subscribe for more Shopify tips and tutorials like this one.