WordPressでもはてなブログみたいなブログカード使いたい!

アローラ!イエロー(@inahime_poke)です。

今回はWordPressのお話です(このブログ、はてなブログなのに!笑)

もともとこのブログではバドミントン関連の記事も書いていましたが、対象となる読者のペルソナがあまりにも乖離しているので、分離することにしました。

そのブログは現在WordPressにて運用中なのですが、そこで1つ悩んだのが「いいブログカードが見当たらない」でした。今回は4通りの方法を吟味し、そのなかで自分が選んだ方法を理由とともに解説します。

WordPressでもはてなブログみたいなブログカードがほしい

WordPressでは、はてな時代に当たり前に使っていた機能も一部使うことができません。

…あ、ブログカードってのはコレのことですね。

見栄えがいいので、できれば似たようなものを使いたいんだけど、WordPressではこの通りにはいきませんでした。

デフォルト機能

実はWordPressでもブログカード機能がデフォルトでついてるんだけど、スマホで見るとでかすぎるんですよね…。

f:id:or_chard:20171122224602j:plain

別に画面の半分以上占領してまで主張しなくていいんですよ。論外。

STORKのショートコード

ブログではOPEN CAGE製のテーマ「STORK」を使っています。最近、またかよってうんざりする程度には、どのブログもSTORKですよね。

実はSTORKには、ショートコードを指定することで関連記事を指定できます(参考:OPEN CAGE公式解説

一見するとかなりいい感じ。

f:id:or_chard:20171122224622j:plain

…しかし、この方法には3つの欠点があります。

  1. 外部リンクには使えません。これが致命的。考え方を変えれば内部リンクだけしっかり循環させればいいんだけど。
  2. 「記事ID」ってのをいちいち指定しなきゃいけなくて、それがめんどくさい(URLを入力する以外にも手間がかかるのが美しくない)。
  3. OPEN CAGE製以外にWordPressのいいテーマが出てきたときに書き直さなきゃいけない。

特に気になったのは1と3。

STORKのショートコードはWordPressにもともと備わっているものじゃなくて、独自のショートコードなので、乗り換えようと思ったらショートコードを全部書きかえなきゃいけません。

それはめんどくさいなあと思った(一括でショートコードを書き換える方法もあるらしいけどね、Search Regexというやつ)。

というわけで、他の方法を探すことに。。

ShareHTML

HTMLなら、Web全体で共通するコードなので、テーマにかかわらず同じ見た目のブログカードが作れます。

しかもSTORKのように「内部リンク限定」という変な縛りもありません。

これみつけたときはテンションめっちゃ上がりましたが、残念ながらスマホビューがイマイチでした。。

f:id:or_chard:20171122224652j:plain

プラグイン

STORK限定というのがイヤだったので、WordPress共通のプラグインを探そうと考えました。

プラグインなら、テーマをかえたときでもそのまま使えるというのが嬉しいところ。今回はPz-LinkCardというのを使いました。

f:id:or_chard:20171122224708j:plain

スマホでの視認性もそんなに悪くない。ただPCでみたときにかなり地味に見えるので、そこだけは少し我慢が必要になりそうです。

デフォルトの設定のなかで、プラグインの設定画面から「抜粋文を表示する」というチェックを外すと、ずいぶんスッキリしたので使いやすくなりました。

  • プラグインなので、WordPress共通で使える(テーマに依存しない)
  • スマホでの視認性もいい(画面を占領しすぎない)
  • 外部リンクにも使える!

以上の3点から、今回はPz-LinkCardというプラグインを使うことに決めたわけでした。

カスタマイズ、したくなる

せっかく有料テーマを買うのだから、基本的にはデフォルトで準備された機能を使っておきたいところです。

STORKには他にも「会話文」などの機能がついているので、なかなかいいですよー。

WordPressでガチガチのアフィリエイトするなら賢威とかAFFINGER4とかもいいと思いますが、あのブログではコンテンツのお届けがメインなので、今回はモバイルからの読みやすさが追求されたSTORKにしています。

ほかにWordPressのいいテーマあれば教えてください()

きょうの ぼうけんは ここまで
イエローでした~