I want my external links to open in a new tab

Hello all

I’d like all external links on my blog to open in a new tab.
I’ve been reading the blog posts on this forum from people that had a similar question. I found some possible solutions that were posted here, but none of them seem to work on my Ghost website. The current version of Markdown seems to overrule attempts to manually create links like
[Text goes here](http://linkgoeshere" target="_blank)
and take out the target="_blank" part.

Does anyone know if there is a way to overrule this, without using Javascript?

PS: I noticed that some of the posts around this topic were closed by admins, stating that links should never open in a new tab, using some old blog posts around the topic dating as far back as 1999 to prove their point.

Please, do not close this blog post with the same kind of response. I’d like to get an actual workaround from the community.

I personally don’t care how links in HTML and Markdown were initially intended to work and that they “should” never open in a new tab. I don’t agree with that stance because it is a technology push without taking the user experience into account, which is shortsighted and obnoxious. Most users and a lot of webmasters expect external links to open in a new tab. Period.

By the way, here’s a good article about why external links should open in a new tab: https://uxmovement.com/navigation/why-external-links-should-open-in-new-tabs/

2 Likes

but it’s so easy in JS… and instead of _blank I just use a single named tab (e.g. moredetail ) so that I don’t spam my users by opening lots of tabs.

I have the following in my Code injection Site Footer:

<script type='text/javascript'>
  $( document ).ready(function() {
  	$(".post-content a").attr("target","moredetail");
  });
</script>
3 Likes

If you only wanted to do this for specific links, you could simply embed a tag in the href and look for the tag.

For example; say I decide to use: ?xgtab& as an indicator to open the page in an [External Giani Tab]

and then just use a more advanced selector:

$( "a[href*='?xgtab&']" ).attr("target","moredetail");

This will embed the xgtab arg in the request - but I doubt that will cause a problem if you choose a tag that is unlikely to be used by the websites you are linking to.

2 Likes

Aha, this is actually very usefull. Just what I need. Thanks!

1 Like