WordPress でプラグイン使わず外部リンクにアイコンつける

2015年1月26日2015年10月12日

WordPress には、外部リンクにアイコンと class="external"
をつけてくれるプラグインがある。
（いらんけど rel="nofollow" も）

有名なのは、

• WP External Links
• External Links

の二つ。

上のやつは、日本で人気。
下のやつは、海外で人気あるっぽい。

基本的には、External Links の方が簡素で動作が軽い。

が・・・
プラグインは多用すると、それだけ WordPress が重くなる。
できる限り、プラグインは使いたくない。

で・・・
この程度なら、プラグインでなくても、出来んじゃね？ (･ω･｀)

とか、思って作ってみた。

仕様

自動で付けることができるもの

付けることができる場所

出来上がったぶつ

functions.php に以下を追加。

2015-05-30 追記： 正規表現に一部間違いがあったので修正
2015-10-12 追記： 正規表現にまた、間違いがあったので修正

//---------------------------------------------------------------------------
// 外部リンクにアイコンとexternalつける
//---------------------------------------------------------------------------

// オプションその1（つけたい部分はコメントアウトする）
add_filter( 'the_content', 'add_external_content', 12 );     // 本文
//add_filter( 'the_excerpt', 'add_external_content', 12 );   // 抜粋
//add_filter( 'widget_text', 'add_external_content', 12 );   // ウィジェット

function add_external_content( $content ) {
    // オプションその2
    $add_blank    = 1;    // target="_blank" 付ける場合は 1 付けない場合は 0
    $add_nofollow = 0;    // rel="nofollow"  付ける場合は 1 付けない場合は 0
    $add_img      = 0;    // img にもアイコン付ける場合は 1 付けない場合は 0（class="external" だけはつきます）

    preg_match_all( '/<a[^>]+?href[^>]+?>/i', $content, $link_array );

    $my_url = preg_quote( rtrim( get_bloginfo('url'), '/' ) . '/', '/' );

    foreach( array_unique( $link_array[0] ) as $link ) {
        $replaced = $link;

        if( !preg_match( '/href=[\'|\"]?\s?' . $my_url . '[^>]+?[\'|\"]/i', $link ) ) {
            // target="_blank" 付ける
            if( $add_blank && !preg_match( '/.+?target\s?=[\'|\"]?\s?_?blank.+?/i', $link ) ) {
                $replaced = str_replace( '>', ' target="_blank">', $replaced );
            }
            // rel="nofollow"  付ける
            if( $add_nofollow && !preg_match( '/.+?rel\s?=[\'|\"]?\s?nofollow\s?/i', $link ) ) {
                $replaced = str_replace( '>', ' rel="nofollow">', $replaced );
            }

            $replaced = str_replace( '>', ' class="external ext_icon">', $replaced );

            $content = str_replace( $link, $replaced, $content );

            if( !$add_img ) {
                // img の時はアイコン消す（class="external" は残す）
                $content = preg_replace(
                    '/(<a[^>]+?href[^>]+?external) ext_icon([^>]+?>\s?<\s?img[^>]+?src[^>]+?>\s?<\/a>)/is',
                    '$1$2',
                    $content
                );
            }
        }
    }
    return $content;
}

スタイルシートに以下を追加。
（アイコンの /wp-content/uploads/external.png は自分で用意してください。）

a.ext_icon {
    background: url(/wp-content/uploads/external.png) center right no-repeat;
    padding-right: 13px;
}

あとがき

とりあえず、今のとこ当ブログでは正常に動作してます。

が・・・

バグがあったら、ごめんｗ

設定に関しては、
おいらは、本文以外に必要ないので、
抜粋とウィジェットテキストの部分はコメントアウトしてます。

あと、rel="nofollow" については、
個人的には、ブログの本文内では、つけない方が良いと思ってます。

たまに SEO 関係で、リンクパワーうんぬん言ってる人いるけど、
ブログの本文でページを紹介しておきながら、
リンクには nofollow を付けるとか。
それって、

「紹介はするけど、このリンク先は、おすすめしません」

って意味だからな・・・
それは、どーかと思うわけですよ。

本当におすすめできないリンクがあるなら、
そのつど、手書きで nofollow 付けるべきじゃないかなー。