Cocoonフォーラム

書き込みの前に以下の3点をご確認ください。
  1. 1つのトピックにつき1つの質問を書き込んでください
  2. 不具合・カスタマイズ対象ページのURLを提示高速化を無効にしてください
  3. 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります

何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。

不具合・カスタマイズ対象ページのURL:

相談内容:

不具合の発生手順:

解決のために試したこと:

※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:

※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。

環境情報の取得方法はこちら。
https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
https://wp-cocoon.com/theme-trouble/

フォーラム利用ガイドリンク

  1. フォーラムガイドライン
  2. よくある質問と答え(FAQ)
  3. サポート対象外のケース
  4. 原因不明の不具合用トラブルシューティング
  5. トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw
  6. 真っ白画面でのエラーメッセージの確認方法
  7. ブラウザ環境チェックツール

フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。

テーマ変更後、サムネイルが今までと異な...
 
共有:
通知
すべてクリア

[解決済] テーマ変更後、サムネイルが今までと異なる表示になる。

13投稿
2ユーザー
5Likes
707表示
Fuku
 Fuku
(@Fuku)
Active Member
結合: 2年前
投稿: 7
Topic starter  

お世話になっております。

サムネイルのサイズについてご質問させていただきます。

先日、別テーマ(Bird)から、cocoonにテーマを変更しました。

cocoonにテーマを変更してから、新たに記事を投稿すると、サムネイルが写真の赤丸のように、他のサムネイルと比べてズームされて表示されてしまいます。ズームせず全体が表示されるようする方法が分かれば、ご教示頂けますと幸いです。

以上、宜しくお願い致します。

サイトURL: https://fukuzukan.com/

----------------------------------------------
サイト名:20代服狂サラリーマンのファッションブログ
サイトURL: https://fukuzukan.com
ホームURL: https://fukuzukan.com
コンテンツURL:/wp-content
インクルードURL:/wp-includes/
テンプレートURL:/wp-content/themes/cocoon-master
スタイルシートURL:/wp-content/themes/cocoon-child-master
親テーマスタイル:/wp-content/themes/cocoon-master/style.css
子テーマスタイル:/wp-content/themes/cocoon-child-master/style.css
スキン:/wp-content/themes/cocoon-master/skins/skin-colors-black/style.css
WordPressバージョン:5.5.1
PHPバージョン:7.3.17
ブラウザ:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4240.111 Safari/537.36 Edg/86.0.622.51
サーバーソフト:Apache
サーバープロトコル:HTTP/1.1
エンコーディング:gzip, deflate, br
言語:ja,en;q=0.9,en-GB;q=0.8,en-US;q=0.7
----------------------------------------------
テーマ名:Cocoon
バージョン:2.2.4.5
カテゴリ数:11
タグ数:1
ユーザー数:1
----------------------------------------------
子テーマ名:Cocoon Child
バージョン:1.1.2
style.cssサイズ:4426バイト
functions.phpサイズ:2049バイト
----------------------------------------------
Gutenberg:1
AMP:0
PWA:0
Font Awesome:4
Auto Post Thumbnail:0
Retina:1
ホームイメージ:/wp-content/themes/cocoon-master/screenshot.jpg
----------------------------------------------
ブラウザキャッシュ有効化:0
HTML縮小化:0
CSS縮小化:0
JavaScript縮小化:0
Lazy Load:0
WEBフォントLazy Load:0
----------------------------------------------
利用中のプラグイン:
AddQuicktag 2.5.3
Advanced Editor Tools (previously TinyMCE Advanced) 5.5.1
All In One SEO Pack 3.6.2
Contact Form 7 5.2
Insert Headers and Footers 1.4.5
Jetpack by WordPress.com 7.4.2
Pz-LinkCard 2.3.1
Quick Adsense 2.5
Really Simple SSL 3.3.4
Regenerate Thumbnails 3.1.4
Smash Balloon Instagram Feed 2.4
Table of Contents Plus 2002
----------------------------------------------


   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 4年前
投稿: 6837
 

前略、Fuku さん

添付いただいた画像の赤丸のところが、Cocoonの標準のサムネイル画像のサイズだろうと推測します。

Cocoonのサムネイル画像は、アスペクト比を変更することができます。

 

たしか6種類ぐらいあったと思います。

 

いままでのテーマでは、サムネイル画像の上下の部分に白い余白が付いているように見受けられます。

 

サムネイル画像の再生成を行えば、サイズは、ある程度は揃えられるかと思いますが、以前のテーマのときのサムネイル画像にはならないような気がします。

 

