I would like to place an icon in the post title of every article from the category "plus".

This is my attempt for function.php, but it doesn't work that way. Can someone please give me some advice?

 if (has_category( 'plus' )
        echo '<style>
            .entry-title:before {
                content: url("https://testfeld051.magazin.de/wp-content/uploads/2020/05/C-Plus.png");
                margin-right: 10px;

This will depend on how your theme is structuring the templates for single.php (individual post view) but I'll show you what to look for and how to apply via CSS.

So from a theme I'm working on, this is where the category gets included in the post: <article id="post-3417" class="post-3417 post type-post status-publish format-standard hentry category-plus">.

The last class in the <article> element is category-plus. So I want to target that.

My CSS would then look like this:

article.category-plus > header.entry-header > .entry-title:before {
     content: url('wp-content/uploads/2020/05/C-Plus.png');
     display: block;
     float: right;
     margin-right: 10px;
     width: 1em;
     height: 1em;

You'll have to check the source code of the one of the pages you want to add this to (because your theme is different than the one I'm currently working on, so it'll probably have a different set-up), locate where in the entry it specifies the category and then use that information to properly structure your CSS selector.

You can adjust sizing, positioning, etc, as needed - but this is far easier and standard than writing to your functions.php to include a single CSS style rule.

| improve this answer | |
  • Hello Tony, thanks for your answer and help. i would be happy if i could solve the integration via css, but i can't address the articles. I use the Newspaper-Theme (tagDiv) and could identify the selectors as article.category-plus and header.td-post-title, but unfortunately it does not work. – tizian_72 Jul 3 at 14:59
  • In the developer console, check to see if your styles are loading, and then select the element and check to see which styles are being applied. It’s possible that there are other styles overriding yours after. We may need to get more specific with the selectors. – Tony Djukic Jul 3 at 15:14

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.