simplicity、Cocoonで文中に写真付きの内部リンク・外部リンクを作成する方法

私は、もう3年ほど、ワードプレスのテーマにsimplicityを使用していますが、つい最近になって、記事の文中の内部リンクをもう少し綺麗にカッコよく表示したいと思うようになりました。

というのも、他の方のワードプレスのブログを見ると自分の他の記事への内部リンクが、写真付きで綺麗に表示されているのを何度も見るからです。

あれは、どうやって写真付きの内部リンクを作成しているのか?

ワードプレスを始めた当初は、全くわからず、私は、普通に質素な内部リンクを貼っていました。

しかし、最近になって、写真付きの内部リンクは、

WordPressのプラグインである「Pz-LinkCard」「Celtispack」「Browser Shots」などを使うことによって可能であることがわかりました。

ところが、うれしいことに、よく調べてみると、私が、使っているsimplicityには、写真付きの内部リンク、外部リンクを作成する機能が初めから備わっていることがわかりました。

もちろん、後継テーマであるCocoon(コクーン)にもこの機能が備わっています。

私は、現在、ワードプレスのテーマは、simplicityを利用してますが、そのうちのいくつかを近々、後継テーマであるコクーンに移行しようと考えています。

そのため、今回の記事では、simplicity、コクーンで写真付きの内部リンク、外部リンクを作成する方法を忘れないために自分のためにも書いておきます。

スポンサーリンク

simplicityで文中に写真付きの内部リンク・外部リンクを作るには!

simplicityには、プラグインがなくても文中に写真付きの内部リンク・外部リンクを作ることができる機能が初めから備わっています。

作成の仕方はとても簡単です!

写真付きの内部リンクの作成方法!

1、ワードプレスの管理画面(ダッシュボード)を開きます。

2、左側のメニューの外観にマウスカーソルを合わせてカスタマイズをクリックします。

3、左側のメニューにあるブログカード(内部リンク)をクリックします。

4、ブログカード有効にチェックを入れます。

※初期設定では、チェックが入っていません。

5、初期設定では、内部リンクをクリックすると同一タブで表示されます。

新しいタブで開きたい場合は、新しいタブで開くにチェックを入れます。

6、公開ボタンをクリックします。そして左横にある×をクリックして画面を閉じます。

これで、ワードプレス側の設定が終了しましたので後は、記事の投稿の編集画面で内部リンクを入れたいところに、自分の記事のURL(内部リンク)を入力すればOKです。

実際に内部リンクを文中に入れてみる!

記事の文中に以下のようにURLを入力します。

するとウェブ上では以下のように表示されます

難しい設定は必要ありません。内部リンクを入れたいところに、自分の記事のURLをコピーして貼り付けてやればいいだけです。

※ちなみに、ワードプレスの投稿の編集画面で、ビジュアルモードでもテキストモードでも、どちらでも構いません

本当に簡単に作成できるのでちょっと驚いてしまいます。

また、プラグインがなくても作成できるのは、とても助かります。

写真付きの外部リンクを作成したい場合

外部リンクを写真付きのリンクにしたい場合も簡単にできます。

上記の手順3で、ブログカード(外部リンク)をクリックして同じように設定してやればOKです。

コクーンで文中に写真付きの内部リンク・外部リンクを作るには!

simplicityの後継テーマなので、もちろん、コクーンにもプラグインを使わずに文中に写真付きの内部リンク・外部リンクを作成する機能が備わっています。

simplicityとは若干設定方法が違います。

1、ワードプレスの管理画面(ダッシュボード)を開きます。

2、左側のメニューのCocoon設定にマウスカーソルを合わせてCocoon設定をクリックします。

3、Cocoon設定画面が表示されますので、ブログカードをクリックします。

4、内部ブログカード設定でブログカード表示を有効にするにチェックを入れます。

※恐らく、初期設定でチェックが入っているはずです。

5、URLリンクをクリックしたときに、新しいタブで開きたい場合は、新しいタブで開くにチェックを入れます。

※初期設定では、チェックが入っていません。

同一タブで開くか?新しいタブで開くかは、好きな方を選ぶといいでしょう。

6、最後に変更をまとめて保存をクリックします。

これで、ワードプレス側の設定が完了です。

後は、simplicityのときと同じようにワードプレスの投稿の編集画面で、内部リンクを入れたい場所に、自分の記事のURLを入力してやるだけです。

※ワードプレスのビジュアルモード、テキストモード、どちらでも構いません。

写真付きの外部リンクを作成したい場合

こちらも非常に簡単で、コクーンの場合は、内部ブログカード設定のすぐ下に外部ブログカード設定の画面がありますので、そこで、同じように設定すればOKです。

simplicityとコクーンの写真付き内部リンク・外部リンクの違い

2つのテーマで、ブログカードを有効にして、写真付きの内部リンクを作成してみましたが、若干デザインが違うことがわかりました。

●初期設定では、コクーンの方が、少し横に長く表示されます。simplicityより表示画面が大きいです。

※設定でsimplicityも横に長く表示することが可能です。

●大きな違いは、後継テーマであるコクーンは、写真付きの内部リンクを作成した場合、どの部分をクリックしてもリンクとして反応して移動してくれます。

これは、ありがたいです。さすが、後継テーマですね!

具体的にいうと、写真付きの内部リンクは、

1、写真 2、記事のタイトル 3、記事の文章 4、サイトのURLで構成されていますが、

simplicityの場合は、上記でいう1、2、4をクリックするとリンク先へ移動しましたが、3の「記事の文章」をクリックしてもリンク先へ移動しませんでした。

コクーンでは、それが可能になっています。

今後、私は、両方のテーマを使わせてもらう予定です。

重要なブログ、これから新しく作るブログは、コクーンに変更、そして古い趣味用のブログは、simplicityのままでという感じです。

そのため、今回、ブログカード機能を使った写真付きの内部リンクを2つのテーマで、実際に比べてみましたが、コクーンの完成度にとても満足しています。

スポンサーリンク

シェアする

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

フォローする