Category: Divi

Divi – Adding a hover overlay to the blog module

I’m actually pretty happy with this one. The main problem with making this in Divi is the HTML structure. Usually, if you want to superimpose a layer on top of an image, you’re going to need two distinct divs and give them absolute positioning. But the Divi blog module doesn’t have this. All the elements […]

Course – Learn CSS for Divi

Don’t know anything about CSS? Just a beginner? No worries! With this online course, you will become an advanced CSS coder with 14 hours of comprehensive videos on using CSS for Divi!

Divi – A section above the main header

This is a cool way to add a whole section (or layout if you wish) above the main navigation and then have it stick to the top during scroll. It’s pretty cool. Preview This is what it looks like: View post on imgur.com   You need this To start with, go get the child theme, […]

Divi – overlaying module on hero section

Here’s how you can make a module stick to the bottom of the hero section. This would be helpful for things like newsletter signups, special notices (without using a popup), and contact forms. The object We’re going for a layout something like this:   The Video Note: It’s a bit long, but I go through […]

Divi – blurb text overlay

Here’s how to get the text over images in two simple steps

Divi – transparent header only on home page

What if you wanted a different header color JUST for the home page? This is the snippet you’ll need. [sc name=”customcss”]   Of course, you can change the colors easily by swapping out the ‘transparent’ to something else. Cool, I’ll just sign off with just that. Maybe I should get into dissecting the header sometime.. […]

Divi – Change the look of the default blog page

Divi’s default blog archive page isn’t necessarily outdated, but it’s a bit boring for people like us who use Divi all the time. The Project I got a request from a guy who reached out wanting some help with styling his blog, and he wanted it to look like these guys: The Problem Although it […]

Divi – Logo overlapping both header rows

Here’s a really simple way of making a header with a logo that overlaps both header rows. With JUST CSS. So it’s pretty neat. Background I had a tutorial request for this header: It’s a nice funky site. If you want to check it out yourself, go ahead. It’s made with Divi, and there’s been […]

Divi – 5 column gallery on desktop and 2 on mobile

This article will be about styling the Divi Gallery module. By default, the Divi Gallery has 4 columns on desktop and 1 column on mobile. But in this tutorial, we will make it have 5 columns on desktop and 2 on mobile. We will achieve this by using some custom CSS code. The first thing […]

Divi – Scroll on hover

A Divi tutorial on how to make an image scroll on mouse hover. A great way to show web mockups and stuff for your portfolio.

Marx Creative on the Divi showcase Feb 2019!

If you didn’t know, I work at a design agency in south east QLD (Australia) called Marx Creative that does really great design. I’m the lead web developer (digital designer by title since I do other digital stuff too, like video editing) at Marx Creative. I develop most of the websites we design, and the […]

Divi tip – Add link to phone number in top header

You know the phone number in the top header? Yeah, let’s get that to link to a phone number automatically.