サイト内検索
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。
何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。
不具合・カスタマイズ対象ページのURL:
相談内容:
不具合の発生手順:
解決のために試したこと:
※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。
環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/
フォーラム利用ガイドリンク
- フォーラムガイドライン
- よくある質問と答え(FAQ)
- サポート対象外のケース
- 原因不明の不具合用トラブルシューティング
- トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw)
- 真っ白画面でのエラーメッセージの確認方法
- ブラウザ環境チェックツール
- Cocoonカスタマイズ依頼
フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。
トピックスターター 2024年12月5日 22:42
相談内容:サイト内に投稿されたコメントを改行表示にしたい。
不具合の発生手順:
①サイト内で投稿されたコメントのみを表示する投稿記事を作成した。
②記事内にブロック「最新のコメント」を設置した(ウェジェットではない)。
③表示されたコメントは、元のコメントにあった改行が反映されず、1行の表示になっていた。
文字数はウェジェットのような表示設定が無かった?見当たらなかった。
解決のために試したこと:
①ウェジェットのHTMLを入れようと模索したがよく分からなかった。
②改行時にスペースをいれたら改行を認識されると思ったが出来なかった。
③chatGPTに聞いて、下記CSSを、外観の追加CSSに追加入力した。
.widget_recent_comments .recentcomments {
white-space: pre-line;
}
④chatGPTに聞いて、「functions.php」に改行タグを新規追加した。
function custom_recent_comments_format($comment_text) {
return nl2br($comment_text); // 改行を反映
}
add_filter('get_comment_text', 'custom_recent_comments_format');
私では解決不可能なようです。
お手数ですがよろしくお願いします。
---------------------------------------------- サイト名:オーバーロードWIKI第7版 サイトURL: https://overlordwiki.matrix.jp ホームURL: https://overlordwiki.matrix.jp コンテンツ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-ganchan01/style.css WordPressバージョン:6.7.1 PHPバージョン:8.2.20 ブラウザ:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36 サーバーソフト:Apache サーバープロトコル:HTTP/1.1 言語:ja,en-US;q=0.9,en;q=0.8 ---------------------------------------------- テーマ名:Cocoon バージョン:2.8.2 カテゴリー数:33 タグ数:1 ユーザー数:2 ---------------------------------------------- 子テーマ名:Cocoon Child バージョン:1.1.3 style.cssサイズ:1737 バイト functions.phpサイズ:716 バイト ---------------------------------------------- Gutenberg:1 Font Awesome:4 Auto Post Thumbnail:0 Retina:0 ホームイメージ:/wp-content/themes/cocoon-master/screenshot.jpg ---------------------------------------------- ブラウザキャッシュ有効化:1 HTML縮小化:0 CSS縮小化:1 JavaScript縮小化:1 Lazy Load:1 ---------------------------------------------- 利用中のプラグイン: Advanced Google reCAPTCHA 1.25 All In One WP Security 5.3.6 Auto Linker 0.0.4 Autoptimize 3.1.12 bbPress 2.6.11 Decent Comments 1.13.0 Disable Google Fonts 2.0 Flexible Table Block 3.4.0 Protect Uploads 0.5.2 Relevanssi 4.24.2 TS Webfonts for SAKURA RS 3.1.4 WP Multibyte Patch 2.9 WPS Hide Login 1.9.17.1 WP Super Cache 1.12.4 WP ULike 4.7.6 ----------------------------------------------
2024年12月5日 23:41
●回答
WordPress標準の「最新のコメント」ブロックのコメント表示はリスト表示です。
このため、1行三点リーダー表示(文字数までは分からず)となり、改行などは削除され表示されます。
●対策方法
Cocoon「[C]最近のコメント」ウィジェット(文字数指定あり)を投稿・固定ページの本文埋め込みます。
※投稿のコメント欄と異なり、ウィジェットはあくまでもリストで1行と言う考えのようです。
https://wp-cocoon.com/community/postid/63414/
トピックスターター 2024年12月6日 01:34
大門未知子さん
返信ありがとうございます。
「コメントはリスト表示のため1行になる」
「文字数指定(文字数を増やす)をしたければウェジェットを使用する」
「自分で出来ないなら既存の範囲で諦める」
理解いたしました。
出来そうな範囲なら頑張りますが、これは私では難しそうなので、有償案件にリストアップします。
無理に悩む必要がなくなり助かりました。
ありがとうございます。
私のサイトは前身のサイトがあり、そちらはトップページでコメントの改行が出来ていたので、恐らくできるのだろうと思い質問させて頂きました。
アーカイブですが下記URLのサイトです。
http://overload.2-d.jp /" target="_blank" rel="noopener"> https://web.archive.org/web/20151205004001/http://overload.2-d.jp/
2024年12月6日 01:43
とりあえず、コメント本文だけを以下のようなショートコードを作って取得してみたのですけれど。
function latest_comments_shortcode($atts) { // デフォルトの引数(コメント数を指定) $atts = shortcode_atts(array( 'number' => 5, // 取得するコメント数 ), $atts); // 最新のコメントを取得 $args = array( 'number' => $atts['number'], // 引数で指定されたコメント数 'status' => 'approve', // 承認済みコメントのみ 'post_status' => 'publish', // 公開された投稿のコメントのみ ); // コメントを取得 $comments = get_comments($args); // コメントがあれば表示 if ($comments) { $output = '<ul>'; foreach ($comments as $comment) { // コメントの内容のみを表示 $output .= '<li>' . esc_html($comment->comment_content) . '</li>'; } $output .= '</ul>'; } else { $output = '最新のコメントはありません。'; } return $output; // ショートコードとして返す } // ショートコードを登録 add_shortcode('latest_comments', 'latest_comments_shortcode');
ショートコードを投稿ページに入れて、表示させてみましたが、以下のように表示されました。
上記の上から2番目は、実際のコメントは以下のような感じで、改行されています。
データベース(wp-comments)に保存されている内容を確認すると、以下のような感じで、改行タグはなかったです。
(文字コードとしての改行はあるのだと思います)
(文字コードとしての改行はあるのだと思います)
そのため、上記のソースを以下のように「nl2br」で改行タグを入れてやると。
foreach ($comments as $comment) { // コメントの内容のみを表示 $output .= '<li>' . nl2br(esc_html($comment->comment_content)) . '</li>'; }
表示は、以下のような感じに改行されました。
WordPress本体の「最新のコメント」ブロックは、おそらく以下だと思うのですけれど。
そういう処理がそもそもされていないのでは・・・。
2024年12月6日 11:05
@mk2_mk2 さん
コードを提示してしまうとは(笑)
各コードについては、これを機にご自身で勉強して、理解してください。
●答え
ショートコードの使い方
[recent_comments]
CSS
好みでレアウトは調整してください。
.recent-comments-list { display:flex; flex-direction: column; gap: 10px; list-style:none; } .recent-comments-list li { list-style:none; } .recent-comments-list p { margin-bottom:0 }
PHP
少し手直しして、提示された元ページにと同じにしてみました(コメントの文字数は制限していません)。
add_shortcode('recent_comments', function($atts) { // デフォルトのオプション $atts = shortcode_atts( array( 'number' => 5, // 表示するコメント数のデフォルト値 ), $atts ); // コメントを取得 $recent_comments = get_comments(array( 'number' => intval($atts['number']), 'status' => 'approve', // 承認済みのコメントのみ 'post_status' => 'publish', // 公開中の投稿に限る )); // コメントがない場合の処理 if (empty($recent_comments)) { return '<p>No comments found.</p>'; } // コメントをリスト形式で出力 $output = '<ul class="recent-comments-list">'; foreach ($recent_comments as $comment) { $post_title = get_the_title($comment->comment_post_ID); // 投稿タイトル $post_link = get_permalink($comment->comment_post_ID); // 投稿リンク $output .= '<li>'; $output .= '<p><a href="' . esc_url($post_link) . '">' . esc_html($post_title) . '</a> へのコメント (' . esc_html($comment->comment_author) . 'より[' . esc_html(get_comment_date('m/d', $comment)) . '])</p>'; $output .= '<p class="comment-content">' . nl2br($comment->comment_content) . '</p>'; $output .= '</li>'; } $output .= '</ul>'; return $output; });
2024年12月6日 16:15
@chu-ya さんこそ・・・。
以下の返信(00:02)以前から、私も自分で試していました。
https://wp-cocoon.com/community/postid/82734/
tanaka203さんの最後の返信は、納得していただいたようで、最後にURLをご提示してあったところに、何と言うのか未練のようなものを感じました。
そこで、どうせ試していたのならばと、それを貼りつけておきました。
ただ、私はコメント本文しか編集していませんでしたから。(改行を確認していましたので)
これを手掛かりに・・・。
- 他の必要な項目は、HTMLの編集を追加する
- 見た目をCSSで整える
上記をご自分で調べたり試していただく、踏み台にはなるのかなという感じです。
それをご自分で調べていただくことで・・・。
- どのようなお問い合わせを、ご自分がなさっているのかということも、分かっていただけるのではないか
(本来サポート対象外で、Cocoonの問題でもないでしょうし)
- 何より、ご自分で調べる・試すということを、していただけるのではないか(今後のことも含めて)
その手掛かりになるのではないか
そんな感じだったのですけれど。
全部ご対応してくださったのですね。
2024年12月7日 02:20
tanaka203さん
折角ですので色々触って試してみたいと思います。
ぜひ、そうなさってください。
今回のものに、エッセンスなのか、ノウハウなのか、そういうものが複数あると思います。
良い機会ではないかと思います。
(こういう提示があったとしても、その先自分でメンテナンスできなければ、サイトの維持はできなくなると思います)
文字でのコミュニケーションは難しく。
上手く伝えることができる気がしませんので、短めに書きます。
フォーラムで返信くださっている方々も、回答を持ち合わせている訳ではないということは、ご承知置きいただければと思います。
調べ・考え・試す。
そういうことをした上で、書き込んでくださっているということは、ご理解いただければと思います。
(上手く言えてない気はしますが・・・)
tanaka203 reacted
問題の解決に至った場合には、トピック冒頭の「解決済み」をクリックしていただけますと幸いです。
また、有用な回答があった場合は返信右下にある「いいね!」もご活用ください。回答者の励みになります。
(CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。
フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。
最近の書き込みはこちら。
詳細なカスタマイズ依頼をするならこちら。