# Discourse comment section formatting on Wordpress (Divi theme)

**URL:** https://meta.discourse.org/t/discourse-comment-section-formatting-on-wordpress-divi-theme/169956
**Category:** WordPress
**Created:** [November 12, 2020, 5:37pm UTC](https://meta.discourse.org/t/discourse-comment-section-formatting-on-wordpress-divi-theme/169956 "2020-11-12T17:37:48Z")
**Posts on this page:** 1
**Showing post:** 4

<div class="post-metadata">

### Author: ![angus](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/angus/32/341715_2.png) [@angus](https://meta.discourse.org/u/angus)
#### Post date: [November 16, 2020, 3:03am UTC](https://meta.discourse.org/t/discourse-comment-section-formatting-on-wordpress-divi-theme/169956/4 "2020-11-16T03:03:43Z")

</div>

Hey @newspring, I’ve taken a look, and you’ve got two issues there.

### Styling

Firstly, as I suggested above, the Divi theme is using it’s own custom comment elements, and only providing styles for it’s own custom comment elements. This means that the standard comment elements that Discourse uses don’t have any styling. It also means that Divi can’t style them, as it’s looking for its own custom comment elements.

Essentially, this means you can only use Divi comment blocks with a Divi theme out of the box. If you use a comment block from Discourse, or any other non-Divi comment block, you’ll need to style it yourself. You can see what I mean here if you apply a standard Wordpress theme such as Twenty Nineteen. The Discourse comments will be styled by CSS provided by that theme and look normal.

But fear not! The CSS is relatively straightforward. Here’s one simple way you can make it look more normal. You can add this CSS to Divi, or any other theme that will load it

> **CSS**
>
> ```plaintext
> .comment-meta,
> .comment-metadata,
> .comment-author,
> .comment-content,
> .comment-author img {
> display: flex;
> align-items: center;
> margin-right: 10px;
> font-size: 1rem !important;
> }
> 
> .comment::marker {
> content: '';
> }
> 
> .comment-body {
> margin-bottom: 10px;
> }
> 
> .et_pb_comments_0 {
> background-color: white; 
> }
> 
> ```

The end result will look like this

 ![Screen Shot 2020-11-16 at 1.53.59 PM](https://global.discourse-cdn.com/meta/original/3X/5/a/5ada1d33ffc6407e9f3cba4b80ae0a7ed5c685d3.jpeg)

I think the reason “Conitinue the discusson at..” and “Participants” are blue and yellow is because you’ve managed to add styling to those directly via Divi. If you want to change those colors, remove that custom styling in Divi.

### Discourse and Wordpress comment conflict

You’ve also still got Wordpress comments turned on, which is why you’re seeing another comment compose at the bottom of the post. If you want to use Discourse comments, you’ll probably want to turn that off. Check out my longer explaination of that here

> [@Issues with setting up Discourse with Wordpres](https://meta.discourse.org/t/issues-with-setting-up-discourse-with-wordpres/168442/2):
>
> Hey there, great questions! You can do either. The key is you need to establish the connection between the two. Once that is there, the commenting functions will work. I’m guessing you know how to do handle the “Publish to Discourse” option, i.e. when the post is created. For the linking option, you can link any Discourse post to a Wordpress Post by using the “Link to Existing Topic” publishing option in the sidebar when you’re editing the Wordpress post. The key here is that when you have t…

---

_[View the full topic](https://meta.discourse.org/t/discourse-comment-section-formatting-on-wordpress-divi-theme/169956)._