Follow us

css | Divi Soup


25 awesome free Divi resources just for you!

Subscribe to receive regular emails packed with tips, tricks, tutorials, freebies, product info and promotional offers, and get instant access to 25 completely free awesome Divi resources!

We take your privacy seriously, and you can opt-out at any time.
See our privacy policy here.

R42: How to Add Shape Dividers to Any Row, Column or Module

This one has been a long time coming but I finally put the time aside, and as it’s a visual effect, this recipe is in video format! So if you wanted to add the awesome SVG shape dividers from the Divi section settings anywhere else other than a section, here is how to do it.

read more

F20: All Our Favourite CSS Snippets Swipe File

This free Divi CSS snippets swipe file contains a ton of custom CSS snippets for Divi, Woo and WordPress in general as well as fixes for some annoying little Divi quirks. Simply copy the snippet you want and paste it into your child theme stylesheet.

read more

Q17: Limit the Excerpt Length in Divi with CSS

Let’s bypass all the complex coding and use a purely CSS way to limit your excerpts in the Divi blog module!

read more

R34: How to use CSS Grid with Divi’s Feed Modules

Today I am going to show you how to use CSS Grid with Divi’s feed modules so you can display your blog, gallery and portfolio items in any number of columns with very minimal CSS.

read more

R33: How to use CSS Grid in Divi

Ever wanted to easily create a layout and define exactly where each module is placed based on the device dimensions? CSS Grid is the new kid on the block that lets you do exactly that!

read more

Q14: How to Style Specific Sections of Text

I have seen quite a few questions lately about how to style specific sections of text, either with a different colour, font or font weight etc. There are a number of way to do this, probably the most popular by using the tag, and that solution is fine. However, as... read more

Diagonal Parallax Page Layout

Diagonal Parallax Page Layout Scroll down for instructions ↓ DIAGONAL PARALLAX 1. Download the layout from the files section of the Divi Soupies Facebook Group 2. Import into a new page (not the library) DIAGONAL PARALLAX 3. Copy the CSS between the tags (not the tags... read more

Bottom Aligned Buttons Layout

Bottom Aligned Buttons Demo Unzip and import the layout into a page (not the library). All CSS is in the modules’ Custom CSS tab. Download the layout! Column 1 Vestibulum ac diam sit amet quam vehicula elementum sed sit amet dui. Button 1 Column 2 Vestibulum ac... read more

Diamond Image Section Layout

Diamond Images Section Layout Download the layout! Image Title Image Title Image Title Image Title Image Title Image Title Image Title Image Title Image Title Image... read more

R13: How to use CSS3 filters to create captivating images

Perhaps you do not know, but with CSS3 you can apply changes to images without using Photoshop or any other graphic tool. In this article, in fact, you’ll discover how easy it is to apply filters to your images using only CSS.

read more

Q2: Adding Custom Fonts with CSS

Recently quite a few people have been having issues adding custom fonts with css to their Divi website instead of using a plugin.

read more


Like us on Facebook

Enter your details below to get notified of the launch and early bird pricing

You have successfully joined the waitlist!

Pin It on Pinterest