WordPressカスタマイズ

WordPressでブログカード(サムネイル付きのリンク)を設置する方法3つ

wordpress%e3%81%a7%e3%82%b5%e3%83%a0%e3%83%8d%e3%82%a4%e3%83%ab%e4%bb%98%e3%81%8d%e3%81%ae%e3%83%aa%e3%83%b3%e3%82%af%e3%82%92%e8%a8%ad%e7%bd%ae%e3%81%99%e3%82%8b%e6%96%b9%e6%b3%95

記事内にサムネイル付きリンクを掲載したい

サイト運営をしていると、記事内に「合わせて読みたい」や「関連記事」といったような内部リンクを貼ることがとても多い。

ユーザーの興味関心のある記事を合わせて記事内に仕込んでおくことで、他のページも見てもらおうという手法だ。

この、内部リンク。

はてなブログでは簡単にサムネイル付きのリンク(ブログカード)を設置することができるのだが、
WordPressには残念ながらそういったオプションはない。

テキストだけのリンクよりもやはりサムネイル付きのリンクの方が視認性が良いため、
どうせ設置するならはてなブログのようにサムネイル付きのリンクを記事内に設置したいわけだ。

ワードプレスで記事内にサムネイル付きリンク(ブログカード)を設置する方法

①ショートコードでブログカードを設置する

functions.phpにコードを記述し、
投稿画面に簡単なショートコードを記述するだけで簡単にサムネイル付きの内部リンクを設置できるという方法がある。

参照:【WordPress】内部リンクをはてなのブログカード風のサムネイル付きリンクにデザインするショートコード

利用するショートコードはこちら

[nlink url=”#URL”]

引数にtitleを指定すれば任意のタイトルでリンクする事もでき、
因数にexcerptを指定することで任意の説明文を付加することもできるというからめちゃくちゃ便利!!!神っ!!

他にもアイキャッチのサイズなども変更可能だそう。神っ!!

詳しい事は上記参照ページにて。

②プラグインでブログカードを設置する

ワードプレスにも便利なブログカードプラグインが登場した。
その名も『Pz-HatenaBlogCard』。

プラグインをインストールして有効化したら、ブログカードにしたいリンクを
「blogcard url=”#URL”]
で記載するだけ。
※[]は半角になおしてね

これだけではてなブログのようなブログカードが簡単に表示される。

– – – – – 以下追記 (2017.06)- – – – – –

現在は『Pz-LinkCard』という新しいプラグインが発表された。
『Pz-HatenaBlogCard』も使えるが、最新版の『Pz-LinkCard』に切り替えるのが良さそう。

こちらも全く同じタグの記載でブログカードが作れる。
色々と詳細設定もできるのでありがたい。

③ワードプレスにURL直書きでブログカード設置

ワードプレスで既存のブログカード表示はなかったのだが、
気づいたらいつの間にかワードプレスにも標準でブログカード機能が登場したらしい。

ワードプレスのビジュアルエディタの中に、ブログカードにしたいURLを書き込むだけ。

注意したい点は、
1行にURLだけを書き込む
という事。

1行の中にURL以外のテキストが含まれるとブログカードが表示されない仕様になっている。

実際にURLを記載するとこのような表示になる。

https://tokyo-free.info/archives/78

これで、プラグインを入れたりショートコードを使ったりしなくてもブログカードが表示されるのだから超簡単だ!!

 

 

Riche