[Support request] Multiple category display with separation in header elements

[davide]

Hello, I am designing the haeder element for a blog post. This is the code for the template tags.

<!– Home Hero –>
<h1 style>
{{post_title}}
</h1>
<h3 style=”background-color:white; color:white; text-transform:lowercase; width:25%; margin:auto;”>
({{post_terms.category}})
</h3>

Since I have multiple categories assigned to a post, is there a way to separate them in the header? If I use the code as above, they show like “Category 1 Category 2 Category 3 etc.”

Thank you
Davide

[David]

Hi there,

how would you want to separate them? With a pipe ‘|’ between them?
If so you could use this CSS:

.page-hero h3 a:not(:first-child):before {
    content: '|\00a0';
}

[davide]

Perfect, thank you! And how can I take out the white commas?

http://davidepremoli.com/public_html/whitesaround/aonang/

Thanks

[Leo]

This should help:
https://docs.generatepress.com/article/generate_page_hero_terms_separator/

[Author]

Posts