How To Style Post Author Comments In Oxygen Builder

I use the native WordPress commenting system. I’ve tried using other systems like JetPack, WPDiscuz, Disqus, CommentLuv and so on, but I always end up coming back to native WordPress comments.

Making Changes To WordPress Comments

WordPress’ comments are a bit boring, so I make small CSS and code changes to them to liven them up a little. For example,

• I might change the Leave A Reply text to Enjoy The Article? Leave A Comment
• I might make the avatars round instead of square
• and I might style post author comments to have a line down the left hand side so that they stand out from reader comments.

Problems When Styling Post Author Comments

If you have a lot of comments under a particular post, and you’ve set up those comments to be nested, then there will be comments and sub-comments as more and more people add their comments, and the post author responds.

So when styling post author comments, you have to be careful not to also style comments made by readers when they appear as sub-comments to the post author’s comments. Your CSS has to target post author comments and no-one else’s.

The CSS below works to only highlight the post author’s comments.

CSS For Highlighting Post Author Comments

This CSS below adds a vertical line at the left hand side of the comment if it was made by logged in user who is also the post author.

The CSS below additionally adds a background colour and border to both the name of the comment author and the comment text, if the comment was made by a logged in user who is also the post author.

I add extra CSS code using WPCodeBox because it’s fabulous. But you can add CSS any way you like.

Does This CSS Work In Non Oxygen Sites?

If you’re not using native WordPress comments on Oxygen Builder, and the code does not work in your WordPress theme, perhaps check the precise spelling of the class names on your theme, and change the code accordingly.