![Divi layout – Image hover effect](https://yatesdesign.com.au/wp-content/uploads/image-hover-layout-1080x631.jpg)
Divi layout – Image hover effect
The image module hover effect tutorial has been far & away the most popular post on yatesdesign.com.au. Adapted from Codrops' "Ideas for Subtle Hover Effects" it's a nice way to display links and images. I've been meaning to...
![Divi secondary menu customisations](https://yatesdesign.com.au/wp-content/uploads/torquay-smc-1080x631.png)
Divi secondary menu customisations
Divi's secondary menu is great for displaying important information to your site's visitors. I use this layout on a lot of sites, recently on Torquay Sports Medicine Centre's site I used it to make sure that contact details and...
![Divi Tutorial – create a full width call to action button](https://yatesdesign.com.au/wp-content/uploads/fullwidth-cta-1080x630.gif)
Divi Tutorial – create a full width call to action button
At the bottom of each page on yatesdesign.com.au I've got a button that reads "Ready to launch a new project? Let's work together →". It's a full width button that changes colour on hover and I get asked about it often so here's a...
![Divi Tutorial – The Final Countdown](https://yatesdesign.com.au/wp-content/uploads/fb-share-final-countdown-1080x630.jpg)
Divi Tutorial – The Final Countdown
After seeing Andy Tran's article on The Best Hidden Feature of Divi, I decided I'd try and build something using inline JS, HTML & CSS to test Divi's code module out. I really hadn't used the code module at all and it didn't...
![Divi Tutorial – Blurb Cards](https://yatesdesign.com.au/wp-content/uploads/share-yates-design-blurb-cards-1080x630.jpg)
Divi Tutorial – Blurb Cards
This is an idea I had for the services section of the front page of yatesdesign.com.au that I didn't end up using. It uses Divi's blurb module to handle the card and icon and the button module to turn the entire card into a link....
![Divi Tutorial – Image module hover effect](https://yatesdesign.com.au/wp-content/uploads/yatesdesign-divitutorial.jpg)
Divi Tutorial – Image module hover effect
I've posted an updated version of this tutorial with an easy to download layout file and a few extra options.Divi's 3.0.49 update seems to have broken this effect. To fix it add this code to your CSS: .border-hover...
![Divi tutorial – Blurb Module hover effects](https://yatesdesign.com.au/wp-content/uploads/yatesdesign-hover-effects.jpg)
Divi tutorial – Blurb Module hover effects
This is a hover effect that I used on the front page of yatesdesign.com.au. In those blocks I used Font Awesome icons as I needed a Drupal icon. In the following tutorial, I'll use the Divi Blurb module to make things a little...
![Divi tutorial – reveal footer on scroll](https://yatesdesign.com.au/wp-content/uploads/divi-footer-reveal.gif)
Divi tutorial – reveal footer on scroll
When redesigning yatesdesign.com.au I wanted to add this curtain reveal effect to the footer of the site. It's a fun effect & relatively easy to do. Scroll to the bottom of this page to take a look. The effect is done...