关于 target=”_blank” 的争论充斥着互联网,很多人提倡不要使用 target=”_blank” 因为这个不符合 XHTML-strict 和 XHMTL 1.1 的标准。但是我真的不太想让人一点击文章中的外部链接就离开原网站了。解决的方法是使用 rel=”external”。另一个问题是,每次手动加这个标签都比较繁琐,这里介绍一种方法能自动判断文章里的链接是指向站外还是站内,如果是站外则添加一个小箭头指示,并自动加上 rel=”external” 标签,不用手动一个一个去加。

一、添加 da_auto_external_link() 函数

functions.php 文件中添加以下内容

1
2
3
4
5
6
7
8
function da_auto_external_link($text) {
    $newtext = str_replace('<a href=', '<a class="external" rel="external" href=', $text);
    $newtext = str_replace('<a class="external" rel="external" href="'.home_url(), '<a href="'.home_url(), $newtext);
    $newtext = str_replace('<a class="external" rel="external" href="#', '<a href="#', $newtext);
    return $newtext;
}
add_filter('the_content', 'da_auto_external_link');   //应用于文章区域
add_filter('comment_text', 'da_auto_external_link');   //应用于评论区域

这个函数先把文章里的所有链接加上 external 的标识,然后再把站内链接的 external 标识给去掉。

二、添加 rel=”external” 识别

在模版文件 header.php 中的 head 区域内添加以下内容

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<script type="text/javascript" >

    /* External Links */
    function externalLinks() {
     if (!document.getElementsByTagName) return;
     var anchors = document.getElementsByTagName("a");
     for (var i=0; i<anchors.length; i++) {
       var anchor = anchors[i];
       if (anchor.getAttribute("href") &&

           anchor.getAttribute("rel") == "external")
         anchor.target = "_blank";
     }
    }
    window.onload = externalLinks;
   
</script>

三、添加小图标及其样式

在样式表文件 style.css 中添加以下内容

1
2
3
4
.external {
    padding-right: 11px;
    background: url('img/external-link.png') no-repeat right top;
}

然后上传一个文件名为 external-link.png 小图标到主题目录下的 img 子目录。当然路径和文件名你可以自己改。