最新の映画レビューはこちら

Cocoonのブログカードが表示されない 文字だけになる場合の対処方法

ブログ運営

WordPressテーマの中で、無料で使えて多機能な『Cocoon』を利用している人は多いと思います。このサイトも『Cocoon』を利用して作成しています。

ブログを書いている中で、「ブログカード」の機能を使ってリンクを作成するケースがあると思いますが、ブロックエディタ(ビジュアルエディタ)を利用してブログカードを作成しても、プレビュー画面ではブログカード化されず、リンクの文字しか表示されないといった経験はないでしょうか。

具体的には、こんな風にWordpressのブロックエディタ(ビジュアルエディタ)を利用して「公式サイト」のブログカードを作成すると

ブログカードを作成するとき、対象のホームページにアクセスしてURLをコピーして、ブログカード欄にペースト(貼り付け)します。
このとき、改行が含まれるケースがあるため、手作業で消去しています。

実施のホームページ(プレビュー)上では、リンク文字列しか表示されませんでした。

私がまさにこの問題に直面したので、対応方法を紹介したいと思います。

解決方法

すべてのケースに当てはまるか分かりませんが、公式フォーラムで提示されていた解決方法とは少し違っています。
システム的に、「こんなことでおかしくなるのかな?」という気はしますが、実際に正しく動作しましたのでご紹介します。

まずはビジュアルエディタ上のブログカードブロックを選択して、「…」から「HTMLとして編集」をクリックします。

HTML形式で確認すると、対象の行には<a href=”“></a>で始まるコードがきちんと記録されています。※公式フォーラムでも、この形式であれば問題ないという回答でした。

この<p><a href>の間にあるスペースが悪さをしているようでした。
何度かブログカードを作成していると、後ろの</a></p>の間にスペースが入るケースもありました。

このスペースを削除します。削除すると下の画像の通りになりますが、ほとんど変わりません。
ビジュアルエディタで見ると全く何も変わらないと思います。

そうすると、このようにきちんとブログカードの形式で表示されるようになります。

まとめ

特にまとめる要素はありませんが、「HTMLとして編集」して不要なスペースを削除すると解決します。

ぜひお試しください。

コメント

タイトルとURLをコピーしました