tweaks

Change the horizontal navigation in Divi to a vertical navigation with a custom menu on specific pages only.

Learn the optimal Featured Image sizes for Divi blog posts and projects. In-depth explanation of why these sizes are optimal, how the blog and portfolio modules work hand-in-hand with these sizes, and how to modify these sizes to work with different aspect ratios.

In this tweak, I’ll show you how to create a beautiful layout using the free and extremely popular Contact Form 7 plugin. We’ll match the form to Divi’s contact form and create the form layout using a simple CSS grid system.

This tutorial builds on the last tutorial, showing you how to add Divi layouts created in the Divi Library to WooCommerce category pages.

Take advantage of the Divi Page Builder and load a layout from your library on archive and category pages with this simple tweak. You can also use it to load a layout above or below your header or footer.

Divi’s default image sizes for the Blog and Portfolio modules are set at 400 x 284. This tweak allows you to change those values to square, portrait, or any custom size you need. It also creates this new thumbnail size when new images are uploaded in WordPress.

Add category text to Divi’s Filterable Portfolio module just below the buttons. Customize the text and it will change for each category.

Very easy tweak that will add the page builder to any custom post type on your site.

Simple instructions on how to add Font Awesome icons to your website the easy way.

This tweak shows a slider at the top of the page that covers the entire window with the menu under the slider. As you scroll down, the page content scrolls up and over the slider and the menu locks into place when it reaches the top of the window.

This tweak will make the fullwidth portfolio module images open in a lightbox instead of going to the project post. Ideal if you’re using the images as a gallery rather than projects.

This is a simple tweak that lets you use the built-in Divi font icons anywhere on your website, not just in the Blurb module.

This tweak will make the Fullwidth Portfolio images unclickable for both the carousel and the grid layouts. I’ll show you how to achieve this using just CSS and also how to do it by overwriting the module.

This tweak will show you how to properly replace a Divi Page Builder module with your own version, overwriting the default module in the functions.php file with the new version in your child theme.

By now we’ve all seen the flying rocket or floating hot air balloon on more than one website. This tweak shows you just how easy it is to create, giving your website some animation flair without slowing it down.

By default, Divi does not allow comments on pages built with the Page Builder. This tweak adds comments to those pages as well as styles them so they don’t stretch all the way across the page.

Looking for a Call to Action option that constantly grabs your attention but doesn’t get annoying? This tweak will add a fixed horizontal bar across the top of your screen with a bright CTA button that sticks out.

This tweak will allow you to keep track of how many clicks you are getting on your call-to-action buttons in Divi. Once everything is tweaked, setting up Google Events are easily done from within the CTA module itself.

This is a simple Divi tweak that only uses CSS. It will change all instances of the sidebar to float left and arranges Woocommerce and other content on the right and with a responsive layout. It’s great for creating a layout similar to Amazon where product categories and filters are always on the left side of the page.

I have had a few request for a tweak that would result in a menu similar to the Elegant Themes Customer Showcase winner Condiviso. It’s actually a pretty easy tweak that is all done in CSS.

When Divi first came out, I was immediately disappointed that I could not use the portfolio modules for posts. I finally received a request for a tweak to fix this and decided it would be worth the time. After performing this tweak, you will be able to use every portfolio module with posts instead of projects.

This tweak will turn Divi’s menu into a 3D flipping menu, adding a little animation and character to your website.

Divi requires no special coding to make it look great on mobile devices. Everything created within the Page Builder is automatically mobile responsive. One of the few downsides is that it does not allow users to zoom in on text or images on mobile devices. This quick tweak easily fixes that problem.

Divi comes with the option to add a phone number and email in the top header but the email address is not linked. This tweak will show you how to add a link so the user’s default email application will automatically open when the email is clicked.

Divi gives you the option to add social icons to the header and footer of your website through the Appearance->Customize->Theme Settings options panel. You can then add/remove individual icons through the epanel. But the only options are for Facebook, Twitter, Google+ and RSS. If you want to add LinkedIn or other icons, you’ll have to add the code yourself which is pretty easy.

This tweak changes the URL structure of Divi Projects from /projects/ to whatever you want like /photos/. It’s an easy fix that requires little effort but a lot of code. You can take a shortcut that makes this tweak super easy, but not future proof. I would recommend the long version, especially if this is for a client’s website.