Add class if page only displays product categories

  • Resolved rookiecop

    (@rookiecop)


    3 years, 8 months ago

    Hi,
    I’m building a woocommerce site with Storefront. The customer wants the shop pages to use the full width of the screen if they are listing categories but to be within a narrower container when listing products. There will not be any pages which list both categories and products together.

    The problem is that shop categories and products seem to share the same template with the same classes so Im struggling to find a class to hook into to do this, for example adding a body class based on the category ‘Display type’ (eg if customer selects display type of ‘Subcategories’ then get page to display a class that I can latch onto with css).

    Ive seen code that adds the category name to the body class but that’s not ideal as I would have to amend the css every time the customer adds a new shop category page or decides to rearrange a shop category to show products instaed of sub-categories and vice versa.

    I’m open to any method which will allow me to acheive what I need to do.

    Thanks in advance.

    • This topic was modified 3 years, 8 months ago by rookiecop.
Viewing 2 replies - 1 through 2 (of 2 total)

  • Hi @rookiecop,

    The body tag should have this class when a product category archive is being viewed, tax-product_cat. The overall shop page and product pages should not have that one.

    Try using that as a hook to style the pages differently. Let us know if you have any questions.

    Cheers

    Theme Author Automattic

    (@automattic)

    We haven’t heard back from you in a while, so I’m going to mark this as resolved – if you have any further questions, you can start a new thread.

    Thanks,

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Add class if page only displays product categories’ is closed to new replies.