特定のカスタム投稿の記事一覧のレイアウトを変更したい

♥ 0

いいねをした人: 居ません

このトピックには2件の返信、2人の参加者があり、最後にゆう子により4ヶ月前に更新されました。

3件の投稿を表示中 - 1 - 3件目 (全3件中)

投稿者

投稿
2024年7月24日 5:41 PM #140796

ゆう子
参加者

♥ 10

【お使いの Snow Monkey のバージョン】26.02
【お使いの Snow Monkey Blocks のバージョン】21.0.1
【お使いの Snow Monkey Editor のバージョン】
【お使いのブラウザ】chome
【当該サイトのURL】

### 実現したいこと

CPT UIでカスタム投稿を作り「product-list」というスラッグを作りました。
実現したいのは「product-list」のみ記事一覧レイアウトをリッチメデイアで横並びの5列にしたい。

### 試したこと
下記を参考にしてリッチメディアで5列表示は実現しましたが、
他のカスタム投稿の記事一覧ページも同じように5列になってしまいました。

https://snow-monkey.2inc.org/forums/topic/%e3%83%88%e3%83%83%e3%83%97%e3%83%9a%e3%83%bc%e3%82%b8%e3%81%ab%e8%a1%a8%e7%a4%ba%e3%81%99%e3%82%8b%e3%82%ab%e3%82%b9%e3%82%bf%e3%83%a0%e6%8a%95%e7%a8%bf%e3%81%ae%e6%a8%aa%e5%88%97pc%e3%81%ae/#post-51838

また、下記のページも参考にカテゴリーを変えてみたのですが
うまくいきませんでした。

https://snow-monkey.2inc.org/forums/topic/%e7%89%b9%e5%ae%9a%e3%81%ae%e3%82%a2%e3%83%bc%e3%82%ab%e3%82%a4%e3%83%96%e3%83%9a%e3%83%bc%e3%82%b8%e3%81%ae%e3%81%bf%e3%80%81%e8%a8%98%e4%ba%8b%e4%b8%80%e8%a6%a7%e3%83%ac%e3%82%a4%e3%82%a2%e3%82%a6/

どうしたものか、検索し試したのですが
どうもうまくいきません。ご教授いただけるでしょうか？
どうぞよろしくお願いいたします。

♥ 0

いいねをした人: 居ません

2024年7月25日 7:38 AM #140800
キタジマタカシ
参加者

♥ 2421
カスタム投稿のアーカイブページの場合、body にそのカスタム投稿アーカイブ用のクラス（.post-type-archive-投稿タイプ名）が付与されているのでそれを使うのが良いと思います。
```
/* news アーカイブページ一覧を4列に */
@media (min-width: 64em) {
  .post-type-archive-news .p-archive .c-entries .c-entries__item {
    flex: 0 1 25%;
    max-width: 25%;
  }
}
```
♥ 1

いいねをした人:
2024年7月25日 9:50 AM #140811

ゆう子
参加者

♥ 10

キタジマさま

ありがとうございました！無事、5列になりました！！

いただいたアドバイスとタグを使って全てのカテゴリーの記事一覧も5列にできました。

書いていただいたようにカテゴリー一覧も body にclassが付与されていましたので

それを使っています。（タクソノミースラッグの名前　product_categories）

今後のために記載しておきます。

/* アーカイブページ一覧を5列に */
@media (min-width: 64em) {
.tax-product_categories .p-archive .c-entries .c-entries__item {
flex: 0 1 20%;
max-width: 20%;
}
}

解決できたのでトピックを閉じます！

♥ 1

いいねをした人:
投稿者

投稿