私はこのサイトをワードプレスを使って悪戦苦闘しつつ作っています。最近は、はてなブログのようなブログカード表示に憧れていました。するとワードプレスのバージョンが上がって「ワードプレスでもブログカードを出せるようになった」と判り、当然のごとくURLリンクを記入して投稿してみました。しかしブログカードは表示されませんでした。その後、色々調べてわかったのですが、原因はプラグイン「Custom Permalinks」でした。今日はその原因と対策、結果です。（2016年の情報です。）
まずは「ブログカードが表示されない」で検索
見栄えがいいブログカード。wordpressで使えるようになったと知って喜んで記述しました。しかしURLを直に書いても表示されないため、必死にグーグル先生を頼って検索しました。そして見つけた理由は二つあり、それぞれ解決策がありました。
テンプレート固有の問題
ワードプレスのデザインはテンプレートによってコントロールします。そんな私が使っているテンプレートは「stinger5」だったのですが、このテンプレート固有の問題かもしれないと答えを出された方がいました。そのサイトがこちらです。
考えるオヤジ様の「WordPress4.4にてブログカードが正しく表示されない時の対処法 #stinger5 」
テンプレートの仕様でそういう問題が発生する事もあるんですね。勉強になりました。こちらのページには詳しい原因と対処法が書いてありました。何でも「iframe」タグが問題だったそうで、function.phpファイルを書き換え、CSSファイルに追加文章を書き入れるだけ。当然私は飛びついて実行しました。が、当サイトではブログカードは表示されず・・・涙目でした。
Custom Permalinksが犯人
あきらめきれない私は更に対策を探し求めました。するとシンプルで美しいwordpressの無料のテンプレート「simplicity」さんのフォーラムの中にその原因と対策を見つけました。
原因が分かりました。
プラグイン「Custom Permalinks」が原因のようでした。中略
下書き時に最初から公開用のパーマリンクを設定することで回避出来るようです。
当方のパーマリンクとプラグイン設定に問題があるのかも知れません。ブログカードが表示されない。
フォーラムを覗くと詳しく書かれているのでどうぞ移動してご覧下さい。
https://wp-simplicity.com/suport/topic/%E3%83%96%E3%83%AD%E3%82%B0%E3%82%AB%E3%83%BC%E3%83%89%E3%81%8C%E8%A1%A8%E7%A4%BA%E3%81%95%E3%82%8C%E3%81%AA%E3%81%84/
判りやすいURLにするために当サイトでも「Custom Permalinks」という指定したURLを使えるプラグインを使用しています。なるほど納得の原因でした。
現に、プラグインを導入する前の古い記事のURLを記載してみたらブログカードが表示されたので、明らかに「Custom Permalinks」が原因なのでしょう。ちなみにフォーラム内の説明を簡単にすると、「Custom Permalinks」で変更する前の元のURLを張ればちゃんとブログカードになりますよ、との事です。
で、今回、「simplicity」のシンプルさに引かれてテンプレートを変更しちゃいましたw素人の私には驚くほどの親切設計。wordpress知識の足りない私にぴったりです。
というわけで、暫くこのテンプレートを使ってみようと思います。と言いつつ、今回「stinger7」や「affinger」も見つけたんですよね。そっちも気になっています。どうしようかなあ。
解決方法
＊この情報は古いので、表示のされ方がいろいろと変わっています。というか、「Custom Permalinks」で指定したURLを書けばちゃんとブログカードになっています。なのですぐ下にある追記した部分をお読み下さい。＊
さて、フォーラム内に書かれていた通り、URLをプラグインで変更する前のものにしてテストページに記載しました。するとちゃんと表示されました。良かったー！試しにダメな書き方と大丈夫だった書き方を記載しておきますね。
そうそう元のURLとは、wordpressインストール時に設定したパーマリンクに基づいて作られるURLの事です。（例）「http://○○.com/ここから付けられる部分」で、日付にしているのか、カテゴリーにしているのか、皆様の設定通りに当てはめたものになります。
ではまず、元々のURLで記載したとき。当サイトはカテゴリと数字でパーマリンク設定していたのでその通りに記載しました。URLは「https://www.select-japan.com/news/20585.html」です。割り当てられた数字は個別記事に表示されてるスラッグの数字になっていました。これをURLだけで記載すると・・・
巨大化しています！＞＜；
続いて、プラグイン「Custom Permalinks」で指定したURLで記載するとブログカードになりました。
＊2016/8/19 修正します＊
どのバージョンのワードプレスなのかはわかりませんが、元のURLでも↑のようにブログカードが表示されるようになりました。ただしアイコン表示位置が左右が逆になっています。使っているテンプレートによっては表示が微妙に違うなどの症状があるようです。
wordpressのバージョンアップとともに解決した問題と別の問題
別記事へのコメントでこの記事に触れていただいたおかげで、ブログカード表示問題がほぼ解決していたことに気がつきました。（遅すぎですが）しかし「Custom Permalinks」を使う前のURLが巨大化するようになりました。
ブログカードが巨大化する（巨大化しなくなった）
まずワードプレスがバージョンアップされたおかげで、「Custom Permalinks」で設定する前の古いURLで記載してもちゃんと表示されるようになっていました。（前述の通り、どのバージョンからなのかは不明です。）
2017/5/8追記
久々に古い記事のチェックをしてみたら、変更前のURLではブログカードが巨大化している事に気がつきました。ぐぬぬ。なので、変更前のURLを使っても通常のブログカードになるようにする方法を記載しておきます。
まず、「Custom Permalinks」で設定したURLをそのまま記載した場合。
投稿には↓のようにURLを直接記載しただけです。
https://www.select-japan.com/news/korean-fertilizer.html
ご覧の通り、アイコンは右側で当サイトのファビコンが表示され、ちゃんとブログカードになっています。
しかし変更前の元のURLを張ったとき、全く違う表示になっちゃいました。張ったURLはこちら。
https://www.select-japan.com/news/21969.html
ご覧の通り、当サイトのファビコンではなくワードプレスマークになり、記事の表示方法もまるっと違います。引用まで出ちゃって、アイコンも巨大です。なぜこうなるのかはまだ原因不明です。でもリンクタグとして記載すれば回避できます。
<a href="https://www.select-japan.com/news/21969.html">https://www.select-japan.com/news/21969.html</a>
↑のようにリンクタグで記載するとご覧の通り、ブログカードとして表示されました。ブログカードの表示がおかしい方はこれで回避してみてください。
でもワードプレスのバージョンアップや使用しているテンプレートによって発生している可能性があるので、これもいずれ解決する問題だろうなとも思います。表示がおかしい間は、私はこの方法で乗り切りたいと思います。
追記
どの方法で記述してもちゃんとブログカードになっています。問題はオールクリアしたようです。
最後にひとこと
色々ありましたが、憧れのブログカードを表示できるようになり、ご満悦です。でもURLを張る時にいちいち元のURLを調べないといけないのは非常に面倒です。プラグイン「Custom Permalinks」は非常に有用なプラグインだけにこの問題に対処して改良されないかな〜って願っちゃいます。どうしてもいちいち調べるのが嫌なら、今後はもう自動生成されるURLに統一してURLのカスタマイズをやめてしまうしかないですね。でも判りやすいURLが好きなんだけどな。うーん悩ましい。
2016/8/19 追記
こういうカスタマイズネタって時々見返さないと内容が全く通用しなくなってるんですね（冷汗）いつの間にか「Custom Permalinks」を使ったURLでもちゃんと表示されるようになっていました。これからはこの手の記事は時々チェックして気をつけるようにしたいと思います。何はともあれ、ブログカード表示が解決してよかったです。
2017/5/8 追記
久々に記事を見てみたら、変更前のURLではブログカードが巨大化していました（汗）去年見た時は普通サイズだったのに〜！でも古いURLでもリンクタグにして記述すれば通常サイズのブログカードとして記載されていますので、どうしてもブログカードが巨大化してしまう方はリンクタグで記述してみてくださいませ。
