Advertisements
If you’d like to change the look of the Divi Comment Form and put it into a 2 column layout like the following, here’s a quick tutorial on how to accomplish just that.
- First, go to your Divi folder (/wp-content/themes/Divi) and copy your comments.php file into your Child Theme folder.
- In comments.php, add <div class=”test”> right after <section id=”comment-wrap”>
- Place the closing </div> right after the following code, then save the file:
<?php if ( ! empty($comments_by_type['comment']) ) : ?>
<ol class="commentlist clearfix">
<?php wp_list_comments( array('type'=>'comment','callback'=>'et_custom_comments_display') ); ?>
</ol>
<?php endif; ?>- Finally, place the following CSS into your Custom CSS area. You may have some minor tweaking to do, but you should be all set with the new layout.
@media (min-width: 981px) {
#comment-wrap {
display: flex;
flex-wrap: wrap;
float: right;
}.test {
flex: 0 0 50%;
order: 2;
min-width: 530px;
}#respond {
flex: 0 0 45%;
order: 1;
margin-right: 5%;
}
}