WP External Linksの設定と使い方:外部リンクにアイコンを表示させる

WP External Linksの設定と使い方:外部リンクにアイコンを表示させる

WP External Linksは、外部リンクにアイコン「」を表示させることができるプラグインです。

また、「外部リンクを全て新しいウィンドウで開く」「nofollowを追加する」「任意のrel属性を追加する」等の細かい設定もできるので、外部リンクの設定をまとめて管理したい時に使うと便利です。

設定と使い方

設定の変更は、管理画面の「外部リンク」から行うことができます。

プラグインを有効化しただけでは、外部リンクに「rel属性」が追加されるだけなので、お好みで設定を変更して下さい(「外部リンクを開く」と「アイコンの種類を選択」を変更するだけでも十分)。

WP External Linksの設定

WP External Linksの設定

外部リンク設定 チェックを入れると設定が有効になる。
外部リンクを開く target属性を追加。
follow または nofollow を設定 「rel="follow"」及び「rel="nofollow"」を追加。
rel 属性の追加 リンク先との関係「rel=""」を追加。
タイトルを設定 title属性を追加。
CSS クラスを追加 追加したいCSSのクラスを入力。
アイコンの種類を選択 外部リンクに表示するアイコンの設定。

外部リンクを開く

外部リンクに下記の「target属性」が追加されます。また、既存の値を上書きすることができます。

target属性
同じウィンドウ、タブ、フレーム target="_self"
それぞれ別の新しいウィンドウまたはタブ target="_blank"
すべて同一の新しいウィンドウまたはタブ target="_new"
最上階層のフレーム target="_top"

外部リンクを新しいタブで開きたい時は、「target="_blank"」を使うと便利です。

follow または nofollow を設定

外部リンクに下記の「rel属性」が追加されます。また、既存の値を上書きすることができます。

rel属性
follow rel="follow"
nofollow rel="nofollow"

rel属性「rel="nofollow"」には、リンク先のサイトを評価しないといった意味があります。

WordPressでは、コメント欄のリンクには自動で付与されますし、アフィリエイトリンクにも最初から付与されていることがほとんどなので、個人的には不要だと思っていますが、SEOに関係することなので、ご自身で判断して設定して下さい。

参考:Google に外部リンクの関係性を伝える  |  Google 検索セントラル  |  Google Developers

rel 属性の追加

外部リンクに下記の「rel属性」が追加されます(初期設定推奨)。

意味
rel="noopener" リンクを新しい閲覧コンテキストで開きリンク元の文書へアクセスできないようにする。
rel="noreferrer" リンク先のリソースにリファラーを送らない。
rel="external" 外部にあるリソースへのハイパーリンク。
rel="sponsored" 広告や有料プレースメントのリンク。
rel="ugc" コメントやフォーラム投稿などユーザー作成コンテンツのリンク。

WordPressでは、外部リンクを新しいタブ「target="_blank"」で開くと、自動で「rel="noreferrer noopener"」が追加されます(他は任意)。

参考:リンク種別 – HTML: HyperText Markup Language | MDN

タイトルを設定

外部リンクに「title属性」を追加することができます(初期設定の「{title}」推奨)。

target属性
{title} なし。
{text} リンクテキスト(HTMLタグ含む)
{text_clean} リンクテキスト(HTMLタグ除外)

ちなみに、「title属性」にSEO効果はありません。

CSS クラスを追加

外部リンクに追加したいクラス属性があれば入力することができます(任意)。

アイコンの種類を選択

外部リンクに表示させる「アイコン」を選択することができます(任意)。

特に決まりはありませんが、アイコンの位置は「リンクの右側」、<img>でアイコンをスキップに「チェックを入れる」ことをおすすめします(画像の外部リンクにはアイコンを表示させない)。

内部リンクと除外リンク

どちらも必要なければ変更する必要はありません(初期設定推奨)。

内部リンクと除外リンク

内部リンクと除外リンク

設定を変更したい時は、「設定を適用」にチェックを入れて外部リンクと同様に設定して下さい。

例外

上段タブの「例外」からは、外部リンクの設定を除外するページや項目を設定することができます。

例外の設定

例外の設定

ウィジェットエリアのアイコンを非表示にしたい時に使うと便利です。

管理者機能

チェックを外すと、メニューの場所が管理画面一覧から設定一覧に変更されます(任意)。

管理者機能

管理者機能

最後に

リンクアイコンを設定したい時は、PHPやCSSを編集するより、プラグインを使った方が簡単です。

また、過去のリンクの設定もまとめて変更・管理することができるので、途中から設定を変更したい時にも便利です。ただ、最初から設定されているテーマでは不要です(有料テーマ等に多い)。

スポンサーリンク
スポンサーリンク