Customizing Archive Pages Created by WooCommerice

  • Resolved Walton

    (@walton)


    5 years, 7 months ago

    I have a site that uses WooCommerce. I’m trying to customize pages that are created from product attributes. So, I have a product attribute “writer” (I sell books) and I’ve created archive pages for them, such as:

    [ redundant link removed ]

    If you go to that page, there’s a huge space where my theme would normally put a header image. I’m trying to either add a custom header image or get rid of the header image space. Is there any way to target all pages with the attribute “Writer” in CSS? Or ideally, if I could put a different header on each writer’s page, that would be amazing. I don’t see any unique tags in there to help me.

    • This topic was modified 5 years, 7 months ago by James Huff.
    • This topic was modified 5 years, 7 months ago by Jan Dembowski.

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)

  • Hey @walton,

    That’s a great question. So typically the theme, WordPress and WooCommerce will contribute classes to the <body> tag that we can use to style elements on a particular URL differently from other ones. Looking at the source code of the page you mentioned, it appears that the ones that are unique to this page are missing. Here’s a screenshot:

    tags

    By way of comparison, this is what an attribute archive’s tags look like on my demo site with the Storefront theme.

    tags

    With those tags we could take the term-blue and add the header image with it.

    Since the header image is added via an inline style, it’ll also be a bit tricky to add a fallback with CSS that doesn’t override all of the other pages.

    I would reach out to the theme author and see if they have a way to either add in the missing classes in the <body> tag or set a default image.

    If I can help out, let me know.

    Cheers

    Thread Starter Walton

    (@walton)

    Thanks. I assumed it was WooCommerce creating that archive page and WooCommerce said they don’t give any help customizing WordPress. I wish I could post this in my theme support forum here, but it would get flagged as a duplicate post!

    Hey @walton,

    You might give posting it a try. Don’t copy the text exactly, but ask them in the forum what’s happening with the body tag. Lots of themes extend that, but taking out classes from plugins can cause trouble.

    Plugin Support AW a11n

    (@slash1andy)

    Automattic Happiness Engineer

    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.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Customizing Archive Pages Created by WooCommerice’ is closed to new replies.