Center Sidebar Section Titles on DIVI Posted on 22:19:00by Perry Toone with No comments To have the sidebar section titles to be centered (not left aligned), add this css code in the custom css field of the theme options: h4.widgettitle { text-align: center; } Read More
Custom hamburger icon including MENU with icon Posted on 22:11:00by Perry Toone with No comments This CSS snippet is written for the DIVI theme by Elegant Themes. To have another hamburger icon that includes custom text. Just a simple "menu" text beneath the hamburger icon. Add this in the custom css section in the theme options: .mobile_menu_bar.mobile_menu_bar_toggle::after { content: "Menu"; position: absolute; top: 38px; right: 2px; font-size: 12px; } Read More
Add Yelp icon to the social media icons in DIVI Posted on 21:59:00by Perry Toone with 25 comments To add Yelp icon to the social media icons in DIVI, add the following code to includes/social_icons.php before </ul>: <li class="et-social-icon et-social-yelp"> <a href="yelp link goes here" class="icon"> <span><?php esc_html_e( 'Yelp', 'Divi' ); ?></span> </a> </li> then add the following code to custom css box in Divi>theme options: .et-social-yelp a.icon:before { content: url("Yelp icon url here"); } Read More
Add Whatsapp icon next to the phone icon in the DIVI primary header Posted on 21:27:00by Perry Toone with 2 comments To add the whatsapp icon next to the phone icon in the primary menu. Please add the following code to includes/social_icons.php before </ul>: <li class="et-social-icon et-social-whatsapp"> <a href="#" class="icon"> <span><?php esc_html_e( 'Whatsapp', 'Divi' ); ?></span> </a> </li> then add the following code to custom css box in Divi>theme options: .et-social-whatsapp a.icon:before { content: url("whatsapp icon url here"); } Read More
Increase pricing text size on WooCommerce products Posted on 21:22:00by Perry Toone with No comments Looking to increase the size of the pricing text on the woocommerce pages? You can use the following CSS rule in your themes custom CSS: .woocommerce ul.products li.product .price, .woocommerce ul.products li.product .price del, .woocommerce-page ul.products li.product .price, .woocommerce-page ul.products li.product .price del { font-size: 18px; } Read More
How to make DIVI people module the same height Posted on 17:24:00by Perry Toone with No comments Looking to make the People module the same size, even though the other box has less text compare to the other one like the picture below? To correct this and make same height, in the row settings > design tab > set equalize column heights. Then for each person module > advanced tab > custom css > main element window add the following: height:100%; This will produce the below: Read More