Cocoonのサムネイル画像のアスペクト比から、どれかを選んだ後に、サムネイル画像の再生成を行うのが良いような気がします。


   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 4年前
投稿: 6837
 

Fuku さん

以前のテーマと全く同じには、できないかもですが、アスペクト比は6種類から選べます。(一部適用されない箇所もあります)

 

マニュアルでは、5種類ですが、ひとつ増えていたような気がします。

 

テーマ全体のサムネイル画像の縦横比(アスペクト比)を変更する方法

 

以下は、サムネイル画像の再生成の記事です。

 

テーマが利用しているサムネイルを再生成して最適化する方法(画像の大きさを揃える)

 

なお、再生成をおこなっても、ご希望と完全に合致するという保証はないです。(画像のサイズをある程度揃えるには、やってみるしかないのかなと・・)

This post was modified 2年前 by リフィトリー

   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 4年前
投稿: 6837
 

Fuku さん

すみません。

勘違いしていました。

赤丸のようにしたい、のですね。

それでしたら、アスペクト比は変更せず、そのまま、再生成を行うのが良いような気がします。(たまに、全部きれいに揃わない場合もあるみたいですが・・)


   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 4年前
投稿: 6837
 

Fuku さん

サイトをよく拝見したら、アイキャッチ画像に文字を含めているものが多いんですね。

 

サムネイル画像が横長だと、上下にトリミングされちゃうので、やっぱり、アスペクト比の変更も含めて、よく検討してからの方が良いかもしれません。


   
Fuku
 Fuku
(@Fuku)
Active Member
結合: 2年前
投稿: 7
Topic starter  

リフィトリー様

迅速なご対応ありがとうございます。

アスペクト比を1:1で設定してみたところ、全体が表示されるようになりました。

しかし、写真のように一覧のページだと、サムネイルがズームされたままになっています。

こちらの修正方法も、お分かりであればご教示頂けますでしょうか。


   
Fuku
 Fuku
(@Fuku)
Active Member
結合: 2年前
投稿: 7
Topic starter  

@Fuku


   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 4年前
投稿: 6837
 

@Fukuさん

私の環境では、上手く揃っているようです。

ブラウザのキャッシュをスーバーリロード等でクリアしてみるとどうでしょうか?

 


   
わいひら reacted
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 4年前
投稿: 6837
 

@Fuku さん

新着記事をもっと見る、のリンク先でしたね。

確かに、不揃いですね。

 

フォーラムの書き込みを読んでいると、やはり、再生成で、全部のサムネイル画像が揃わない、といった書き込みもたまにあるようです。(なので、その旨も書いた次第です)

投稿者:: @leafytree

(たまに、全部きれいに揃わない場合もあるみたいですが・・)

原因は?といっても、ちょっと私には、わからないです。(すみません)


   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 4年前
投稿: 6837
 

@Fuku さん

あと、以下のリンクの記事にもありますように、Cocoon設定の「インデックス」タブの設定で「大きなカード」や「タイルカード」の表示を選択している場合には、サムネイル画像のサイズは揃わないようです。

 

テーマ全体のサムネイル画像の縦横比(アスペクト比)を変更する方法

This post was modified 2年前 2回 by リフィトリー

   
わいひら reacted
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 4年前
投稿: 6837
 

@Fuku さん

今日、あらためてサイトを拝見したら、きれいに揃ってますね。

なんからの対策をされたのか、自然に揃った?のか・・?

 


   
わいひら reacted
Fuku
 Fuku
(@Fuku)
Active Member
結合: 2年前
投稿: 7
Topic starter  

@leafytree様

返信遅れて申し訳ありませんでした。

そうなんです。特に対策等はしていませんが、キレイに揃うようになりました。

原因や対策方法は不明ですが、無事に解決できて良かったです。

アスペクト比のご教示ありがとうございました!


   
リフィトリー
(@leafytree)
Illustrious Member Moderator
結合: 4年前
投稿: 6837
 

@Fuku さん

投稿者:: @Fuku

特に対策等はしていませんが、キレイに揃うようになりました。

そうなんですね・・

インデックスページってキャッシュのようなものを読み込んでいるんだろうか・・?

 

ともあれ、きれいに揃ってよかったです。


   
わいひら reacted
共有:

問題の解決に至った場合には、トピック冒頭の「解決済み」リンクをクリックしていただけますと幸いです。

wpForoの解決済みリンク

また、有用な返信があった場合は「いいね!」リンクもご活用ください。返信者の励みになります。

wpForoのいいねリンク

「いいね!」機能はフォーラム登録者のみが利用できる機能です。

CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。

フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。

最近の書き込みはこちら。

詳細なカスタマイズ依頼をするならこちら。