The following two tabs change content below.
ブログを効率よく運営して、集客や収益化(マネタイズ)を全自動化させることが最も得意。たった1つのブログで、年間1億2,000万円を動かすまでになりました。かわいい愛娘が2人いて、現在子育てに奮闘中! ⇒詳しいプロフィールはここをクリック

ユーザーの回遊率を高めてPV(ページビュー数:観覧されたページ数)を高めたり、読んでほしいページへ誘導したりしたい場合、内部リンクを行う必要があります。

通常、テキストリンクで内部リンクを張ります。テキストリンクとは、「このページへのテキストリンク」のように、文字そのものをリンクにすることです。じっくり読んでくれる人であれば、テキストリンクの内部リンクは有効です。

しかし、流し読みをするユーザーには、気づいてすらもらえないリスクがあります。

そこで、WordPress(ワードプレス)テーマ「ストーク」であれば、画像付き内部リンクのショートコードが用意されていおます。活用すれば、以下のように目立つ内部リンクを作成できます。

WordPressテーマ・ストークの画像付きの内部リンクショートコード

2017.12.14

このページでは、当サイトでも使用しているワードプレスのテーマ「ストーク」にて、画像付き内部リンクを作成する方法を紹介します。

注意

ここで紹介するボタンショートコードは、WordPressテーマ「ストーク」のものになります。他のテンプレートでは使用できないため、ご注意ください。

ストークの詳細については、以下の記事をご覧いただけますと幸いです。

ブログ初心者必見!wordpressのおすすめテーマはストークで決まり

2017.05.23

ストークに装備された画像付き内部リンクショートコードの使い方

そもそも内部リンクとは、同じサイト・ブログ内のページから、他の同サイト内ページへリンクさせることです。

一方、外部サイトからのリンクを、外部リンクと呼びます。

内部リンクのイメージ
けんいち君
あらゆるページから、読んでもらいたいページへ内部リンクを張れば、コンバージョン率も上がりそうですね!

同サイト内の他のページを見てもらいたいとき、内部リンクを設定しておけば、以下のように関連記事も観覧してもらえるようになります。

内部リンクのイメージ

ストークの場合、この内部リンクをさらに目立たせることができるため、使い分けができるようになります。

本来であれば、画像付き関連記事を表示させるにはややこしいコードを入力する必要があります。

しかし、ストークのショートコードを使用すれば、以下の2ステップだけで見栄えの良い内部リンクを作成できます。

  1. それぞれの記事に用意された記事IDを見つける
  2. 画像付き内部リンクのショートコードへ記事IDを埋め込む

順を追って解説します。

ステップ1:それぞれの記事に用意された記事IDを見つける

画像付き内部リンクは、見栄えが良いわりに、設定方法は驚くほど簡単です。

ストークに標準で用意されているショートコードに、「記事ID」と呼ばれるものを入力するだけです。記事IDとは、コンテンツに振り分けられたIDのことであり、それぞれのURLに記載された番号のことを指します。

たとえばこのページ場合、以下の通り「3312」が記事IDになります。

WordPressの記事に振り分けられた記事IDのイメージ

記事IDの探し方は、WordPressにて、内部リンクを張りつけたいコンテンツの編集ページを開き、URLを見ることで簡単に確認できます。「post=  」と書いてある  の部分にIDが記載されているため、確かめてみましょう。

ステップ2:画像付き内部リンクのショートコードへ記事IDを埋め込む

具体的な使い方は、以下の黒い背景のショートコードをコピーして、関連記事を表示させたい場所に張り付けてください。

画像付き内部リンクのショートコード

次に、先ほど調べた記事IDを、以下にある上記でコピーしたショートコードの「” “」の の中に記事IDを埋め込むだけで完成です。

注意
関連記事の作成ができるのは一般投稿だけでは、固定ページやランディングページでは作成できないのでご注意ください 。

また、他の方が運営している記事には使用できません。内部リンクだけです。

たとえば、このページの画像付き関連記事の内部リンクを作成したい場合、以下のようになります。

このページのショートコード

この表記だけで、以下のような画像付き関連記事の内部リンクが完成するのです。

WordPressテーマ・ストークの画像付きの内部リンクショートコード

2017.12.14

けんいち君
これは簡単ですね! しかも見栄えもいいので、素人の僕にはありがたいです。

以下に画像付き内部リンクのショートコード一覧を用意しましたので、任意のものを使用しましょう。

画像付き内部リンクのショートコード一覧

先に解説した通り、使用したい黒い背景のショートコードをコピーして、関連記事を表示させたい場所に張り付けてください。

次に、内部リンクを張りたい記事IDを調べたうえで、ショートコードの「” “」の の中に記事IDを埋め込んで使用しましょう。

単一記事のショートコード

単一記事のショートコード

関連記事を複数同時に表示させるのショートコード

いくつもの記事を紹介したい場合、全てにショートコードを設定するのは面倒ですよね。

そこで、記事IDの間に「,(半角カンマ)」を入れることで、一つのショートコードで関連記事を複数表示できます。この場合、「” , “」の の中に記事IDを埋め込み、画像付き関連記事の内部リンクを作成してみましょう。何記事でも表示可能です。

以下が、ショートコードになります。

複数関連記事を表示させるショートコード

「関連記事」という表記を消したショートコード

これまでの画像付き内部リンクには、「関連記事」といった表示がありました。これを載せたくない場合、このショートコードを使えば削除可能です。

以下の「” “」の の中に記事IDを埋め込み、画像付き関連記事の内部リンクを作成してみましょう。

「関連記事」という表記を消したショートコード
表記が消えた見え方

「AddQuicktag」を活用して、画像付き内部リンクのショートコードをワンクリックで呼び出す方法

ショートコードといえど、毎回コピー&ペーストをしていては効率が悪すぎます。

そこで、「AddQuicktag」というプラグインを活用すれば、毎回ショートコードをコピー&ペーストを行う必要はありません。「AddQuicktag」に画像付き内部リンクのショートコードを登録しておけば、記事投稿画面にてワンクリックで登録したボタンのショートコードを呼び出せます。

AddQuicktagを使用して画像付き内部リンクのショートコードを呼び出したときのイメージ
けんいち君
●これは便利! 作業効率が格段に上がりますね! あざーす!

詳しいやり方や「AddQuicktag」の詳細に関しては、以下の記事を参考にしてください。

AddQuicktagの使い方:ストークのショートコードを登録する方法

2017.12.14

まとめ

画像付き関連記事を使いこなすことで、ユーザーが他のページも見てくれるようになります。離脱を抑えることができれば、回遊率があがり、PV(ページビュー数:見られたページ数)が増えるます。

さらに、アフィリエイトやお問い合わせなどの成約ページまで誘導することも可能です。

有効的に活用して、使い勝手の良いブログ運営を心がけましょう。

>>以下でストークで使用できるショートコード一覧が確認できます

イノバース
イノバースでは、LINE@でブログには書けない最新のアクセスアップ(SEO)方法やブログの収益化方法を無料で配信させていただきます。

ぜひ、以下よりご登録ください。

友だち追加

無料メールマガジンにて、「ブログで稼ぐための全手順」を公開中

以下にいつも使っているメールアドレスを
正しくゆっくり入力し『登録ボタン』をクリックしてください。

メールアドレス
※必須※