サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL:
相談内容:
不具合の発生手順:
解決のために試したこと:
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え(FAQ)
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw)
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2020年4月30日 20:02
Topic starter
2020年4月30日 20:51
- 返信ありがとうございます。
- 高速化無効になっていないでしょうか?コクーンで、高速化のチエックは全て外したのですが、再度確認してみます。
- 環境は、iPhonexr ios13
- huawei p30lite android10
になります。
よろしくお願い致します。
2020年4月30日 21:00
よろしければ一度現在使用しているスキンを外して「スキンなし」にした状態のスクリーンショットもいただいてよろしいでしょうか。
2020年4月30日 21:00
@松岡 さん
どうやら、スキンの不具合っぽいですね。
わいひらさんもこのトピックは、ご覧になっているはずですので、修正くださるかと思います。
松岡さんは、FTPソフトは、使えますか?
2020年4月30日 21:01
ありぁ、わいひらさんとかぶった。 ?
環境情報は、要らないっぽいですね。
Topic starter
2020年4月30日 21:35
環境情報になります。
一応つけさせてください。
----------------------------------------------
サイト名:なごやぷろも
サイトURL: https://nagoya.promo
ホームURL: https://nagoya.promo
コンテンツURL:/wp-content
インクルードURL:/wp-includes/
テンプレートURL:/wp-content/themes/cocoon-master
スタイルシートURL:/wp-content/themes/cocoon-child-master
子テーマスタイル:/wp-content/themes/cocoon-child-master/style.css
WordPressバージョン:5.4.1
PHPバージョン:7.3.17
ブラウザ:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/81.0.4044.129 Safari/537.36
サーバーソフト:Apache
サーバープロトコル:HTTP/1.1
エンコーディング:gzip, deflate, br
言語:ja,en-US;q=0.9,en;q=0.8
----------------------------------------------
テーマ名:Cocoon
バージョン:2.1.4.1
カテゴリ数:1
タグ数:0
ユーザー数:1
----------------------------------------------
子テーマ名:Cocoon Child
バージョン:1.1.1
style.cssサイズ:4190バイト
functions.phpサイズ:335バイト
----------------------------------------------
Gutenberg:1
AMP:0
PWA:0
Font Awesome:5
Auto Post Thumbnail:0
Retina:0
ホームイメージ:
----------------------------------------------
ブラウザキャッシュ有効化:0
HTML縮小化:0
CSS縮小化:0
JavaScript縮小化:0
Lazy Load:0
WEBフォントLazy Load:0
----------------------------------------------
利用中のプラグイン:
Contact Form 7 5.1.7
Google XML Sitemaps 4.1.0
Jetpack by WordPress.com 8.4.2
SSL Insecure Content Fixer 2.7.2
----------------------------------------------
2020年4月30日 21:36
@松岡 さん
たぶん、わいひらさんは、スキンが原因かどうか切り分けたかったのだと思います。
もう少し、お待ちください。
あら、環境情報をすみません。
何かあったときは、これがあると、解決への近道になることが多いんです。
わいひら reacted
Topic starter
2020年4月30日 21:44
いえ、環境情報、中身までしっかり確認していませんでした。
教えて頂く立場なのに、ズルしてしまいました。
今後は気をつけたいと思います。
2020年4月30日 22:18
@松岡 さん
スキンの不具合であれば、わいひらさんが、修正したファイルをGithabにアップしてくださり、それを松岡さんがダウンロードして、FTPソフトで、アップロードする、という流れになろうかと思います。
このトピックに連絡くださると思うので、それまで、お待ちください。(明日あたりかな・・)
環境情報の案内については、初めての方には、わかりづいらいのかなと、私も最近感じているところです。
2020年5月1日 19:23
環境情報にスキン情報がないので確認させてください。
使用していたスキンはMomoonであっていますか?よろしければ使用していた色も教えていただければと思います。
Topic starter
2020年5月1日 19:56
はい、Momoonで合っています。
Momoon(オレンジ)になります。
よろしくお願いいたします。
2020年5月1日 20:35
Momoonスキンの不具合と思われるところを削除してみました。
よろしければ以下のファイルでアップデートして試してみてください。
------------------------------------------------
https://github.com/yhira/cocoon
最新ファイルをダウンロードする場合は、上記ページのダウンロードボタンからzipファイルをダウンロードしてください。
FTPでのアップデート方法はこちら。
https://wp-cocoon.com/ftp-update/
------------------------------------------------
Topic starter
2020年5月1日 21:57
有難うございます。
先ほど、FTPで更新したら無事に問題が解決されました。
助かりました。
2020年5月1日 22:07
@松岡 さん
サイトを表示してみたのですが、私の環境では、直っていないように見えます。
わいひらさん
スキンのCSSの257行目
480px以下のメディアクエリの中です。
.entry-card-content{
padding:0;
}
下側のpaddingが0だと、スニペットと重なってしまいます。
スキンなしだと、確か、ボトムだけ1.2emじゃなかったかな?
ちょっとローカルサイトで確認してみます。
2020年5月1日 22:48
松岡さんの今の状態がスキンのデフォルトのデザインだとすると、
.entry-card-content, .related-entry-card-content {
padding-bottom: 1.2em;
}
これにしてしまうと、スニペットの5行目の頭の部分が少し残ってしまうみたい・・
.entry-card-snippet, .related-entry-card-snippet {
font-size: 0.8em;
max-height: 7.8em;
line-height: 1.3;
overflow: hidden;
}
赤字の部分も調整が要るかもしれませんね。
max-height: 7.5em;
ぐらいなのかな?
私は、Windows環境だけでしか見てないので、実際にCSSを適用してiphoneやアンドロイドで見てみないと正確なことはわからないですよね。
わいひら reacted
Topic starter
2020年5月1日 23:01
leafytreeさん
有難うございます。
今、再度確認してみたら、まだ少しおかしいですね。
明日7.5emで調整してみます。
2020年5月1日 23:06
@松岡 さん
もう、今日は遅いので、おそらく、また明日、わいひらさんが、修正くださるかと思います。
スキンは有志の方々が無償でご提供くださっているものも多いので、わいひらさん一人では、全てを完璧にCocoonに対応させるのは至難の業なのだろうと推測されます。
面倒なことにお付き合いいただいてすみません。
わいひら reacted
2020年5月2日 19:54
とりあえずスキンの.entry-card-contentも、削除しておきました。
https://github.com/yhira/cocoon
max-heightについては、スキン側の問題ではなさそうなので、今回はまだ何もしていません。
2020年5月2日 20:50
@yhira さん
理論的には、行間が1.8なら、4行表示で、
max-height: 7.2em;
5行表示なら、
max-height: 9em;
になるのでしょうか?
行間を変えたら、上下のスペースも合わせて変えた方が良いかと・・・ ?
Topic starter
2020年5月2日 22:29
>とりあえずスキンの.entry-card-contentも、削除しておきました。
FTPで更新しました。
しかしながらパソコン表示、表示、android表示でも文字が途切れてしまっています。
あとはleafytreeさんの言われる、max-heightでしょうか?
max-height: 7.2em;にしてみました。
パソコン表示、表示、android表示、途切れることなく表示されています。
とりあえず、これで解決ということになりますでしょうか?
わいひらさん、leafytreeさん、有難うございます。
リフィトリー reacted
2020年5月2日 23:03
@松岡 さん
私、個人的には、スキンの「Momoon」を使われる方、皆さんに影響することのような気がしますので、テーマ側で修正しておいた方が良いと考えます。
最近、WordPress5.4.1がリリースされたので、対応等で、わいひらさんも何かと、お忙しいのかなと、思われます。
松岡さん、ご自身で、修正のCSSを子テーマに設定することは、簡単にできるかと思いますが、そうせずとも、おそらく、テーマ側で修正くださるのではないかと私は期待しています。
あ、7.2にしてみたのですね。 ?
スマホの画面スペースを考えたら、やはり、4行ですかねぇ・・
わいひら reacted
2020年5月2日 23:36
@松岡 さん
WordPressの場合、親テーマはどんどんアップデートしていくので、親テーマのCSSを直接編集しても、アップデート時に元に戻ってしまう可能性があります。
ご自身で、対応される場合は、以下のCSSを子テーマに追記すれば、反映されるかと思います。
/*スキン(Momoon)適用時に、エントリーカード、関連記事エントリーカードのスニペットの文字スペースの高さを調整*/
.entry-card-snippet, .related-entry-card-snippet {
max-height: 7.2em;
}
バタバタとしていて、すみません。
わいひら reacted
Topic starter
2020年5月3日 10:04
leafytreeさん、有難うございます。親テーマだとそうなるのですね。
勉強になります。
早速、子テーマに追記したいと思います。
ありがとうございます。
リフィトリー reacted
2020年5月3日 19:18
「line-heightを変更すると中途半端に文字列がはみ出す問題」は、line-heightを変更してしまうと、どんな環境にでも起きる問題です。
なので、例えばスニペット部分の「上部は通常の黒色」から「下部にいくにあたって透過色」になるグラデーションなんかで目立たないようにするような対応も考えて、昨日何もしませんでした。
いろいろなサイトを見ていると、そういった表示を行っている有名サイトとかも結構あるので。
2020年5月3日 21:02
@yhira さん
何か問題が起きると、すぐ目の前の解決策ばかりを追ってしまい、書き込んでしまうので、いつもご迷惑をおかけしています。
何卒、ご容赦ください。
今回のトピックで、スキンの「Momoon」のデザインをあらためて、よく見てみると、隙間や、余白、空間、といったものを考慮してデザインされているのだな、とつくづく感心した次第です。
フォントサイズは、あまり大きくせずとも、老眼の私でも、内容を把握しやすいし、見た目の品位も高いと感じます。
作者の「タイジーWP」さんは、グラフィックデザインをやられている方なのかな?と思ったりしています。
振り返って、自分のサイトを見てみると、自分で書いたCSSは、あまりイケてないなぁ・・と。
私のサイトも「Momoon」を参考にして、少し手直ししてみようと思います。
わいひら reacted
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。
(CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。