サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL：
相談内容：
不具合の発生手順：
解決のために試したこと：
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え（FAQ）
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法（推奨ツール：notepad.pw）
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
Topic starter
2018-06-09 01:10
関連記事下にあるCocoon機能のコメント欄に番号なしリストなどが反映しないので、CSSを追記せず使えるようになれば。と思います。
親テーマCSSの指定は以下の通りです。
.article dl {
margin: 1em 0;
}
.article dd {
margin-left: 40px;
}
.article ul,
.article ol {
margin: 1em 0;
padding-left: 40px;
}
.article ul li,
.article ol li {
margin: 0.2em;
}
.article ul ul, .article ul ol,
.article ol ul,
.article ol ol {
margin: 0;
}
コメント欄のコンテンツ部分のタグは以下の通りで。
<div class="comment-content">
ulリストなどのリストは▼画像のように、一切反映しない感じになります。
例えば404ページのようにclass属性にarticleも付けてもらったら、CSSを再指定しなくて済むので、リストを装飾してる人は（amp.cssの容量的にも）便利だと思いまして。
.article ul li, .comment-area ul li {}
.article ul > li:before, .comment-area ul > li:before {}
現状、上記のようにスタイルを追加すれば▼画像のように反映する感じです。
※個人的な話ですが、hタグとリスト系は.entry-contentで指定していたスタイルを、全て.articleに変更したので文字列的にamp.cssの容量削減できました。
需要は猛烈に少ないでしょうし、ちょっと強引かもですが『なぜ反映しない？』と思う人もいるかもしれません？
以下のようにクラスarticleを追加すれば、おそらくリストを使ってスッキリさせたい時、便利かと思われます。
<div class="comment-content article">
Cocoon機能のpreなどの装飾も通常ページコメント欄で使えたらとも思いますが、AMPで対応してないので諦め、リストだけでも。。
もしPHPにも容量問題があったらスミマセン…、ご検討お願いします。#
Topic starter
2018-06-09 01:20
Cocoon機能のpreなどの装飾も通常ページコメント欄で使えたらとも思いますが、
上記引用は思いつきで書きましたが、機能がありましたね！って事で解決しました＾＾
『Cocoon設定』、『コード』より『ハイライト表示するCSSセレクタ』に以下を追記で対応できました！
.entry-content pre, .comment-content pre
lightning2014 reacted
Topic starter
2018-06-09 21:19
飾り気が必要か
こちらは飾りだけでなく（個人的にですが）見やすくなるのでリストをよく使ってます。
メリットは説明長くなりがちな文を、スッキリ見やすくできる効果があると思ってるからです。
果物の種類はいちご、りんご、ぶどうなどがあります。いちごの種類はあまおう・あすかルビー・とちおとめ。りんごには、ふじ・つがる・王林。ぶどうは、巨峰・ピオーネ・デラウエアなどあります。
上記をスッキリさせるために、リストを使う。みたいな感じです。
果物の種類には、下記のようなモノがあります。
- いちご
- あまおう
- あすかルビー
- とちおとめ
- りんご
- ふじ
- つがる
- 王林
- ぶどう
- 巨峰
- ピオーネ
- デラウエア
ページ内の文面で説明したもののコピペですが。
https://bibabosi-rizumu.com/list-nesting/#toc8
コメントcomment-contentエリアはentry-content領域と同じで、記事として出力した部分と同じで自分が書いた文を出力した部分で。
不具合関係考察的
これですが、以下の通り指定方法を変更したてで。
※個人的な話ですが、hタグとリスト系は.entry-contentで指定していたスタイルを、全て.articleに変更した
調べた感じだと公開されるページでは、自分が書く記事内容にクラスarticleが使われてるようです。
- 記事（h1タグ～記事下SNSシェアボタン・author-nameまでの領域）
- 404ページ：編集できる領域
- category-content.php
https://gyazo.com/22f4601ba01ce426c1c48257fa6bd1b4
画像の箇所；カテゴリh1下；説明部分領域
その他
- admin.php (lib/admin.php) //ビジュアルエディターのクラス名に任意のclassを追加する
//var_dump($mceInit );
$mceInit['body_class'] .= ' main article';
- live-writer.php (tmp/live-writer.php)
<div class="article live-writer">
抜けてなければ問題ないかと思われます？？？
2018-06-12 21:57
comment-contentにではないですが、スタイルが適用されるようにしたものをアップしておきました。
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね！」もご活用ください。回答者の励みになります。
（CC BY-ND 2.1）準じていれば（リンクを貼っていただければ）転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。