The initial step involves removing the separators in the post-meta section, as discussed in this article.
After removing the separators, include another personalized CSS Class in your Divi Blog module. To include a personalized class, follow these steps:
Open the module settings
Go to the Advanced tab
Open the CSS ID & Classes option
In the CSS Class input field, add the class
divi-blog-move-category
Reposition the category above the Featured Image:
In Divi > Theme Options > General Tab > Custom CSS, add this CSS code:
.divi-blog-move-category .et_pb_blog_grid .et_pb_post .post-meta a:nth-child(3) {
position: absolute;
top: 0;
left: 0;
margin-bottom: 0;
color: #ffffff!important;
background: #0071fc!important;
padding: 6px 12px;
margin: 15px;
border-radius: 50px;
}
2. Go to the Blog module > Content > Elements and make sure these elements are ENABLED:
That will place the category over the featured image: