• I’m currently using the 2023 theme and am using Block designs. Is there a way to format specific posts based on their categories so that CategoryX looks one way and CategoryY looks a different way? Can that also be done on the main page?

    For example. If I want CategoryX to show with red font and black affectations but I want CategoryY to show with blue font and yellow affectations? Both on the post itself and the home page (index)?

Viewing 4 replies - 1 through 4 (of 4 total)
  • Moderator bcworkz

    (@bcworkz)

    Category specific appearance can be managed with CSS and element class attributes. On an archive listing such as the front page, each post appears as an LI element whose classes include category information. You just need some CSS rules whose selectors target these classes.

    On single post pages, it’s less straight forward. There are no category specific element classes by default. However you can add additional classes via the “body_class” filter. Then have your CSS target these added category classes similar to what’s done on the front page.

    Thread Starter OscarGuy

    (@oscarguy)

    At least I’m familiar with CSS enough to do that. Curious about the post templates. Can you only have one post template/post attribute? Or is it possible to set up multiple with block designs? Perhaps maybe manually assign a template to each type of post/page?

    imikehere

    (@imikehere)

    Yeah you can definitely juggle multiple looks, but templates in block themes are kinda one at a time”per post unless you manually assign them. What most people do is create a few custom templates like one for CategoryX, one for CategoryY and then just pick the right one while editing the post. It’s not fully automatic like CSS targeting, but it gets the job done cleanly. For homepage/archive, CSS is still the easiest win since categories already have classes baked in.

    Moderator bcworkz

    (@bcworkz)

    imikehere’s suggestion of creating different templates for each category is the most straight forward way of achieving varying HTML output for each category. But FWIW, it is feasible to create a custom pattern that conditionally alters HTML based on assigned category. This is because custom PHP code can be executed in patterns. You would need a child theme to add patterns with custom PHP, you cannot do so via the site editor.

    You can then place the pattern(s) in the default single post template. This way there’s no need to manually change the assigned template any time a new post is created. Nor would one need to remember to change templates if the assigned category is changed. This would only alter the HTML that’s output. You still need custom CSS to manage the final appearance.

    How successful this approach would be depends on exactly what it is you wish to alter based upon category. It could be a poor solution in certain scenarios. Another drawback would be in new posts, the preferred HTML may not initially appear in the editor since PHP doesn’t yet know what category is assigned. Once published, it will appear correctly in the front end.

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

You must be logged in to reply to this topic.