Can I create links with target blank in Markdown

Question

Is there a way to create a link in Markdown that opens in a new window  If not  what syntax do you recommend to do this  I ll add it to the markdown compiler I use  I think it should be an option

User · Answer

There s no easy way to do it  and like  alex has noted you ll need to use JavaScript  His answer is the best solution but in order to optimize it  you might want to filter only to the post-content links    lt script gt      var links   document querySelectorAll    post-content a           for  var i   0  length   links length  i  lt  length  i                if  links i  hostname    window location hostname                links i  target     blank                    lt  script gt    The code is compatible with IE8  and you can add it to the bottom of your page  Note that you ll need to change the   post-content a  to the class that you re using for your posts   As seen here  http   blog hubii com target- blank-for-links-on-ghost

User · Answer

With Markdown-2 5 2  you can use this    link  url   target   blank

User · Answer

I ran into this problem when trying to implement markdown using PHP    Since the user generated links created with markdown need to open in a new tab but site links need to stay in tab I changed markdown to only generate links that open in a new tab  So not all links on the page link out  just the ones that use markdown   In markdown I changed all the link output to be  lt a target   blank  href       gt  which was easy enough using find replace

User · Answer

I don t think there is a markdown feature   Though there may be other options available if you want to open links which point outside your own site automatically with JavaScript    var links   document links   for  var i   0  linksLength   links length  i  lt  linksLength  i         if  links i  hostname    window location hostname           links i  target     blank             jsFiddle   If you re using jQuery it s a tad simpler       document links  filter function         return this hostname    window location hostname     attr  target     blank      jsFiddle

User · Answer

If you just want to do this in a specific link  just use the inline attribute list syntax as others have answered  or just use HTML  If you want to do this in all generated  lt a gt  tags  depends on your Markdown compiler  maybe you need an extension of it  I am doing this for my blog these days  which is generated by pelican  which use Python-Markdown  And I found an extension for Python-Markdown Phuker markdown link attr modifier  it works well  Note that an old extension called newtab seems not work in Python-Markdown 3 x

User · Answer

You can add any attributes using   attr    prop     For example  Google   http   www google com  target   blank

User · Answer

For ghost markdown use    Google  https   google com  target   blank    Found it here  https   cmatskas com open-external-links-in-a-new-window-ghost

User · Answer

As far as the Markdown syntax is concerned  if you want to get that detailed  you ll just have to use HTML    lt a href  http   example com   target   blank  gt Hello  world  lt  a gt    Most Markdown engines I ve seen allow plain old HTML  just for situations like this where a generic text markup system just won t cut it   The StackOverflow engine  for example   They then run the entire output through an HTML whitelist filter  regardless  since even a Markdown-only document can easily contain XSS attacks  As such  if you or your users want to create  blank links  then they probably still can   If that s a feature you re going to be using often  it might make sense to create your own syntax  but it s generally not a vital feature  If I want to launch that link in a new window  I ll ctrl-click it myself  thanks

User · Answer

You can do this via native javascript code like so     var pattern    a href  g  var sanitizedMarkDownText   rawMarkDownText replace pattern  a target   blank  href       JSFiddle Code

User · Answer

This works for me   Page Link  your url here   target  blank

User · Answer

So  it isn t quite true that you cannot add link attributes to a Markdown URL  To add attributes  check with the underlying markdown parser being used and what their extensions are    In particular  pandoc has an extension to enable link attributes  which allow markup in the link  e g    Hello  world   http   example com   target   blank      For those coming from R  e g  using rmarkdown  bookdown  blogdown and so on   this is the syntax you want   For those not using R  you may need to enable the extension in the call to pandoc with  link attributes   Note  This is different than the kramdown parser s support  which is one the accepted answers above  In particular  note that kramdown differs from pandoc since it requires a colon --   -- at the start of the curly brackets --     e g     link  http   example com   hreflang  de     In particular     Pandoc   attribute1  value1  attribute2  value2      Kramdown    attribute1  value1  attribute2  value2         Colon

User · Answer

I m using Grav CMS and this works perfectly   Body Content  Some text 1   Body Reference   1   http   somelink com  target  blank  Just make sure that the target attribute is passed first  if there are additional attributes in the link  copy paste them to the end of the reference URL   Also work as direct link   Go to this page  http   somelink com  target  blank

User · Answer

Automated for external links only  using GNU sed  amp  make If one would like to do this systematically for all external links  CSS is no option  However  one could run the following sed command once the  X HTML has been created from Markdown  sed -i  s href  quot http target  quot  blank quot  href  quot http g  index html  This can be further automated by adding above sed command to a makefile  For details  see GNU make or see how I have done that on my website

User · Answer

Not a direct answer  but may help some people ending up here  If you are using GatsbyJS there is a plugin that automatically adds target  quot  blank quot  to external links in your markdown  It s called gatsby-remark-external-links and the usage is like so  yarn add gatsby-remark-external-links plugins                  resolve   gatsby-transformer-remark       options          plugins             resolve   quot gatsby-remark-external-links quot           options              target   quot  blank quot             rel   quot noopener noreferrer quot                                 It also takes care of the rel  quot noopener noreferrer quot   Reference the docs if you need more options

User · Answer

Kramdown supports it  It s compatible with standard Markdown syntax  but has many extensions  too  You would use it like this    link  url   target   blank

User · Answer

For completed alex answered  Dec 13  10   A more smart injection target could be done with this code          For all links in the current page          document links  filter function                      keep them without  target  already setted                return  this target     filter function                      and keep them are not on current domain                return this hostname     window location hostname                             or are not a web file   pdf   jpg   png   js   mp4  etc                              html  php3  aspx    a-z  0 3   a-zt  0 4     test this pathname         For all link kept  add the  target   blank   attribute          attr  target     blank      You could change the regexp exceptions with adding more extension in    html  php3  aspx   group construct  understand this regexp here  https   regex101 com r sE6gT9 3    and for a without jQuery version  check code below   var links   document links  for  var i   0  i  lt  links length  i          if   links i  target            if               links i  hostname     window location hostname                       html    a-z  0 3   a-zt  0 4     test links i  pathname                          links i  target     blank

User · Answer

I do not agree that it s a better user experience to stay within one browser tab   If you want people to stay on your site  or come back to finish reading that article  send them off in a new tab    Building on  davidmorrow s answer  throw this javascript into your site and turn just external links into links with target  blank        lt script type  text javascript  charset  utf-8  gt           Creating custom  external selector         expr      external   function obj             return  obj href match   mailto                        amp  amp   obj hostname    location hostname                     function               Add  external  CSS class to all external links            a external   addClass  external                turn target into target  blank for elements w external class             external   attr  target    blank                    lt  script gt

User · Answer

One global solution is to put  lt base target   blank  gt  into your page s  lt head gt  element  That effectively adds a default target to every anchor element  I use markdown to create content on my Wordpress-based web site  and my theme customizer will let me inject that code into the top of every page  If your theme doesn t do that  there s a plug-in

User · Answer

In my project I m doing this and it works fine    Link  https   example org   title  target   blank     Link  But not all parsers let you do that

[html] Can I create links with 'target="_blank"' in Markdown?

Examples related to html

Examples related to hyperlink

Examples related to markdown

Examples related to target

Examples related to new-window