Steps to move the Divi blog module items with custom ordering using CSS.
Step 1: Add the class customBlogOrder to your blog module.
Step 2: Update the 4 “order” values in the CSS to your preferred order.
Step 3: Add the custom CSS to the Divi theme options / Custom CSS area.
/* moving info on blog module BEGIN */
/*make the parts of the blog post flexible*/
.customBlogOrder .et_pb_post {
display: flex;
flex-direction: column;
}
/*blog post featured image*/
.customBlogOrder .et_pb_post .et_pb_image_container, .customBlogOrder .et_pb_post .entry-featured-image-url {
order: 1;
}
/*blog post title*/
.customBlogOrder .et_pb_post .entry-title {
order: 3;
}
/*blog post meta*/
.customBlogOrder .et_pb_post .post-meta {
order: 2;
}
/*blog post excerpt and button*/
.customBlogOrder .et_pb_post .post-content {
order: 4;
}
/*remove negative margin on blog image*/
.customBlogOrder .et_pb_blog_grid .et_pb_image_container {
margin: 0!important;
}
/*adjust margin below blog post featured image*/
.customBlogOrder .et_pb_post .entry-featured-image-url {
margin-bottom: 10px;
}
/* moving info on blog module END */
