Check out the Youtube channel

Shopify - Open External Links in New Tab

Written by Eduard Fastovski

Apr 19, 2022

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.

Want posts like this in your inbox? Subscribe to the newsletter.

Comments