Divi & WordPress Resources

I occasionally design and share free layouts and write up CSS-based tutorials to help others with their Divi websites, hope you find something useful!

All demo sites are running Divi 3.29.3 and WordPress 5.2.3 (Gutenberg), I wait a minimum of one week before updating each version. Note that I use the classic backend builder so that’s what any pertinent screenshots are of.

Logo as Fixed Divi Mobile Menu Button (Default Header + Centered Inline Formats)

Logo as Fixed Divi Mobile Menu Button (Default Header + Centered Inline Formats)

Customize the Default WordPress Footer Layout with CSS Grid

Customize the Default WordPress Footer Layout with CSS Grid

Use the Divi Builder Inside WooCommerce Single Product + Free Layout

Use the Divi Builder Inside WooCommerce Single Product + Free Layout

Free Divi Blog Grid Look + Category, Tag, Search Results

Free Divi Blog Grid Look + Category, Tag, Search Results

Custom Image Hover Boxes Using the Divi Code Module

Custom Image Hover Boxes Using the Divi Code Module

Custom Side / Vertical Tabs Section Layout for Divi

Custom Side / Vertical Tabs Section Layout for Divi

Change “Submit a Comment” Title and Add Extra Copy

Change “Submit a Comment” Title and Add Extra Copy

Reorder WooCommerce Product Title and Price

Reorder WooCommerce Product Title and Price

Customize the WooCommerce Shop Grid (Look 2)

Customize the WooCommerce Shop Grid (Look 2)

Customize WooCommerce Cart, Checkout, and Account Pages

Customize WooCommerce Cart, Checkout, and Account Pages

Make WooCommerce Product Images Fullwidth

Make WooCommerce Product Images Fullwidth

Divi + WooCommerce Single Product Page CSS Styling

Divi + WooCommerce Single Product Page CSS Styling

Capitalize WooCommerce Headings and Buttons

Capitalize WooCommerce Headings and Buttons

WooCommerce Shop Grid CSS Styling (Look 1)

WooCommerce Shop Grid CSS Styling (Look 1)

Remove Divi Hover Arrows from All WooCommerce Buttons

Remove Divi Hover Arrows from All WooCommerce Buttons

Custom Pricing Tables Using Images and Font Awesome 5

Custom Pricing Tables Using Images and Font Awesome 5

Gravity Forms CSS Styling – Misc. Looks

Gravity Forms CSS Styling – Misc. Looks

Caldera Forms CSS Styling – Misc. Looks

Caldera Forms CSS Styling – Misc. Looks

Make Your Entire Divi Site Wider on Mobile

Make Your Entire Divi Site Wider on Mobile

Make Your Divi Slider Wider on Mobile

Make Your Divi Slider Wider on Mobile

Stop Button Text From Showing Up Divi Blue

Stop Button Text From Showing Up Divi Blue

Add Text to Monarch Popup

Add Text to Monarch Popup

Hide Elements That Stretch Your Website

Hide Elements That Stretch Your Website

Center Align Divi Fullwidth Header Buttons on Mobile

Center Align Divi Fullwidth Header Buttons on Mobile

Blog Grid with Categorized Colors (Background or Top Border)

Blog Grid with Categorized Colors (Background or Top Border)

Side By Side Customizable HTML Buttons

Side By Side Customizable HTML Buttons

Social Media Follow on Left Sidebar (like Monarch)

Social Media Follow on Left Sidebar (like Monarch)

Use a Blurb as a Fixed Click-To-Call Button for Mobile

Use a Blurb as a Fixed Click-To-Call Button for Mobile