Cocoon(コクーン)「おすすめカード」で記事をわかりやすく分類
ブログを書いている方で、コクーン(Cocoon)を使われている方、お困りのことはありませんか?
わたしは約1カ月前からcocoonを使い始めました。
非常に多機能でこれが無料とは思えない機能です。加えて、わからないことがあれば、ネットで調べると解説の記事や動画がたくさん出てきます。
ただ、正直、レベルの高い内容はよくわからないものもたくさんあります。
そんなレベルの私の最近のつまづきと解消法について、解決できたのでご報告します。
初心者の方、ブログをはじめたばかりの方で同じ失敗をして、「おすすめカード」の設定をあきらめる方もおられるのではないかと思い紹介します。
cocoonの「おすすめカード」の設定をして、ブログの一番上の部分に、カテゴリーボタンを設定したいと思ったんです。下の画像の赤の点線の中のことです。
おすすめカードを使うメリット
比較的簡単な操作で設定できメリットはいろいろあります。
- 初心者のブログがなんとく立派に見えます。
- 記事の分類ができて、興味のある記事にアクセスしやすくなります。
- スマホで記事のカテゴリー検索をしようと思っても、スマホで、ブログのメニューを開く操作がわからない人も多い。(自分自身がそうでした・・)カードならこれなら操作がわかる。
- Googleアドセンスの広告でメニューが選択しにくいことがあるが、「おすすめカード」を設定することで、ある程度は解消される。
広告の設定方法があるようですが、もう少し勉強してから見やすい位置に変更する予定です。
(参考)おすすめカードの作り方 リンク先でのご紹介
Cocoonの操作については、「JIMMAN BLOG」、「ヒトデブログ」さんに教えていただきました。
ていねいでとても、わかりやすいです。
特にヒトデブログさんには、YouTubeやブログでいつも色々なことを教えてもらっています。感謝です。


トラブル「おすすめカード」のアイキャッチ画像が設定できない
順調に設定ができたはずですが、どうしたことか、私の場合、「おすすめカード」のアイキャッチ画像が設定ができないのです。(下の画像は設定ができた状態(OKの状態)です。)
トラブルの内容
- 赤字の点線内でアイキャッチに使いたい画像を選択するのですが、いくら選択をしても、下の図のように画像が表示されない。選択をクリックしても「無反応」で何も起こらない。
ブログ記事のアイキャッチ画像は何のトラブルなく表示されていました。 - 「無反応」な状態で、画面一番下の「更新」ボタンを押して、メニューを閉じてブログを確認すると、パソコンから、アイキャッチ画像の表示ができない状態でした。
スマホやIPADからは、表示されたりされなかったり、超不安な状態になる。 - 大部分の環境で、表示したい画像部分に「NO IMANGE」と表示される。
対応法としてやってみたこと(素人視点)
- 画像サイズを変更(容量)する。画像の縦横比率を変更する。
- 画像を削除して再度アップロードする。
- ブラウザを変更して、ワードプレスにログインして同じ操作をやってみる。
ネットで調べてやってみたこと
-
プラグインで使っている「EWWW Image Optimizer」 があやしいと思って、下のリンクを参考に設定を変更しました。プラグインそのものを「無効化」もしてみました。
→「効果なし」でした。、設定は元に戻しました。

トラブルの原因と解決方法 大事な「s」がない!
いろいろやりましたが、大苦戦していたところ、次のような記事を見つけました。
私のトラブルとは、内容的に少し異なる内容ものでしたが、「SSL化する前にアップロードした画像の可能性はないですか?」にヒントがありました。
大事な「S」がない?
わたしがアイキャッチ画像に使用した画像は、SSL化した後の画像でした。
しかし、Wordpressの管理画面から、WordPressアドレス(URL)、サイトアドレス(URL)を確認してみると、「S」がないままになっているのです。
考えてみると、①サーバー契約→②ワードプレスのインストール→③SSL化とすすめましたから、下の赤字の部分に「S」がない状態になっていても不思議ではありません。
わたしと同じ失敗をしている初心者の方は多いかもしれません。
この2つのURLの違いについては、次のようなイメージのようです。
- WordPressアドレス(URL): WordPressをインストールしたアドレス
- サイトアドレス(URL) : 自分のブログのWordPressにアクセスするためのアドレス
正しい表記 https://55hiace.net に変更!
この2つの部分を修正して、「https://55hiace.net」を「https://55hiace.net」に変更しました。これですべての問題は解決しました。
2つのURLのアドレスに「S」をつける変更後の状態について、
Wordpressへの再ログインを求められたくらいで、その他、変化やトラブルは今のところ、ありません。ようやくトラブル解決です。
WordPressでのブログをはじめたての方、私と同じ間違いはありませんか?Wordpressの設定部分の確認で何とかなるかもしれません。ご確認ください。
