ぼやき

0

最近よく見るリンクにアイキャッチと本文の抜粋が入っているカード形式のリンクがあります。こういうヤツです。

これブログカードというらしいです。はてなブログが始めたようです。

これをはてなブログ以外で表示するには以下のようなコードを入れればようようです。

<iframe class="hatenablogcard" style="width:100%;height:155px;max-width:680px;" title="ブログに写真や動画を貼り付ける「リンク挿入」機能を使いやすくしました URLをペーストするだけでコンテンツを埋め込めます" src="https://hatenablog-parts.com/embed?url=http://staff.hatenablog.com/entry/2014/08/14/184000" width="300" height="150" frameborder="0" scrolling="no"></iframe>

これを使ってもいいのだけれど、はてなブログのブログカードを使うと、iframe ではてなの URL を読み込んで使っているので、リンクがすべてはてなからされたことになってしまうのです。

WordPress 標準のブログカード

似たようなものが WordPress 4.4 から標準機能として搭載されたみたいです。YouTube や Flickr を埋め込む Enbed 機能は前からありましたが、同様に WordPress で作ったサイトも埋め込めるようになったみたいです。WordPress の標準機能でブログカードを表示するには、ほかの文字は入れず URL だけを 1 行で書けばいいみたいです。

http://www.1010uzu.com/boyaki/2017/03/nitori-wire-baskets-vegetables-not-in-refrigerator

WordPress 標準のブログカードが表示されない

それで早速表示させてみたのだけれど、リンクが以下のように <blockquote> で囲まれるだけで、ブログカード形式で表示されません。

冷蔵庫に入れない野菜はニトリのワイヤーバスケットに入れて保存することにしました

ブログカードが表示されないのは Permalink Redirect のせい

原因を調査してみると Permalink Redirect というプラグインとの相性が悪いようです。Permalink Redirect を無効にするときちんと表示されます。

冷蔵庫に入れない野菜はニトリのワイヤーバスケットに入れて保存することにしました

Permalink Redirect は以前パーマリンクを変更した際、古いパーマリンクからアクセスしたときにリダイレクトするようにインストールしたものです。
WordPress 3.3.1 パーマリンク変更後をリダイレクトするプラグインの動作検証

Permalink Redirect は WordPress 公式にもなく以下のページからダウンロードしてきたもので、かなり古く 2011 年から更新されていません。
→Scott Yang’s Playground:Permalink Redirect WordPress Plugin

代替プラグインを探してみたのですが、古いパーマリンクを新しいものにリダイレクトできるプラグインはありませんでした。以下のサイトによると、Simple 301 Redirects というプラグインでパーマリンクのリダイレクトができると書いてあります。(自サイト以外でもリンク先が WordPress 4.4 以上で埋め込み機能を停止してなければ、ブログカードが表示されます。)

A Simple Guide to Changing Your Permalinks Without Breaking Your WordPress Website

しかしどうやら WordPress とプラグインのアップデートによって動かなくなった模様です。パーマリンクのタグ(%year%、%postname% など)で指定しなければ動きますが、1 件ずつ記入するのは数が多くて現実的ではありません。

Permalink Redirect を改造

以下のサイトを参考に URL を書き出して .htaccess で指定しようかとも思ったのですが、スラッグを変更したらリダイレクトが 2 回かかることになるな、と思いやめました。
→Web Shufu:【wordpressサイト限定】リダイレクトのための.htaccessへの記述を表計算ソフトとget_postsで効率化

結局 Permalink Redirect を改造して動かすことにしました。WordPress 3.3 の頃の仕様なので、埋め込みページに対応していないようです。101 行目に以下のように追加しました。

        if ($query->is_trackback || 
            $query->is_search || 
            $query->is_comments_popup ||
            $query->is_robots ||
            $query->is_embed || //追加
            $this->is_skip($req_uri))
        {
            return;
        }

埋め込み (is_embed) のときは処理を止めるようにしているので、この改造では古いパーマリンクの URL を貼ってもブログカードには変換してくれません。

http://www.1010uzu.com/boyaki/200410-02235117.html

パーマリンクを変更したのは、2010 年の 12 月からなので、古い URL で埋め込んでいる人はいないだろうから問題にはならないでしょう。

ブログカードで表示してみたけれど、このサイトは WordPress 標準のアイキャッチを使用していないので、カードが寂しいですね。あとカードがやたらと大きいです。それから iframe で相手方の情報をもらってきているので、相手のサーバーが遅いと表示も全体的に遅くなります。遅延読み込みの Lazy Load とか使えば解決するかな。もう少し改造が必要です。

関連記事