Check out my Youtube channel

Shopify - Open External Links in New Tab

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

10 comments
  • Ehlena

    I tried this and it didn't work on Dawn. Locks all my banners to not move and doesn't open anything in a new tab :( how to fix it?


  • Prio

    what about Parallax from Out of the sandbox? I can't find the correct .js


  • Austin Jacob

    I use Supply Theme. When I added this code, The home page banners disappeared


  • Ted

    works in body on external links, but doesn't work in shopify nav menu with same external link @Eduard Fastovski


  • Graham Bailey

    Also, I want a clickable URL as a metafield but this seems to be problematic and I'm not sure why - is it me?


  • Graham Bailey

    global.js doesn't appear in Dawn Theme anymore. Would you be able to advise the updated filename please


  • Qudor Eng

    Thank you very much, only this solution worked with the Refresh theme


  • Yoran

    hi,

    I have two links in my footer menu that are external, Google maps and Facebook. How do I open these in a new tab??

    thanks in advance!


  • Carrie Thorimbert

    Hey there! does this work on all current 2.0 themes?
    It's not working on Impact 2.0 purchased theme. Thx!


    1 reply
    • Carrie Thorimbert

      Never mind! i was adding it to the wrong file. it works! thank you!!!!!


      1 reply
      • Riana King

        Having issues adding it to Impact. Which file did you add it to?


  • John

    hello, Eduard, can you help me? which code file on shopify that setting all external link be nofollow?