Adding icons to the Divi Blog module.
Add the Divi Blog Module.
Go to the Divi Blog module Settings tab.
Navigate to the Advanced tab and locate the "CSS ID & Classes" section.
In the CSS Classes field, enter:
divi-bm-iconsIn your WordPress Dashboard, go to Divi > Theme Options, and select the General Settings tab.
At the bottom, find the Custom CSS option and add the following CSS snippet:
/*===styles for blog module meta icons===*/
.divi-bm-icons .post-meta .published:before,
.divi-bm-icons .post-meta .author a:before,
.divi-bm-icons .post-meta>a:before {
content: "\e023";
font-family: ETMODULES;
color: #0071fc;
font-weight: bold;
margin-right: 4px;
}
/*===icon for blog module author meta===*/
.divi-bm-icons .post-meta .author a:before {
content: "\e08a";
}
/*===icon for blog module category meta===*/
.divi-bm-icons .post-meta>a:before {
content: "\e078";
}
/*===icon for blog module date meta text===*/
.divi-bm-icons .post-meta .published:before {
content: "\e023";
}
You can see the end result after applying the Custom CSS in the screenshot below:
Note: Feel free to modify the CSS Code in the Theme Options to adjust the color, size, and font-weight values.