- このトピックには5件の返信、3人の参加者があり、最後に
により4年前に更新されました。
-
投稿
-
トピックを新しく立てる方は次の項目も記述してください（要望トピックの場合は不要です）。
【お使いの Snow Monkey のバージョン】11.7.3
【お使いのブラウザ】chrome
【当該サイトのURL】（公開できる場合は書いていただいたほうがスムーズです）===
いつもお世話になっております、
投稿一覧ページのデザインをCSS等で変更したいと考えております。
プラグインのCPT UIでカスタム投稿タイプを作成したアーカイブページを編集しようと考えたのですが、
作成した（と思っている）phpファイルが見つかりません。。。
目的としましてはクラス名などを追加したいです。
申し訳ありませんが、投稿一覧ページのデザインの編集方法をご教授いただければ幸いです。
よろしくお願いします。
いいねをした人: 居ません作成した（と思っている）phpファイルが見つかりません。。。
CPT UI でカスタム投稿タイプを定義しても PHP ファイルは作成されなかったと思います。カスタム投稿タイプ用のテンプレートが存在しない場合、WordPress は
archive.phpやsingular.phpを使います。Snow Monkey の場合も上記のようになりますが、ページの全体を書き換えたいのか、一部分だけを書き換えたいのかでベストな方法が変わってきます。一般的な WordPress のお作法では
archive-{カスタム投稿タイプ名}.phpやsingle-{カスタム投稿タイプ名}.phpを作成しますが、普通のアーカイブページやシングルページとほぼほぼ同じだったとして、そのようなテンプレートをつくるとコードの重複が発生してメンテナンスコストがあがります（共通部分に修正があったときにどちらのテンプレートにも修正を反映しないといけないため）。なので Snow Monkey では一部分だけの修正の場合は一部分のテンプレートだけをカスタマイズする仕組みがあります。ということで、具体的にどこをどうしたいのかを書いていただけると、より良い提案ができると思いますので、詳しく教えていただくことはできますか？
※カスタム投稿タイプのカスタマイズの考え方としては下記のトピックが参考になります。
いいねをした人: 居ません横から失礼します。
CPT UIでカスタム投稿タイプを追加し、そのカスタム投稿タイプのアーカイブを表示した場合、
<body>に記載されるクラス名にpost-type-archiveやpost-type-archive-{custom-post-type-slug-name}というCSSクラスが自動的に付与されますので、そちらからCSS指定することは可能かもしれません。また、
>ある投稿一覧をピンタレストの様なグリッドデザインにしたく思っています。
とのことですが、Snow Monkey側のスタイルをどれくらい利用するのか（or 全く利用しないのか）によって、対応方法は変わってくると思います。一覧に表示されている各投稿のマークアップ自体を独自のものにするのであれば、テンプレートファイルの書き換え（
template-parts/archive/entry/**辺り？）が必要になるかもしれませんね。その場合、子テーマでアプローチするかMy Snow Monkey（プラグイン）でアプローチするかで、また方法も変わってくるかと思います。
また、現状どのようなテンプレートファイルを読み込んでいるか簡単に確認するために Show Current Template というプラグインを利用されると良いかもしれません。実際、テンプレートの上書きなどをされた際にも正常に読み込まれているかどうかを確認することも容易になります。
以上、ご参考になれば幸いです。
いいねをした人: 居ません@井上さま
あるカスタム投稿タイプのアーカイブページの.p-archive > .c-entriesの部分に任意のクラスを追加したいということであっていますか？であれば、下記のコードの追加で実現できます。My Snow Monkey プラグインか子テーマのfunctions.phpに貼り付けてみてください。add_filter( 'snow_monkey_template_part_render_template-parts/archive/entry/content/content', function( $html, $name ) { // カスタム投稿タイプ news のカスタム投稿アーカイブのとき if ( 'news' === $name ) { // my-class というクラスを追加 return str_replace( 'c-entries ', 'c-entreis my-class ', $html ); } return $html; }, 10, 2 );もしクラスの追加程度ではなくて、一覧部分の HTML をまるっと別物にしたいという場合は、Olein さんが書かれているようにテンプレートの置換や追加が必要になるかと思います。
いいねをした人: 居ません＠Olein_jpさま
ご回答ありがとうございます！
<body>に記載されるクラス名にpost-type-archiveやpost-type-archive-{custom-post-type-slug-name}というCSSクラスが自動的に付与されますので、そちらからCSS指定することは可能かもしれません。
こちらに気づきませんでした。。。
確認したところ付与されていましたので、今後確認していきたいと思います。現在子テーマでは作成していませんので、My Snow Monkeyのアプローチを探っていきたいと思います。
プラグインも入れてみたいと思います。ありがとうございます！
色々調べながら手探りで作っていますので、初歩的な質問ばかりするかもしれませんが、どうぞよろしくお願いします。
＠キタジマさま
お返事ありがとうございます！
functions.phpにいただいたコードを貼り付けたところ、実現できました！
いつも本当にありがとうございます！
いいねをした人: 居ません
- トピック「投稿一覧ページのデザイン変更について」には新しい返信をつけることはできません。