vdeep

*

vdeepはプログラミング、IT、Web技術、ライフハックの事などなどを管理人okutaniがつぶやくブログです。月間11万PV〜。

[WordPress] 外部リンクに自動でアイコンをつける「External Links」プラグイン

      2015/10/11

LINEで送る
Pocket

wp-external-links
こんにちは、okutani(@okutani_t)です。サイトを運営していると、ちょこちょこ外部サイトのリンクを紹介したいときがありますよね。

その際に、外部リンク横にアイコンをつけて「このリンクは外部リンクですよ」とわかるようにしてくれるのが「External Links」プラグインです。

このプラグインはとてもかんたんに設置できるので、本記事の設定でサクッと導入しておくと便利です。

では、さっそくExternal Linksプラグインの導入方法を見ていきましょう。

スポンサーリンク

External Linksの導入

まずはExternal Linksをインストールしましょう。

ダッシュボードから「プラグイン」→「新規追加」を選択します。

wp-plugin-install

右上の検索バーに「External Links」と入力して検索、「いますぐインストール」をクリックします。

wp-external-links

インストールが完了したら「プラグインを有効化」をクリック。

wp-external-links2

これでExternal Linksの導入が完了しました。

External Linksの設定

ではExternal Linksの設定を行いましょう。ダッシュボードから「設定」→「External Links」で設定画面を開きます。

wp-external-links3

設定項目を見ていきましょう。

wp-external-links4

それぞれの項目は下記の通りです。

  • Apply Globally
  • 全ての外部リンクを対象とする。チェックしませんでした

  • Apply to Text Widgets
  • テキストの外部リンクを対象とする。チェックしておきます

  • Treat Subdomains as Local
  • 複数のサイトを運営している場合に、サブドメインのサイトをローカルとして設定できる。例えば「domain.com」と「store.domain.com」を両方運営していて、後者のサイトのリンクは外部ページではなく内部のページとして扱える。この箇所は任意で設定しましょう

  • Auto Convert Text Urls
  • 自動でリンクの形をしたテキストにaタグを付けてリンクにする。チェックしませんでした

  • Add No Follow
  • 次の章で細かく説明

nofollowとは?

上記の設定項目の「Add No Follow」について説明していきます。

nofollow

nofollowはリンクの属性として設定でき、nofollowはかんたんに説明すると「うちのサイトと紹介したサイトは関係ないよ」ということを検索エンジンに知らせるものです。

例えば、

<a href=”http://hoge.com” rel=”nofollow”>外部サイトです</a>

のようにnofollowを設定すると、検索エンジンが自分のサイトを辿ったときに、nofollowのリンク以降は辿らないように設定できます。

リンクを貼ることは、相手のサイトを評価することに繋がります。外部リンク先がスパム等のサイトであった時、検索エンジンの自分のサイトへの評価が落ちてしまいます。

例では、aタグにrelをつけてnofollowを設定しましたが、External Linksプラグインでは該当箇所にチェックをいれるだけで有効化されます

今回の場合、「Add No Follow」は運営するサイトに合わせてチェックを入れてください。外部リンク先が信用できないサイトが多い場合はチェックを入れておいた方が良いでしょう。

では、残りの設定項目に戻ります。

  • Add Icons
  • 外部リンクの隣にアイコンを表示させます。「Open in New Windows」は外部リンクを開いた時に別窓で開いてくれます。外部サイトを別窓で開くと、自分のサイトに戻ってきやすくなって便利です。チェックしておきましょう。

  • Domains to Exclude
  • 上記設定を反映させないドメインを設定出来ます。必要に応じて入力しましょう。

全ての設定が終わったら「save Changes」ボタンを忘れずに。

アイコンの設置確認

ちゃんと設定が反映されているか確認してみましょう。

wp-external-links5

外部サイトであるGoogleのリンクを貼ると、右隣に外部サイトを示すアイコンが表示されました。リンクをクリックすると別窓で開いてくれます。

ちなみに、任意のリンクだけアイコンを表示させたくない場合は、aタグに「class=”no_icon”」を設定することで非表示にできます。参考にしてください。

外部アイコン画像を変更したい場合

外部アイコンの画像の変更方法は、ブログ「ぐうたら主婦が色々勉強中」さんで紹介されていましたので、そちらを参考にしてみてください。

参考【プラグイン】「External Links」で外部リンクのアイコンを付ける&アイコンの変更方法

下記にある「external.png」を任意の画像に変更してあげればOKだそうです。

/wp-content/plugins/sem-external-links/external.png

紺さん(@kon_guutara)ありがとうございました。

まとめ

External Linksプラグインを使うことで、手軽に外部リンクにアイコンを付けることができました。

ちなみに、外部リンクを別窓で開く設定はWordPress側でも設定できるので、毎回手動で行いたい人はチェックを外すと良いかと思います。

この記事が気に入ったら
いいね ! しよう

Twitter で
LINEで送る
Pocket

okutani (@okutani_t) のヒトコト
外部リンクを見た目でわかるようにすると、訪れた人にも良い印象を与えることが出来ますね。自分で管理する際にも便利なので是非導入してみてください。

 - WordPressプラグイン

スポンサーリンク

PC用AdSense

PC用AdSense

Share
  • このエントリーをはてなブックマークに追加

  こちらの関連記事もどうぞ

「EWWW Image Optimizer」プラグインで画像の自動圧縮を行う

こんにちは、okutani(@okutani_t)です。WordPressで画像 …

SEO対策に!PubSubHubbubを使ってGoogleに素早くインデックス

こんにちは、okutani(@okutani_t)です。WordPressプラグ …

WordPressのSEO対策定番プラグイン「All in One SEO Pack」導入手順

こんにちは、okutani(@okutani_t)です。WordPressでサイ …

[WordPress] 画像をあとから読み込んで表示速度アップ!「Lazy Load」プラグイン

こんにちは、okutani(@okutani_t)です。皆さんはブログ記事を書く …

DISQUSでWordPressのコメント欄をパワーアップしよう!

こんにちは、okutani(@okutani_t)です。WordPressサイト …

カテゴリーの順番を変更する「Category Order」プラグイン使い方

こんにちは、okutani(@okutani_t)です。今回は、かんたんにWor …

WordPressのサイトマップを「PS Auto Sitemap」で作成してみよう

こんにちは、okutani(@okutani_t)です。サイトマップとは、サイト …

「Broken Link Checker」を使ってサイトのリンク切れを防ごう!

こんにちは、okutani(@okutani_t)です。みなさんはサイトに貼り付 …

Table of Contents Plusで任意のページだけもくじ番号を非表示にする方法

WordPressのプラグイン「Table of Contents Plus」を …

[WordPress]お問い合わせフォームを「Contact Form 7」で作成する

こんにちは、okutani(@okutani_t)です。サイトを運営していて必要 …

vdeepのトップページへ戻る画像です。風船の形をした島を女の子が掴んでいます。