サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
トピックスターター 2019年10月1日 22:42
いつもお世話になっております。私のような初心者にcocoonは最高のテーマでございます。作成者様にはいくら感謝してもし切れないほど感謝しております。お時間のある時で構いませんので質問に回答をいただけたら幸いでございます。
上記サイトにてカルーセルの表示数を少なく変更した所、カルーセルとその下のカラムに隙間が生じてしまいました。この隙間を無くす方法（私の想像した解決法、カルーセルのアイキャッチ画像にタイトルを被せて表示する）についてアドバイスもしくは解決法を教授いただけないでしょうか。＊カルーセルの表示はフロントページのみです。
カルーセル表示数の変更方法について
フォーラムにて既出していた子テーマのfunctions.phpに追記する方法でslidesToShowを変更しました。
要因について
今まではカルーセルの表示数が多かくサイズが小さかった為気がつかなかった場合画像サイズが揃ってないのが原因なのかもしれません。
Regenerate Thumbnailsでサムネイルの再生成も試しましたが、上手く行きませんでした。Regenerate Thumbnails利用後もサムネイルがずれている気がします。これはRegenerate Thumbnailsの更新が止まっているからでしょうか、それとも元の画像サイズに問題があるのでしょうか。
トピックスターター 2019年10月1日 23:25
追記
特にモバイル環境だと隙間が大きくなります。可能でしたら、モバイル環境もご覧ください。
2019年10月2日 00:01
カルーセルとその下のカラムに隙間が生じてしまいました。
アイキャッチの画像サイズがバラバラだったりすれば（アイキャッチのサイズが凄く小さい記事がある場合など）
カルーセルの画像の縦pxが大きいサイズに合わせて表示された記憶があります。
対応方法としては（ローカルで試したけど）覚えてません。もしかしたらCSSだけで調整できた記憶もあるような…。
って言う、あいまいな記憶ですが、カスタマイズを無効にして、ご確認いただいて『記事のアイキャッチの画像サイズ』などチェックいただけますか。
- カルーセルで表示されているのをチェックして
- 縦サイズがピッタリとキレイにハマっている記事のアイキャッチサイズなどチェックして
- 何かオカシイ。と思う原因などあれば書き込みいただけますか。
原因がどこか分かれば、対応してくれる可能性はなくないかも知れないです！？
わいひら reacted
トピックスターター 2019年10月2日 00:50
カルーセルの画像の縦pxが大きいサイズに合わせて表示された記憶があります。
- 縦サイズがピッタリとキレイにハマっている記事のアイキャッチサイズなどチェックして
- 何かオカシイ。と思う原因などあれば書き込みいただけますか。
https://hirorepublic.com/news/152/
この記事の縦サイズがぴったりとハマっていました。おそらくこの記事に合わせて表示されているのだと思います。
アイキャッチの再生成をかけても変動がありませんでした。
トピックスターター 2019年10月2日 00:55
追記
https://hirorepublic.com/news/146/
上記記事もカルーセル縦幅にぴったりでしたが、横幅に隙間がありました。
こちらもアイキャッチの再生成をかけても変動がありませんでした。
解決方法としては、画像を置き換えて画像サイズの調整行うしかないでしょうか。
2019年10月2日 20:05
もしかしたら、Retinaディスプレイ対応を有効にしていませんか？
有効にしている場合は、通常のサムネイルサイズ（320px）の2倍（640px）のサムネイルを設定する必要があります。
例えば以下の画像は、横幅が540pxなのでサイズが足りません。
少なくとも、縦横640x360以上のサイズのアイキャッチを設定する必要があります。
その上で、Regenerate Thumbnailsでサムネイルを再生成する必要があるのではないかと思います。
2019年10月3日 10:23
もしかしたら、Retinaディスプレイ対応を有効にしていませんか？
有効にしている場合は、通常のサムネイルサイズ（320px）の2倍（640px）のサムネイルを設定する必要があります。
あり得ますね。
通常のサムネイルであれば320px未満であれば、画像は生成対象外。ってイメージです。※Retinaディスプレイ対応を有効 の場合はその半分になるかも
アイキャッチの再生成をかけても変動がありませんでした。
わいひら reacted
2019年10月3日 10:28
あとナビカードが導入直後チェックしたとき、画像のタテサイズが長すぎる画像の場合は、生成をしてもナビカードで設定した一般的な画像より、縦pxが長くなります。
同じ状況がカルーセルでもあるかも。
わかりにくいですがテスト環境で設定した様子を、探してきました。以下のようなイメージ
トピックスターター 2019年10月3日 12:19
もしかしたら、Retinaディスプレイ対応を有効にしていませんか？
有効にしている場合は、通常のサムネイルサイズ（320px）の2倍（640px）のサムネイルを設定する必要があります。
例えば以下の画像は、横幅が540pxなのでサイズが足りません。わかりにくいですがテスト環境で設定した様子を、探してきました。以下のようなイメージ
こんな画像の場合は、キレイにそろわない。ってイメージです。
Retinaディスプレイ対応有効にしておりました。縦横640x360以上の画像に変更してみます。以後はこのルールを忘れず、画像をアップロードしていこうと思います。この度はありがとうございました。
2019年10月3日 20:35
よろしければ、試してみた結果の方も書いていただけるとありがたいです。
同様の問題が起きて検索からこのトピックに訪れた方は、結果がどうかが気になると思うので。
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。