How to open external links in another tab?

Question

I use the following code so everything opens in the web app:

<script type="text/javascript">
var a=document.getElementsByTagName("a");
for(var i=0;i<a.length;i++)
{
   a[i].onclick=function()
   {
       window.location=this.getAttribute("href");
       return false
   }
}

However, even on desktop, links that have target="_blank", still open in the same tab. How can I make all external links open in a new tab, while still keeping all internal links in the same tab. I've found solutions for single links, but I have too many to change by hand.

Note: I'm on apache so a config file change would also work.

Another good post with various solutions: https://stackoverflow.com/questions/12235585/is-there-a-way-to-open-all-a-href-links-on-a-page-in-new-windows — Wim Mertens, Jul 18 '17 at 02:44

Alexander Higgins · Answer 1 · 2017-07-18T02:35:37.703

2

If you set the "target" attribute on the links they will open in a new tab:

<script>
var origin=window.location.origin;
var a=document.getElementsByTagName("a");
for(var i=0;i<a.length;i++)
{
   var link = a[i];
   if(link.href && link.href.indexOf(origin)!=0)
    link.setAttribute("target", "_blank");
}
</script>

In WordPress admin you can go to Theme editor and put this code in your footer.

edited Jul 18 '17 at 02:35

answered Jul 18 '17 at 02:28

Alexander Higgins

6,765
1
23
41

Sorry, I'm new to javascript, how would I add this to my existing code. – NerdOfLinux Jul 18 '17 at 02:29
You can add it your footer through the admin using theme editor. If your theme has a place to put custom tracking code you could add it there. – Alexander Higgins Jul 18 '17 at 02:32
It doesn't work. My problem is that even links with the target attribute don't open in a new tab. – NerdOfLinux Jul 18 '17 at 03:31

score 1 · Accepted Answer · answered Jul 18 '17 at 03:47

I managed to find an answer from this post. I just put this in my header:

<script>
// Mobile Safari in standalone mode
if(("standalone" in window.navigator) && window.navigator.standalone){

    // If you want to prevent remote links in standalone web apps opening Mobile Safari, change 'remotes' to true
    var noddy, remotes = false;

    document.addEventListener('click', function(event) {

        noddy = event.target;

        // Bubble up until we hit link or top HTML element. Warning: BODY element is not compulsory so better to stop on HTML
        while(noddy.nodeName !== "A" && noddy.nodeName !== "HTML") {
            noddy = noddy.parentNode;
        }

        if('href' in noddy && noddy.href.indexOf('http') !== -1 && (noddy.href.indexOf(document.location.host) !== -1 || remotes))
        {
            event.preventDefault();
            document.location.href = noddy.href;
        }

    },false);
}
</script>

and all normal links open within the web app, but on mobile and desktop, links with target="_blank" open in a new tab.

You didn't mention this was an issue with only mobile safari. — Alexander Higgins, Jul 18 '17 at 04:04

How to open external links in another tab?

2 Answers2