WordPress:記事中にサムネイル付のリンク(ブログカード)を表示できるプラグイン「Celtispack」

      2016/09/22

eye_wp

今日は記事中にサムネイル付きのリンクを簡単に貼ることができるプラグイン「Celtispack」をご紹介します!

色々なブログで見る機会も多いと思いますがこういう「はてなブログのブログカード」っぽいやつですね↓

20160322a

普通に文字列だけのリンクよりも、何となくカッチョいいですよね。
簡単に設定できますので興味ある方は以下を参考にしてください。

スポンサーリンク

「Celtispack」のインストールと設定方法

まずはプラグインをインストールしましょう!
制作者様のサイトから最新版をダウンロードしてください↓

WordPress Plugin : Celtispack
WordPressでブログをしているなら絶対おすすめの Celtispack プラグインパックの紹介です。高速化や画像最適化など様々な機能が満載です。このプラグインと Jetpack を組み合わせて使用して頂ければ、必要なものはほとんどカバー出来ます (^^)...

ダウンロードできたら、WordPress管理画面の「プラグイン → 新規追加 → プラグインのアップロード」をクリックし、ZIPフォルダをそのままアップロードします。

アップロード後は「有効化」するのをお忘れなく。

ブログカードを表示するための設定

有効化したら「設定 → Celtisプラグインパック」と開くと設定画面になります。
サムネイル付きのリンクを作成するために必要なのは「oEmbed extend」の部分。

WordPressのバージョン4.4以上の場合↓

20160322b

「oEmbed extend」のところにチェックを入れます。
WordPressのバージョン4.3以下の場合は設定項目が少し少ないと思いますが、基本的に全てチェックでオッケーです。

4.4以上の場合、ドロップダウンで以下の3種類から選択できますが、それぞれの特徴はこんな感じです↓

・Wordpress oEmbed形式
WordPressのバージョン4.4から使えるようになった標準のブログカード機能です。
ややこしいので詳細は書きませんが、サーバーに負荷もかかったりするのであまりオススメではないです。

・Celtispack OGPブログカード形式
OGPを設定しているサイトなら、その情報を取得してブログカードを表示してくます。

・WP形式(優先)とOGPブログカード併用
上記2つを併用する設定のようです。
oEmbedは今のところオススメできないので、この設定も避けた方が無難。

このプラグインには他にも色々と設定できるようになっていますが、その他の機能は上記の制作者様のサイトでご確認ください。
当サイトでは今のところブログカード用の設定しか使っていないので、他に便利そうな機能があればまたご紹介したいと思います。

設定したら一番下の「設定を保存」を押せば完了です!

サムネイル付きリンクを貼ってみよう!

実際にサムネイル付きリンクを貼る方法はすごく簡単!
リンク元のページのURLをコピーして、記事中にペーストするだけ!
これだけで外部リンクも、自分の記事への内部リンクも自動的にブログカードで表示してくれますよ!便利ですね〜♪

ブログカードが表示されない場合

URLを貼り付けてもブログカードが表示されないことがあります。
原因は恐らく次の2点。

原因その1:OGPが設定されていない

このプラグインはOGPの設定を取得してブログカード風に表示するので、OGPが設定されていないサイトだとURLを貼り付けてもブログカード風に表示されません。

外部サイトの場合は仕方ないですが、ご自分のサイトにまだOGPを設定していないという方は必ずやっといた方が良いので急いで設定しましょう!
設定方法は以前に書きましたので参考にどうぞ↓

2016年版:WordPressでOGPを正しく簡単に設定する方法 [プラグイン不使用]
WordPressで作ったサイトにOGPを設定しよう!
プラグインを使わずに正しく設定する方法をご紹介します。

原因その2:プラグインの干渉

もう1つの原因はプラグインの相性の問題。

この「Celtispack」は様々な機能がありますが、似たような機能の別のプラグインを使っていると干渉して上手く動かないこともあるようです。

OGPはちゃんと設定しているのにブログカードが表示されないという方は、使っているプラグインをチェックしてみてください。

文字列でリンクを貼りたい場合

このプラグインはOGPが設定されているサイトのURLなら、全てブログカード風にキレイに表示してくれるわけですが、たまには普通に文字列だけでリンクを貼りたいこともあるかもしれません。

そんな時は最初に文字を入力してから、エディタの「リンクの挿入ボタン」でリンクを貼ればオッケーです。こういう画面が出るやつですね↓

20160322c

まとめてたくさんリンクを貼る場合なんかは全部ブログカードだとスペース使い過ぎでちょっとウザいですからね。状況に応じて上手く使い分けていきましょう。

おまけ

「Celtispack」を使う理由

最後に小話を1つ。
実はブログカードを表示する方法は他にも色々あります。

よく使われていたのは「はてなブログ」の機能を使ってWordPressに対応させたもの。
◯users」みたいなブックマーク数も一緒に表示されるタイプですね。

このタイプのブログカードはWordPressのピンバックが正常に飛ばないようです。
ピンバックとはリンク元のサイト管理者に「リンクを貼りましたよ」っていう通知を送る仕組み。

さらにリファラ情報も「hatenablog.com」になってアクセス解析で見てもどこからアクセスがあったのか分からないなんてことも。

リンクを貼ってもらえた側はどこに貼ってもらったのか分かると嬉しいし、リンク元の管理者がピンバックを承認するとコメント欄に表示されたりするので、そのリンクから自サイトへのアクセスもあるかもしれません。
なのでピンバックやリファラ情報はなるべくちゃんと送れた方が良いと思うのです。

他にもブックマークレットを使ったブログカードの表示方法などありますが、毎回リンクを貼る度に作業が発生したりするので超めんどくさいです。

簡単な説明ですがとにかく2016年3月の現時点では今回紹介した「Celtispack」を使った方法が一番簡単で、きちんとリファラも伝えてくれるのでベストだと思います。

まとめ

ブログカードでリンクを表示するだけでなんか立派な記事になった感じがしますよね!
プラグインのおかげで簡単に導入できるので皆さんもお試しください♪

【追記:2016.3.24】
「Celtispack」と一緒に使うと便利なプラグイン「WP External Links」について記事を書きましたので良かったらこちらもどうぞ↓

WordPress:外部リンクに自動でアイコン&新しいタブで開く設定ができる「WP External Links」
前回ご紹介したプラグイン「Celtispack」と一緒に設定すると便利なプラグインのご紹介です。

 

スポンサーリンク

この記事をシェアする!

 - WordPress