前略、akiさん

確か、それはスキンの仕様だった気がします。

別のスキンにするか、スキンをなしにしてみてください。

@leafytree様

早速ご返信いただきまして誠に有難うございました。

ご教示いただきました通り、他のスキンに変更を行ったところ、

あっというまに問題が解決されました！！！

うれしいです＾＾アイキャッチ画像が無事に反映されましたので、

ブログ作成がより楽しくなりそうです。

大変初歩的な質問にも関わらずご対応いただき大変助かりました！

有難うございました＾＾

aki さん

Bizarre-food（ピンクワイン）アイキャッチ画像がぼやけないようにするCSSのコードを試しに書いてみました。

以下のコードを「追加CSS」にコピペすれば、Bizarre-food（ピンクワイン）でも画像がハッキリとするかもしれません。（実際のサイトでは試していないのですが・・）

.eye-catch img {
  height: auto !important;
  -webkit-filter: none;
  filter: none;
  opacity: 1;
  transform: none;
  width: auto;
}

「追加CSS」を開くには、ダッシュボードの「外観」→「カスタマイズ」→「追加CSS」と、たどると開けます。

コードをコピペしたら、すぐ上にある、「公開」ボタンをクリックして、変更を確定します。

もし、「Bizarre-food（ピンクワイン）」のスキンのデザインがやっぱりいいかも、というときは、お試しください。

@leafytree様

追記でのご教示有難うございます。

早速、もと使っていたピンクワインのスキンに変更し、

作成いただきましたCSSコードを追加してみましたところ

ぼやぼやだった画像がスッキリきれいに表示されました！！す…すごい！！

一番最初に設定していたスキン、気に入っていましたので

大変うれしいです＾＾

お忙しい中ご対応をいただきまして有難うございました＾＾

aki さん

「ホームURL」が「http」のままのようですので、「https」にされた方が良いかもしれません。

あと、プラグインの「WP Multibyte Patch」は入れておいた方が良いかもしれません。

WordPress５から無くなったWP Multibyte Patchは必須なので手動インストールしましょう

aki さん

サイトのSSL化については、わいひらさんが詳しい記事を書いています。

WordPressをhttpからhttpsにSSL化した全手順まとめ（エックスサーバー環境）

ただ、この記事はXサーバーですが、共通しているところもあるはずです。

アドレスバーのところが鍵のマークにならないときは、画像のURLがhttpのままになっている場合が多いように思います。

わいひらさんの記事に画像のURLを調べる方法が書いてあったと思います。

よくわからないときは、ロゴ画像などの画像のURLが「http」のままになっている画像を、パソコンから再アップロードするといいかもしれません。

@leafytree様

アドバイスいただきまして有難うございます！

昨日から取り掛かった初心者故、大変ありがたく感じております。

「WP Multibyte Patch」は早速入れてみます。

SSL化に関しては、私が契約しているConohaサーバーの方で有効化が設定されているのですが

ちゃんと設定ができているのかなんとも言えず＾＾；

ご教示いただきましたアドレスにて

新ためて確認をしてみようと思います！！

有難うございます＾＾

aki さん

先ほど、画像のURLを修正された？ためか、SSL化は、上手くいっているような気がします。

aki さん

そうだ、いけない、スキンの「Bizarre-food（ピンクワイン）」は、アイキャッチ画像の中に、タイトルを表示するデザインだったのを忘れていました。

これは、どうしたものか・・・

うーん・・

@leafytree様

ご確認いただきまして有難うございます！安心いたしました。

先ほどご教示いただきました「WP Multibyte Patch」は早速最適化処理を行いました。

立て続けの返信で大変申し訳ないのですが、

もう1点躓いてしまっている箇所がございまして、

良ければご教示いただけないでしょうか。

固定ページのメニュー『ホームページ』『ブログ』『プロフィール』『お問い合わせ』

のページ内で、アイキャッチ画像の中にタイトルと日付があったり、ページの中にシェアボタンなどが反映されているのですが

下記（外観→テーマエディター）の通りCSSコードを追加をいたしましたところ

『ホームページ』だけうまく反映され、他のページが反映されずで色々試していますがなかなかうまくいきません。

固定IDは固定ページ一覧のIDから確認しました。

何が間違っているのか、ご教示いただけますと幸いです。

お手数をお掛けいたしますが、お力添えいただけますと助かります。

