Some links on this post may link to affiliate pages that offer compensation to the author of this post.
Shopify is an awesome platform to build on. Themes are mostly HTML and CSS, and intentionally run little javascript to help keep everything running smoothly. But what happens when you need some specific javascript coding to do something Shopify doesn’t do on its own? Javascript code can help you make it so any time an external link opens on your website, it opens in a separate window or a separate tab. In this tutorial, I will be showing you how to force all links on your Shopify store to open in an external tab.
When a user clicks on youtube, it’s important that the link does not take people away from your website. If it does, they are likely not to return.
So especially when it comes to third-party links like Youtube or marketing-related links is important to open in a different window. In Web Design, its important to make sure that any link that is not related to your website is opened in a separate tab.
Shopify makes this very hard, since you don’t have access to all the raw HTML code, and instead are forced to use Liquid Web. But with just a quick insert of the Javascript code below, any external link will open in a different tab or window (depending on the browser settings).
Copy the code below to install it on your Shopify OS 2.0 Theme
Please Copy the Code Listed Down Below
(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';
}
}
})();
Simply copy the code above and paste this in your Global.JS asset in the theme code editor.
If you can’t find a global.js file in your code assets, look for a file called If you’re using Dawn or any of the free Shopify 2.0 themes, it’s called global.js. theme.js or on some themes its also referred to as theme.js.liquid or custom.js.
Does Shopify open external links in a new tab or a new window?
Unfortunately no. Most free shopify themes do not have a code or mechanism installed to handel third party links any differently than internal links.
What are Internal and External Links?
Internal links refer to links that point to pages on your website. For example, if you click on About Me, it will take you to my about me page. This link changes the link you are on currently and moves the user to a new page.
Are internal links important for SEO?
Internal links are important for SEO because they help users navigate your website with ease, and can help provide useful content they are already looking for. Google likes seeing that.
But that doesn’t mean you need to flood every page of your website with internal links. A good rule of thumb is to post blogs on your Shopify Website that link to your product pages or collections.
What are external links?
External links are links that point away from your website. These links might be to a youtube channel where you promote products, or to a third party reviewer who has left a good review for you on your website.
Are external links important for Shopify SEO?
Although it’s always good for external links to be included on your website, you do need to be careful with how you use them.
Since shopify does not include any code by default to open external links in a new tab or a new browser, any external link will redirect your users away from your website.
Once you point a user away from your website, it’s always best to have a quick way for them to get back. Shopify doesn’t do that by defauly.
Luckily, I found this awesome little code snippet I have included down below that will help improve your Shopify SEO and also prevent users from permanently leaving your website when they click on an external link.
Thanks for reading this post. Please consider subscribing for more tutorials on Shopify and Liquid Web.
Thanks for reading to the end of this post. If you find the information I provide to be helpful, please consider subscribing.
Disclaimer: None of the information presented on this site constitutes legal, business, tax, or medical advice. In each scenario, it’s recommended to first chat with a medical, legal, business, or tax professional before making any decisions.
