サイト内検索
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
2023年5月21日 23:46
いつもどうもありがとうございます。
本日テーマを2.6.0.1にアップデートしました。
すると、目次の見出し数字がスマホ(iPhone12)で見ると枠外に飛び出していることに気づきました。アップデート前は正常に表示されていました。また、アップデート後もPC上では正常に表示されております。
全記事そうなっているようですが、例として1記事のスマホ画像を添付します。
添付画像があるURL: https://shokuji-takuhai.com/benesse-review/
どうしたら改善しますでしょうか?
恐れ入りますが、アドバイスをよろしくお願いいたします。
----------------------------------------------
サイト名:食事宅配サービス比較おすすめランキング!!
サイトURL: https://shokuji-takuhai.com
ホームURL: https://shokuji-takuhai.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-colorful-line/style.css
WordPressバージョン:6.2.2
PHPバージョン:7.4.33
ブラウザ:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/113.0.0.0 Safari/537.36
サーバーソフト:Apache
サーバープロトコル:HTTP/1.1
言語:ja-JP,ja;q=0.9,en-US;q=0.8,en;q=0.7
----------------------------------------------
テーマ名:Cocoon
バージョン:2.6.0.1
カテゴリー数:4
タグ数:35
ユーザー数:1
----------------------------------------------
子テーマ名:Cocoon Child
バージョン:1.1.0
style.cssサイズ:827バイト
functions.phpサイズ:588バイト
----------------------------------------------
Gutenberg:1
AMP:0
PWA:0
Font Awesome:4
Auto Post Thumbnail:0
Retina:0
ホームイメージ:/wp-content/themes/cocoon-master/screenshot.jpg
----------------------------------------------
ブラウザキャッシュ有効化:1
HTML縮小化:0
CSS縮小化:0
JavaScript縮小化:0
Lazy Load:1
----------------------------------------------
利用中のプラグイン:
Akismet Anti-Spam 5.1
BackWPup 4.0.0
Category Order and Taxonomy Terms Order 1.7.5
Contact Form 7 5.7.6
Edit Author Slug 1.8.4
EWWW Image Optimizer 7.0.0
Jetpack 12.1
SiteGuard WP Plugin 1.7.5
Wordfence Security 7.9.2
WP Fastest Cache 1.1.5
WP Multibyte Patch 2.9
XML Sitemap & Google News 5.3.3
----------------------------------------------
2023年5月22日 09:49
かおり さん
こんにちは、
かおりさんのページの目次の数字がはみ出していることをiphoneで確認しました。
ただ、この目次表示は「目次」部分がセンタリングされています。
これは、通常のことで、何もカスタマイズなどはしていないのでしょうか?
(私のサイトの「目次は、全部左寄せになっています」)
カスタマイズしていないとしたら、WordPressバージョン:6.2.2 のせい?
私のサイトはまだ、6.1.3です。(Cocoonバージョン:2.6.0.1は、同じです。)
p.s.
他の人のサイト(v6.2.2 & Cocoon 2.6.0.1)で、目次のはみ出しがないサイトも確認できました。
(やはり、何かカスタマイズされているとか?)
私のサイトは、以下の様にセットしているのですが、表示は、左寄せになっています。
|
This post was modified 1年前 6回 by Yamachan11
わいひら reacted
2023年5月22日 10:28
@yamachan11 さん
ただ、この目次表示は「目次」部分がセンタリングされています。
これは、通常のことで、何もカスタマイズなどはしていないのでしょうか?
恐れ入りますが、スキン「カラフルライン」の仕様です。
何を確認したのでしょうか?
iPhoneXr、Safariで確認しましたが、目次の章番号がはみ出ます。
わいひら reacted
2023年5月22日 10:38
はい、皆さん仰るとおり、iOS系ではこの事象が発生しているのだと思います。
ただ、私の保有している環境では発生していないため、私は確認ができないという感じです。
わいひら reacted
2023年5月22日 12:59
目次の近辺のソースを少し見てみました。
気になったところは以下です。
<div id="toc" class="toc tnt-number toc-center tnt-number border-element"> <input type="checkbox" class="toc-checkbox" id="toc-checkbox-1" checked> <label class="toc-title" for="toc-checkbox-1">目次</label> <div class="toc-content"> <ol class="toc-list open"> <li><a href="#toc1" tabindex="0">ベネッセのおうちごはんは冷凍と冷蔵あり!</a></li> <li><a href="#toc2" tabindex="0">ベネッセの宅配弁当はまずい?</a></li> <li><a href="#toc3" tabindex="0">医療・介護食専門メーカーがベネッセ宅配食を製造!</a></li> <li><a href="#toc4" tabindex="0">ベネッセのおうちごはん 配達~調理まで</a></li> <li><a href="#toc5" tabindex="0">ベネッセのおうちごはん口コミ</a> <ol> <li><a href="#toc6" tabindex="0">バランス健康食「豚肉のみぞれ煮」</a></li>
以下省略
と記載されていますが、クラスの定義が見当たりません。
.toc.tnt-number の定義も、見つからない。
.tnt-number の定義も見つけることが出来ませんでした。
.tnt-number .toc-content{counter-reset:li}
.toc.tnt-number ol.toc-list{list-style:none;padding:0}
.tnt-number ol.toc-list>li::before{display:inline-block;content:counter(li,decimal);counter-increment:li;margin-right:.5em;wi
dth:20px;height:20px;line-height:20px;font-size:.8em;border-radius:10px;text-align:center}
.toc.tnt-number .toc-list ol{list-style:none}
.tnt-number ol.toc-list ol li::before{display:inline-block;content:"";width:8px;height:8px;margin:0 5px 1px 0;background:currentColor;border-radius:4px;opacity:.7}
などが、必要と思いますが、どうでしょうか?
(以前は通常に表示されていたことと、IOS系以外は通常表示は謎ですが、・・・・・・・・)
--------------------------------------------
.tnt-number-detail .toc-list{padding-left:0}
.toc.tnt-number-detail ol{list-style:none;counter-reset:toc}
.toc.tnt-number-detail ol li:before{margin-right:0px;counter-increment:toc;content:counters(toc,".")"."}
などは、定義されている様ですが、、、、
This post was modified 1年前 6回 by Yamachan11
2023年5月22日 13:39
などが、必要と思いますが、どうでしょうか?
何のCSSを抜粋したのか、分かりませんが、必要ありません。
olタグの標準マーカーは数字です。
曖昧な回答は混乱をきすので、気を付けましょう。
https://developer.mozilla.org/ja/docs/Web/HTML/Element/ol
Topic starter
2023年5月22日 16:41
Yamachan11さま、mk2さま、chu-yaさま、お忙しい中、色々ご確認くださって、どうもありがとうございます!!
Yamachan11さま
カスタマイズは何も行っておりません。
申し遅れましたが、テーマのアップデート直後にWordPressのアップデートも行いました。ですので、WordPressを最新バージョンにしたせいでこの事象が起きているのかもしれません。
mk2さま
高速化機能は無効化してございます。
先程キャッシュをクリアし、WP Fastest Cache の無効化も行いました。
chu-yaさま
詳しくお調べくださって、どうもありがとうございます。
引き続きよろしくお願いいたします。
2023年5月22日 16:52
かおりさん
高速化機能は無効化してございます。
先程キャッシュをクリアし、WP Fastest Cache の無効化も行いました。
高速化を無効化しても、ページキャッシュプラグインが有効であったため、結果的に高速化が有効な時と同じく、ソース等が縮小化されたままだったということです。
お問い合わせの際は、必ずページキャッシュプラグインのキャッシュクリアか、無効化してください。
ちなみに、現在もページキャッシュプラグインは有効のようですが、キャッシュクリアはされているようですので、確認に支障はないと思います。
(まだスマホですので、確認はできないのですが)
わいひら reacted
2023年5月22日 18:00
分かった事があり、情報共有の為、記述します。
[Cocoon設定]→[目次]→目次ナンバーの表示「数字(デフォルト)」
かと思います。
別件でスキン「カラフルライン」に問題があり。
https://wp-cocoon.com/community/postid/70721/
この対策を適用し、Safariで表示すると、目次枠内から章番号がはみ出す事なく。
※結果だけで、原因(問題発生アルゴリズム)が分からず。
わいひら reacted
Topic starter
2023年5月23日 16:45
@chu-ya さま
ご親切にお調べくださって、どうもありがとうございます。
別件でスキン「カラフルライン」に問題があり。
https://wp-cocoon.com/community/postid/70721/
こちらも拝見しました。ありがとうございます。
テーマを最新版2.6.0.3にアップデートしたのですが、私のiPhone12では、目次の数字が枠外に出る状態に変化はありません。
引き続きよろしくお願いいたします。
This post was modified 1年前 by かおり
2023年5月23日 17:00
図示するCSSを見ると、バグ対策中(公式リリース前)のソースではありません。
以下のマニュアル記載の手順に従い。
https://wp-cocoon.com/downloads/
GitHubから最新版をダウンロード願います。
https://github.com/xserver-inc/cocoon
2023年5月23日 18:14
すいません。
こちらのトピックを見逃していました。
解決されたようで良かったです。
chu-yaさんトピックを立てていただきありがとうございます。
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。
(CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。