{"id":19066,"date":"2024-04-13T13:10:32","date_gmt":"2024-04-13T08:10:32","guid":{"rendered":"https:\/\/mcstarters.com\/?p=19066"},"modified":"2024-04-13T13:12:02","modified_gmt":"2024-04-13T08:12:02","slug":"change-a-bulleted-list-into-checkmarks","status":"publish","type":"post","link":"https:\/\/mcstarters.com\/blog\/change-a-bulleted-list-into-checkmarks\/","title":{"rendered":"How to change a bulleted list into checkmarks or any other icons in Divi?"},"content":{"rendered":"\n

Do you want to change a bulleted list into checkmarks or any other icons in Divi?<\/p>\n\n\n\n

Bullet lists are only available in square, circle, and disc symbols. It can be boring. So that is why today we will show you how to change Bulleted List Into Checkmarks.<\/p>\n\n\n\n

In this post, we will show you how to change a bulleted list into checkmarks or any other icons in Divi WordPress<\/a>. Bullet lists are the best way to organize information in a well-structured format.<\/p>\n\n\n\n

You Might Also Like: to remove the sidebar in Divi<\/a><\/p>\n\n\n\n

Change a Bulleted List into Checkmarks<\/h2>\n\n\n\n

Fellow step by step guide to change a bulleted list into checkmarks in the Divi:<\/p>\n\n\n\n

Text Module and Custom CSS Class<\/h3>\n\n\n\n

Step 1:<\/strong> Add a Text Module to your layout. Open the Text Module settings.<\/p>\n\n\n\n

Step 2:<\/strong> In the Content tab, create a list of bullet items. Go to the\u00a0\u201cAdvanced\u201d<\/strong>\u00a0tab.<\/p>\n\n\n\n

Step 3:<\/strong> Open the\u00a0\u201cCSS ID & Classes\u201d<\/strong>\u00a0toggle<\/p>\n\n\n\n

Step 4:<\/strong> Add the class\u00a0\u201cmc-bullet-list\u201d<\/em><\/strong>\u00a0to the\u00a0\u201cCSS Class\u201d<\/strong><\/p>\n\n\n\n

\"Change<\/figure>\n\n\n\n

Paste The CSS Snippets<\/h2>\n\n\n\n

Step 1:<\/strong> After entering the CSS class, you need to copy the below snippets.<\/p>\n\n\n\n

\n\/*bullet checklist by www.mcstarters.com*\/\n.mc-bullet-list ul {\nlist-style-type: none!important;\n}\n.mc-bullet-list ul li:before {\ncontent: 'e052'!important;\ncolor: #2cba6c;\nfont-family: 'ETMODULES'!important;\nmargin-right: 10px;\nmargin-left: -14px;\n}<\/code><\/pre>\n\n\n\n
Step 2:<\/strong> Go to Divi > Theme Options<\/strong> and at the bottom of the default \u201cGeneral\u201d tab, paste the CSS snippet into the \u201cCustom CSS\u201d box and save changes.<\/p>\n\n\n\n
\"Change<\/figure>\n\n\n\n
Successfully, you change a bulleted list into checkmarks or any other icons in Divi by following these steps. You can change the code using a different style icon.<\/p>\n\n\n\n
Conclusions<\/h2>\n\n\n\n
There is no limit to customizing the design in Divi. If you customize the bullet list and do customs CSS follow the above steps.<\/p>\n\n\n\n
3 ways to Add Custom CSS to Divi<\/a><\/p>\n\n\n\n
Frequently Asked Questions<\/h2>\n\n\n
\n
\n
\n
How can you customize a bulleted list in Divi?<\/h3>\n
\n\n
We can customize a bulleted list in Divi using custom CSS. here is the custom CSS code.
\/*bullet checklist by www.mcstarters.com*\/ 
.mc-bullet-list ul { list-style-type: none!important; } .mc-bullet-list ul li:before { content: ‘e052’!important; color: #2cba6c; font-family: ‘ETMODULES’!important; margin-right: 10px; margin-left: -14px; }<\/p>\n\n<\/div>\n<\/div>\n
\n
How do you change bullets to check marks divi?<\/h3>\n
\n\n
To change bullets to checkmarks \u2705  also need to add custom css in Divi > theme option > CSS.  \/*bullet checklist by www.mcstarters.com*\/ 
.mc-bullet-list ul { list-style-type: none!important; } .mc-bullet-list ul li:before { content: ‘e052’!important; color: #2cba6c; font-family: ‘ETMODULES’!important; margin-right: 10px; margin-left: -14px; } <\/p>\n\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n
You Might Also Like to Hire: Divi Theme Experts<\/strong><\/a><\/p>\n","protected":false},"excerpt":{"rendered":"
Do you want to change a bulleted list into checkmarks or any other icons in Divi? Bullet lists are only available in square, circle, and disc symbols. It can be boring. So that is why today we will show you how to change Bulleted List Into Checkmarks. In this post, we will show you how […]<\/p>\n","protected":false},"author":5,"featured_media":19067,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[2,6],"tags":[400,488,417,491],"class_list":["post-19066","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress","category-divi","tag-create-custom-bullet-points","tag-divi-guide","tag-divi-icons","tag-divi-tips"],"_links":{"self":[{"href":"https:\/\/mcstarters.com\/blog\/wp-json\/wp\/v2\/posts\/19066","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mcstarters.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mcstarters.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mcstarters.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/mcstarters.com\/blog\/wp-json\/wp\/v2\/comments?post=19066"}],"version-history":[{"count":0,"href":"https:\/\/mcstarters.com\/blog\/wp-json\/wp\/v2\/posts\/19066\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/mcstarters.com\/blog\/wp-json\/wp\/v2\/media\/19067"}],"wp:attachment":[{"href":"https:\/\/mcstarters.com\/blog\/wp-json\/wp\/v2\/media?parent=19066"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mcstarters.com\/blog\/wp-json\/wp\/v2\/categories?post=19066"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mcstarters.com\/blog\/wp-json\/wp\/v2\/tags?post=19066"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}