/************************************
** 子テーマ用のスタイルを書く
************************************/
/*必要ならばここにコードを書く*/
/* トップページの「カテゴリごと」のタイトル変更 */
.list-title-in{
color: #67c5ff;/*文字の色*/
font-size: 24px;/*文字の大きさ*/
}

.list-title-in:before, .list-title-in:after {
background-color: #67c5ff;/*線の色*/
top: 40%;/*線の高さ*/
}

/* トップページのタイトル-シェアボタン-フォロー-投稿日-更新日-投稿者名削除 */
.front-top-page #main .entry-title,
.front-top-page #main .sns-share,
.front-top-page #main .sns-follow,
.front-top-page #main .date-tags,
.front-top-page #main .author-info{
display: none;
}

/* ブログのタイトル削除 */
#post-8 .entry-title,{
display: none;
｝

/* プロフィールのタイトル-シェアボタン-フォロー-投稿日-更新日-投稿者名削除 */
#post-47 .entry-title,
#post-47 .sns-share,
#post-47 .sns-follow,
#post-47 .date-tags,
#post-47 .author-info{
display: none;
}

/* 問い合わせのタイトル-シェアボタン-フォロー-投稿日-更新日-投稿者名削除 */
#post-30 .entry-title,
#post-30 .sns-share,
#post-30 .sns-follow,
#post-30 .date-tags,
#post-30 .author-info{
display: none;

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/

aki さん

タイトルや日付はとても重要なものなので、非表示にしない方が無難なんですよね。

Cocoonのスキンの中では、「Bizarre-food」はちょっとアイキャッチ画像やタイトル周りが、特殊なデザインとなっていて、カスタマイズするときは、工夫が要るんです。

でも、「Bizarre-food」は、シンプルで可愛く、人気もあるみたいです。

@leafytree様

ご意見をいただきまして有難うございます。

アイキャッチにタイトルを入れているので、タイトル、日付、いらないか！

と考えていたのですが、

元々の重要さを切り離して考えてしまっておりました。

先に返信いただいていた、アイキャッチ画像の中にタイトルが表示されてしまうという

「Bizarre-food（ピンクワイン）」のデザインですが、

可愛いですが他のに変えた方が無難なのかなと思ってきました。

また作り始めて2日目なので、他のスキンでも様子を見ながら慣れてきたら徐々に他のスキンに！

というのもありかもしれません＾＾

有難うございます！

aki さん

「Bizarre-food（ピンクワイン）」の他の部分のデザインはとても可愛くて、捨てがたいものもあるとは思います。

アイキャッチ画像とタイトル周りのBizarre-foodのスキンのCSSの指定を初期化すれば、Cocoonのデフォルトに近いレイアウトにはなってしまいますが、ちゃんとタイトルと日付を表示することも可能です。

aki さん

ちょっと、ざっと書いてみただけなので、間違っているところもあるかもしれませんが、以下のような感じで、タイトルと日付を画像の外に戻すことができそうです。

.eye-catch img {
  height: auto !important;
  -webkit-filter: none;
  filter: none;
  opacity: 1;
  transform: none;
  width: auto;
}

.article-header h1 {
  position: static;
  margin-right: 0;
  font-size: 26px;
  color: inherit;
  text-shadow: none;
}

.date-tags {
  position: static;
  color: inherit;
}

他のスキンをご利用になる選択肢も、もちろんあります。

@leafytree様

コード、ご教示いただきまして有難うございます！

画像もつけていただいて、適用後のイメージが湧きました＾＾

現在、違うスキンでの試しも行っていますが

最終的にはお気に入りのBizarre-food（ピンクワイン）を実装し使いこなせるよう

知識をつけていきたいなと思っております。

最初からあれこれ詰めてしまっていましたが、

シンプルに、慣れてきたら少しずつコンテンツ増やせればと思っております。

色々と相談ごとに対してご教示いただきまして有難うございました！

頑張ってみます！

また、不明点等ございましたらこちらのフォーラムにて、

改めてご相談をさせてください。

良いお年をお迎えくださいませ＾＾

aki さん

CSSもお使いになられるようですので、いろいろ試してみてください。

子テーマにお書きになったCSSを消し忘れないようにお気をつけください。

いま、Cocoonは、ブロックエディターの新しい仕様に対応すべく、改修中のところもあって、細かい不具合が散見されます。

いま、テストしていたら、目次の下部で枠と文字の空きが足りないのに気づきました。

テーマ作者様は怪我の後の静養中ではありますが、順次ご対応くださるものと推測します。

今年もあと僅か。

良いお年をお迎えくださいませ。