markdown在新标签页打开链接

作为一种简单的写作语言,markdown对图片和链接的支持并不好。幸运的是,markdown语言脱胎于HTML语言,因此我们可以直接在markdown文本中使用HTML语言实现特定功能。

起因

在写博客展示那篇 文章 的时候,我发现如果默认以markdown的语法去写,那么浏览器默认会在本页面打开链接。对于老手来说,可以熟练地使用ctrl+鼠标左键点击实现在新标签页打开,但这未必适合所有人。因此,为了避免读者跳转后再回来重新加载页面造成麻烦,只好在写作时受累使用复杂一点的HTML语言了。

情景复现

使用markdown语言:[欢迎来到Brayn的博客](https://brayn.top)

得到的结果会是:欢迎来到Brayn的博客

大家可以尝试一下:

  • 使用鼠标左键直接点击

  • 使用ctrl+鼠标左键点击(Mac用户使用⌘+鼠标左键)

解决方案

使用HTML语言:

<a href="https://brayn.top" target="_blank">欢迎来到Brayn的博客 </a>

得到的结果是:欢迎来到Brayn的博客

这里的关键是在HTML的链接命令中,target属性规定了被链接的文档或网页在哪里显示,而_blank参数指定链接在新页面打开。

更多的关于HTML语言中链接使用语法的知识可以参阅W3school的系列文章

优化方案

那么如果一篇文章里需要引用的链接很多,挨个使用HTML语言书写的话,还是很麻烦的,毕竟markdown提供了更轻松也更优美的插入链接方式,不用白不用。

于是,继续翻阅文档,我又发现了新的方法:HTML<base>标签。

<base> 标签为页面上的所有链接规定默认地址或默认目标。

通常情况下,浏览器会从当前文档的 URL 中提取相应的元素来填写相对 URL 中的空白。

使用 <base> 标签可以改变这一点。浏览器随后将不再使用当前文档的 URL,而使用指定的基本 URL 来解析所有的相对 URL。这其中包括 <a>、<img>、<link>、<form> 标签中的 URL。

值得注意的是,<base> 标签必须位于 head 元素内部。也就是说,在单独的文章里使用<base> 标签是没有用的,必须要到Jekyll或者Hexo的layout模板文件里,在<head>头文件之间插入语句<base target="_blank" />才可以。

更多关于<base>的解释和具体的实例,可以前往这里查看。

更优化方案

  • 前不久刚加入了简书平台,主要目的是增加曝光量,然后将一部分流量引到这里来。我发现简书上的链接默认都是在新标签页打开的。

  • 如果你使用的是hexo的话,官方的插件中心里有一个hexo-autonofollow插件可以实现此功能。

    请移步hexo插件中心 & GitHub:autonofollow

客官,请随意~~
  • 本文作者: Brayn
  • 发布时间: 2019年01月01日 - 00:01
  • 最后更新: 2019年01月10日 - 14:01
  • 本文链接: https://brayn.top/posts/56231/
  • 版权声明: 本博客所有文章除特别声明外,均采用 BY-NC-SA 许可协议。转载请注明出处!