サイト内検索
Cocoonフォーラム
![](https://wp-cocoon.com/wp-content/themes/cocoon-master/screenshot.jpg)
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL:
相談内容:
不具合の発生手順:
解決のために試したこと:
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え(FAQ)
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw)
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2021年3月29日 11:07
はじめまして。cocoonを愛用させていただいております。機械音痴の私でもどうにか記事を書くまでたどり着き、良きものを作ってくださったわいひら様に感謝申し上げます。
本当にありがとうございます。
さてさて、問題について一週間ほど試行錯誤してみましたが、私には解決できそうにないのでお力を借りたくメールさせていただきました(/ _ ; )
早速ではございますが、今回の問い合わせ内容です。
Q.インデックスカードの画像で「縦長の画像」を表示させたい。(添付画像あり)
アイキャッチ画像設定できちんと縦長画像は思い通り表示されているのですが、インデックスカード画像では縦長画像全体が表示されず切れてるので見かけが悪くて困っています。一つだけ縦長画像の表示に成功したのですがどうやったのか自分でも覚えていません(苦笑)
もしも、インデックスカード画像で縦長画像表示ができるのであれば、教えていただきたく思います。
以下に、私の分かる範囲で情報を記しておきます。
・WordPress5.7(Cocoon Child)
・サーバー:ConoHa wing
・サイト:kotodama824.com
・Cocoon設定:インデックス→一覧(デフォルト)
カードタイプ→大きなカード(先頭のみ)画像→アイキャッチの表示は「本文上にアイキャッチを表示する」にチェック
サムネイル画像→約5:7の白銀比にチェック
・設定:メディア設定→サムネイルのサイズ 幅300高さ0「サムネイルを実寸法にトリミングする」にチェック、中サイズ 幅の上限500高さの上限0、大サイズ 幅の上限800高さの上限0
・基本的にiPhoneで撮った画像を「TinyPNG」というサイトで圧縮して自分のサイトで使用。
・パソコンは、Mac Book Air M1チップを使用。
急ぎませんので、ご都合のよい時にご返信いただけましたら幸いでございます。
どうぞよろしくお願い申し上げます。
2021年3月29日 11:29
前略、みりん さん
ブログのトップページに並んでいるカードをCocoonでは、「エントリーカード」と呼んでいます。
この「エントリーカード」のサムネイル画像をトリミングなしで表示させるには、Cocoon設定の「インデックス」タブの「カードタイプ」の
・タイルカード2列
・タイルカード3列
のどちらかを選択して「変更をまとめて保存」のボタンで確定すれば、サムネイル画像がトリミングされずに表示されるかと思います。
サイトバーの新着記事ウィジェットや、人気記事ウィジェットは、トリミングされてしまう仕様だったような気がします。
This post was modified 3年前 by リフィトリー
わいひら reacted
2021年3月29日 11:35
みりん さん
あと、これは、別件ですが、ConoHa WING で提供されている Cocoonのテーマのフォルダ名が、標準のフォルダ名と異なっていることが原因で、Cocoonの親テーマをアップデートできない方が多くいらっしゃるようで、みりん さんも、そのお一人のようです。
現在、Cocoonの親テーマの最新バージョンは、2.2.8.5 ぐらいかと思います。
以下の過去のトピックで、わいひらさんが解決方法をご案内くださっていますので、お読みになってみてください。
※[解決済] 親テーマ更新後、2つの親テーマがあります。
https://wp-cocoon.com/community/postid/40603/
わいひら reacted
2021年3月29日 11:38
みりんさん
Cocoonでは、どのような環境でCocoonを使っているのかという環境情報を簡単に取得することができるようになっています。
環境情報を貼り付けていただきますと、アドバイスをいただきやすくなるかもしれません。
環境情報の取得方法
2021年3月29日 11:59
みりんさん
いまのところ、デフォルトのエントリーカードのカタチで、サムネイル画像がトリミングされないようにする機能はないみたいです。
画像がトリミングされない場合、エントリーカードの高さがバラバラになり、揃わなくなるため、やや雑然とした感じになってしまいます。
そのため、サムネイル画像のサイズがアスペクト比も同じになるように工夫されているようです。
タイルカード2列であれば、画像がトリミングされない仕様だっと思うので、サムネイル画像もアイキャッチ画像全体が表示されるかと思います。
ただ、左右のカードの高さは揃わなくなります。(これは仕方ないかもしれません)
This post was modified 3年前 by リフィトリー
Topic starter
2021年3月29日 12:29
@leafytree様
こんにちは、リフィトリー様☆
はじまして、みりんと申します。
お忙しい中、早々に返信いただき本当にありがとうございます。
リフィトリー様のご厚意に感謝申し上げますm(_ _)m
ブログのトップページに並んでいるカードをCocoonでは、「エントリーカード」と呼ぶのですね!!勉強になります、教えていただきありがとうございます。
リフィトリー様に教えていただいたとおり、すぐにCocoon設定の「インデックス」タブの「カードタイプ」の「タイル2列」を選択し表示を確認したところ…確かに縦長画像が表示されました。
ありがとうございます!!!
ただ、ごちゃごちゃしていて見づらくなってしまったので「大きなカード(先頭のみ)」に戻しました。せっかく教えていただいたのにすみません(T_T)涙
やっぱり、「大きなカード(先頭のみ)」のまま縦長画像表示することは難しいんですよね?
無理なら、綺麗サッパリ諦めます!!
↓私の環境情報です↓
サイト名:命名言魂円(めいめいことだま)
サイトURL: https://kotodama824.com
ホームURL: https://kotodama824.com
コンテンツURL:/wp-content
インクルードURL:/wp-includes/
テンプレートURL:/wp-content/themes/cocoon
スタイルシートURL:/wp-content/themes/cocoon-child
親テーマスタイル:/wp-content/themes/cocoon/style.css
子テーマスタイル:/wp-content/themes/cocoon-child/style.css
スキン:/wp-content/themes/cocoon/skins/m-sora/style.css
WordPressバージョン:5.7
PHPバージョン:7.4.14
ブラウザ:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Safari/605.1.15
サーバーソフト:Apache
サーバープロトコル:HTTP/1.1
エンコーディング:gzip, deflate, br
言語:ja-jp
----------------------------------------------
テーマ名:Cocoon
バージョン:2.2.5.1
カテゴリ数:11
タグ数:0
ユーザー数:1
----------------------------------------------
子テーマ名:Cocoon Child
バージョン:1.1.2
style.cssサイズ:838バイト
functions.phpサイズ:203バイト
----------------------------------------------
Gutenberg:1
AMP:0
PWA:0
Font Awesome:4
Auto Post Thumbnail:0
Retina:0
ホームイメージ:/wp-content/uploads/2021/02/-e1614301318210.jpg
----------------------------------------------
ブラウザキャッシュ有効化:0
HTML縮小化:0
CSS縮小化:0
JavaScript縮小化:0
Lazy Load:0
WEBフォントLazy Load:0
----------------------------------------------
利用中のプラグイン:
BackWPup 3.8.0
Broken Link Checker 1.11.15
ConoHa WING コントロールパネルプラグイン 1.0
ConoHa WING 自動キャッシュクリア 1.0.0
EWWW Image Optimizer 6.0.3
Formzu WP 1.6.2
Google XML Sitemaps 4.1.1
Invisible reCaptcha 1.2.3
Post Type Switcher 3.2.0
Two Factor 0.7.0
WebSub/PubSubHubbub 3.0.3
WP Multibyte Patch 2.9
Yoast Duplicate Post 4.1.2
上記の環境情報内を確認したら、リフィトリー様のご指摘してくれたとおりCocoonの親テーマのバージョン2.2.5.1となっており古いようです。ご指摘ありがとうございます。
やっぱり、親テーマをアップデートしたほうがいいですよね?「親テーマ」をアップデートしても「子テーマ」は消えたりしないですよね?
こんな簡単なこともわからなくてすみません、私ちょーアナログ人間で機械音痴なもので…(T_T)
リフィトリー様が教えてくださったページを参考に頑張って「親テーマ」のアップデートを試みます!!
いろいろ教えていただき本当にありがとうございます。
感謝。
2021年3月29日 12:47
みりんさん
ただ、ごちゃごちゃしていて見づらくなってしまったので「大きなカード(先頭のみ)」に戻しました。せっかく教えていただいたのにすみません(T_T)涙
あとは、撮影するときに、横向きで撮影して、サムネイル画像に上手く収まるように画像ソフトなどで丁寧にトリミングするのが良いかと思います。
サムネイル画像のアスペクト比を考慮して、作品が上手くサムネイル画像に収まるように工夫してみてください。
やっぱり、親テーマをアップデートしたほうがいいですよね?「親テーマ」をアップデートしても「子テーマ」は消えたりしないですよね?
Cocoonの親テーマのアップデートは、通常ならダッシュボードの「更新」のところに表示され、チェックを入れて「更新」ボタンをクリックするだけで良いはずなのですが、ConoHaのCocoonはフォルダ名が変更されているため、アップデートが出来ない状態になっていると推測されます。
WordPressの方だけをアップデートしていくと、古いCocoonの親テーマでは、対応できない事柄が発生してくるので、ずっとアップデートしない訳にはいかないようです。
わいひらさんがご案内くださった方法ですと、いままでフォーラムにお問い合わせのあった方は上手くいっているようです。
お一方だけ、ちょっと、タイムラグがあって、すぐに反映されなかった方がいらっしゃいましたが、他の方は上手くいっていた様子です。
わいひら reacted
2021年3月29日 12:56
みりんさん
親テーマのアップデートの件ですが、みりんさんのサーバーには、まだ、ConoHaの方の親テーマしか見当たらないようです。
わいひらさんがご案内くださった方法は、ダッシュボードの「テーマ」のところに親テーマが2つある状態になってから、作業をなさってください。
おそらく、ダッシュボードの「更新」のところに、Cocoonの親テーマが表示されているのではないかと思われます。
ConoHaの方の親テーマしかない状態で、わいひらさんがご案内くださっている方法を行ってしまうと、サイトが表示されなくなるか、別のテーマに変わってしまうか、というようなことになってしまう可能性があります。
必ず、親テーマが2つある状態にしてから、作業してください。
わいひら reacted
Topic starter
2021年3月29日 12:59
何度も書き込みをしていただきありがとうございます。
私なんかのために何度も時間をさいてくださり拝謝申し上げます(T_T)
↓リフィトリー様からの返信↓
いまのところ、デフォルトのエントリーカードのカタチで、サムネイル画像がトリミングされないようにする機能はないみたいです。
→そうなんですね!!!了解いたしました。無料でCocoonを使わせていただけるだけでもとてもありがたいので、このまま使い続けます!記事内容重視で、元の画像をどうにかできないかいろいろ試してみます☆リフィトリー様にはたくさん教えていただき勉強になりました、本当に助かりました。ご教授賜り感謝申し上げますm(_ _)m
これから、とりあえず「親テーマ」のアップデートに挑戦します!!
季節の変わり目で体調崩しやすいと思いますが、どうかお体お大事に元気で笑顔の毎日をお過ごしになることを心より願っております。
リフィトリー様と良きご縁で繋がれたことに感謝です!!
いろいろありがとうございました。感謝。
Topic starter
2021年3月29日 13:06
@leafytree様
ありがとうございます。
↓リフィトリー様からの返信↓
わいひらさんがご案内くださった方法は、ダッシュボードの「テーマ」のところに親テーマが2つある状態になってから、作業をなさってください。
おそらく、ダッシュボードの「更新」のところに、Cocoonの親テーマが表示されているのではないかと思われます。
ConoHaの方の親テーマしかない状態で、わいひらさんがご案内くださっている方法を行ってしまうと、サイトが表示されなくなるか、別のテーマに変わってしまうか、というようなことになってしまう可能性があります。
必ず、親テーマが2つある状態にしてから、作業してください。
→はい、わかりました!!!なんだか、このままではまずいということは理解しました…汗
近日中に親テーマの問題を解決します!!!ご指摘いただき感謝です☆頑張ります!!
Topic starter
2021年3月29日 14:03
@leafytree様
リフィトリー様、ありがとうございます♡
早速、親テーマをアップデートすべく参考の通り恐る恐る、外観「テーマを編集」9列目のtemplate:cocoon-master
とし、ファイルを更新しました。
添付画像通りで大丈夫ですよ?!
機械音痴でパソコンに詳しくないので、何をするにも最後の更新ボタンを押すのに勇気が入ります笑
2021年3月29日 15:21
みりんさん
ちょっと外出してしまっているので、詳細は確認できませんが、やり方は、合っているように見えてます。
ダッシュボードのテーマのところに親テーマは2つありますか?
Topic starter
2021年3月29日 16:26
2021年3月29日 16:34
みりんさん
以下のトピックの みんみんさん は、バージョンが古い方の親テーマを削除したら、事態が変わったようです。
[解決済] 投稿編集画面がおかしくなりました。
https://wp-cocoon.com/community/postid/46731/
どちらの親テーマが古いものかわかりますか?(私はConoHaではないので経験がないのです。マウスポインタを乗せたときに何か表示されますか?)
また、古い方がわかる場合は、削除ができそうですか?
This post was modified 3年前 2回 by リフィトリー
わいひら reacted
Topic starter
2021年3月29日 20:16
@leafytree様
ご返信ありがとうございます。
リフィトリー様が詳しく教えてくださったので無事に古いバージョンがわかりました☆
結果報告
★Cocoon新バージョンアップにたぶん成功したようです!!!☆
サイト名:命名言魂円(めいめいことだま)
サイトURL: https://kotodama824.com
ホームURL: https://kotodama824.com
コンテンツURL:/wp-content
インクルードURL:/wp-includes/
テンプレートURL:/wp-content/themes/cocoon-master
スタイルシートURL:/wp-content/themes/cocoon-child
親テーマスタイル:/wp-content/themes/cocoon-master/style.css
子テーマスタイル:/wp-content/themes/cocoon-child/style.css
スキン:/wp-content/themes/cocoon-master/skins/m-sora/style.css
WordPressバージョン:5.7
PHPバージョン:7.4.14
ブラウザ:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.0.3 Safari/605.1.15
サーバーソフト:Apache
サーバープロトコル:HTTP/1.1
エンコーディング:gzip, deflate, br
言語:ja-jp
----------------------------------------------
テーマ名:Cocoon
バージョン:2.2.8.5
カテゴリ数:11
タグ数:0
ユーザー数:1
----------------------------------------------
子テーマ名:Cocoon Child
バージョン:1.1.2
style.cssサイズ:845バイト
functions.phpサイズ:203バイト
----------------------------------------------
Gutenberg:1
AMP:0
PWA:0
Font Awesome:4
Auto Post Thumbnail:0
Retina:0
ホームイメージ:/wp-content/uploads/2021/02/-e1614301318210.jpg
----------------------------------------------
ブラウザキャッシュ有効化:0
HTML縮小化:0
CSS縮小化:0
JavaScript縮小化:0
Lazy Load:0
WEBフォントLazy Load:0
----------------------------------------------
利用中のプラグイン:
BackWPup 3.8.0
Broken Link Checker 1.11.15
ConoHa WING コントロールパネルプラグイン 1.0
ConoHa WING 自動キャッシュクリア 1.0.0
EWWW Image Optimizer 6.0.3
Formzu WP 1.6.2
Google XML Sitemaps 4.1.1
Invisible reCaptcha 1.2.3
Post Type Switcher 3.2.0
Two Factor 0.7.0
WebSub/PubSubHubbub 3.0.3
WP Multibyte Patch 2.9
Yoast Duplicate Post 4.1.2
経緯報告
1.リフィトリー様よりCocoon「親テーマ」が古いことを教えていただき、「親テーマ」アップデートに着手
2.ダッシュボードの「更新」より新バージョ2.2.8.5を更新
3.外観→テーマにCocoonChildと2つ「親テーマ」が並んでいるのを確認。
4.外観→テーマエディターを選択→9列目のTemplate: cocoonをTemplate: cocoon-masterへ変更保存。(変更ボタンを押す勇気が必要でした笑)
5.念の為、私が使用しているプラグインの「BackWPup」でバックアップをとっていることを確認。(すべては自己責任なのでなんかあったときの保険)
6.外観→テーマ→2つある「親テーマ」がどちらが新バージョンか確認するため「テーマ詳細」をクリック→それぞれ右上にバージョンが記載されているのを確認→確認後「古いバージョンの親テーマ」を削除(ここでまた勇気を必要としました笑笑)
7.言われていたとおりサイトが真っ白になる(肝っ玉小さい私はやっぱり焦りました汗)
8.1分くらい待ってもサイトが真っ白のまま(ちょー焦る汗)
9.このままでは新バージョンに移行できてないと野生の勘が働き、一度、外観→テーマを「Cocoon親テーマ」を有効にしてサイトを確認
10.サイトの復活を確認(やれば出来る子!!と自分を褒めてあげました笑)
11.外観→テーマ「CocoonChild」に有効を戻す
12.サイト表示確認→スキンが変わっていたので元に戻して保存
13.環境情報で「バージョン」を確認→新バージョンに書き換わってるぅぅl!(アナログ人間、機械音痴の私でもできました)
14.完了…のはず
リフィトリー様のお蔭様様です!!
なんとお礼を申し上げていいのやら…どこの馬の骨ともわからない私に親切丁寧に教えていただき本当に有難く思います(T_T)
本当に本当にありがとうございました(T_T)(T_T)
Topic starter
2021年3月29日 22:25
@leafytree様
いろいろ教えていただき本当にありがとうございます。
上手くいったのは、リフィトリー様のお蔭です☆
サイトを立ち上げて間もないうちに知れてよかったです!!
記事をたくさん書いたあとだったら、ボタン一つ押すのももっと勇気を必要として心臓がいくつあっても足りないと思います笑
ボタン一つ押すのも躊躇してしまうお年頃なもので笑笑
私みたいに機械音痴のちょード素人で迷い悩んでいる人、たくさんいると思います。
そんな手探りの中でリフィトリー様は「光」のような存在です٩(♡ε♡ )۶☆
相談してよかったです。
良きご縁に感謝です!!!
お忙しい、本当にご教示いただきありがとうございました。感謝。
2021年3月29日 23:19
みりんさん
力強い作品ですね!
なんだか じんわりと来ます。
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。
(CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。