この前「画像が正常に出ていない」トラブルがあったので、投稿したブログを見返していると・・・、あれ？ブログカードが出ていない〜〜〜！！
ブログカードとは、WordPressの埋め込み機能で、ブログのURLを投稿画面に貼り付けると、カード状に表示される機能です
例えばブログのURL、https://www.sanalog.tokyo/archives/737 をコピペすると
↓
こんな表示になります。
投稿画面（内部リンク）ではきちんと表示されているのに、サイトを確認すると、
と、なぜか「引用」になっています。外部リンクだとブログカードが出ていない！スマホも同じ状態に。え？いつからだろう？
ブログカードが出ない理由はいくつかある
プラグインとの不具合
う〜ん、これってこの間「Lazy Load」というプラグインをはずしてから起こっている現象の気がする。
そう思い、「Lazy Load」ほか、いろいろなプラグインを「無効化」「有効化」にして検証してみました。
試したプラグインの中で、以下のプラグインを「無効化」にすると一瞬ブログカードが現れました！
- All in One SEO
- Autoptimize
- EWWW Image Optimizer
けれど、リロードするとまた「引用」になってしまいます。「Lazy Load」を有効にしても何も変わりませんでした。
ネットを見てみると、こちらのプラグインを外したことで直ったと書いてあるサイトも
- Head Cleaner
- Custom Permalinks
私はインストールしていないプラグインのため、他の原因のようです。
キャッシュをクリアしてみる
これ、結構大事です。Chrome＞検索＞全検索を表示＞観覧履歴データの削除から、「□観覧履歴」と「□キャッシュされた画像とファイル」にチェックを入れて、「データを削除」してみます。
お〜！戻った！！！でもリロードすると「引用」になってしまいます。う〜ん。
URLの前後に余白がないと、表示されないことがある
テーマによっては、ブログカードの前後に十分な余白を取っていないとブログカードがうまく表示されないことがあるそうです。でも私の場合は、表示されていたものが、ある日突然表示されなくなったので、テーマが原因ではなさそうです。
パーマリンクが変更されている
「custom permalinks」というプラグインを使用すると、記事のパーマリンクを変更してしまう可能性があります。元のパーマリンクに戻すと表示されることもあるそうです。私は使っていないので、これも違うかも。
投稿した記事を「テキスト」で確認
リンクに<a>等のタグが付いている
例えば、<a href=”https://www.sanalog.tokyo/archives/1829”></a> と<a>タグで囲まれているとブログカードは出てきません。同様にテキストエディタ内で、<p></p>、<span></span>、<ul></ul>などのタグにURLが囲まれていても、ブログカードは出てきません。
Gutenberg特有のコードの可能性
WordPressの新しい投稿方式（Gutenberg）で投稿すると、<!– wp:paragraph –>、<!– wp:quote –>のように、特有のコードが入る場合があるそうです。これがあったら、即削除。
テキストを見ましたがタグも付いていないし、私は「Classic Editor」を使っているので該当しません。困った。
その他の理由
プラグイン「All in One SEO」の設定を変えたら直ったとの話もありました。私は逆に「All in One SEO」の設定を変更して、Twitterに投稿した際、ブログカードにアイキャッチ画像が入るようになったため、ここは設定の変更はしたくないなと思います。
ブログカードが出ない理由は様々なので、いろいろ検証が必要です。もうお手上げなので、さくっとプラグインを入れることにしました。
プラグイン「Pz-LinkCard」のインストール
プラグインを有効化
「挙動が重い」との評価もあるこのプラグイン。でもサクっとインストールしてみます。
「今すぐインストール」→「有効化」で有効化します。
プラグインの使い方
投稿画面にいくと、「リンクカードの作成」ボタンが生成されています。
ボタンを押すと、URLを入れてと言ってきます。
URLを入れて「挿入」ボタンを押してみます。
プラグインを使ってブログカードを表示してみた
サイトをみると（外部リンク）ではこんな状態
投稿画面（内部リンク）ではこんな状態
「リンクカードを挿入」した状態
URLがタグに囲まれているのが分かります。これを表示してみると・・・
やった〜！ブログカードが表示されています。見え方のデザインもカスタマイズできるそうです。
スマホでも無事表示されています。
こちらのプラグインは、定期的にアップデートされているため安心です。
作者さんの公式サイトはこちら
function.phpとstyle.cssにてブログカードを作成
こちらのサイトでは、function.phpとstyle.cssを変更して、ブログカードを自作する方法が書かれています。
プラグインが嫌だなぁという方は、是非こちらのサイトを参考に設置してみてください。
