One of the greatest advantages to Divi is the vast amount of tutorials available across the web. If there’s something you want to learn how to do with Divi, chances are there’s a tutorial for it. In this article we’ll take a look at 9 Divi theme tutorials to transform your Divi site.

1. How To Create A Stylish Inline Bloom Optin

Learn how to style your inline Bloom optin with a transparent background overlay and rounded submit button. It uses styling and custom CSS for the Bloom form, and a fullwidth code module with section styling.

See the Tutorial

2. How to Add Icons to Your Divi Menu

How to Add Icons to Your Divi Menu

In this tutorial, Josh Hall shows you how to add icons to your Divi menu. While there are numerous ways to achieve this specialized menu effect, you’ll learn how to do it without the use of plugins, font awesome, or unneeded imported images. Follow along with the video and use the code provided on the page to easily add icons to your Divi menu.

See the Tutorial

3. Creating a Divi 404 Page

This tutorial teaches how to make a 404 page using a Divi page without the need of a plugin. It shows how to create a message by creating a file called 404.php, how to find the post ID, and where to place code that will insert the layout into the 404 page using your layout ID. It’s primarily focused on PHP. It also covers why you need a 404 page.

See the Tutorial

4. 5 Unique Button Styles You Can Achieve With Divi’s Button Module

As the title suggests, this tutorial covers five different button styles. It mostly covers styling adjustments made within the module and adding custom CSS. It teaches how to change the shape, using the image module with the button module, using two button modules together to create a double-sided button, adding a background image, and integrating the button within an image. All of the CSS is included so you can copy and paste.

See the Tutorial

5. 5 Fun Ways to Style Divi’s Blurb Module

This tutorial covers five interesting styles for the blurb module. It mostly focuses on settings within the blurb module and custom CSS. Styles include a centered color blurb, a circle blurb with CSS, side by side blurbs with icons, creating a blurb grid, and adding hover animation. All but the first blurb uses custom CSS, which is included so you can copy and paste.

See the Tutorial

6. How to Add More Social Media Icons to Divi

Divi normally only has the three top social networks for the header and footer areas. This tutorial shows how to add more social icons using PHP to your child theme. It includes both a text version and a video version of the tutorial with code that you can copy and paste, which includes the list of social networks you can add. It also shows how to upload the file and create the folder for it using FTP.

See the Tutorial

7. How to Create a Scrolling Image Carousel in Divi

This tutorial creates a scrolling image carousel that’s great for displaying icons of clients, projects for your portfolio, photos, or anything else you can place the image module. It uses custom CSS and section and row styling. The scrolling is accomplished through the animation effect that’s built in CSS. The code is provided, with different code depending on the number of images you want to display, and you can download the layout as a JSON file if you want.

See the Tutorial

8. How to add an Animated Typing Effect to Your Divi WordPress Theme

This is a video tutorial that covers how to add a typing effect to your text using the Typed Js plugin. It shows how to use the Divi modules to add Google fonts, using Developer Tools to identify the cursor ID to manipulate the design of the cursor using CSS, and where to place the code within Divi. It also shows how to change the cursor to a different character using HTML.

See the Tutorial

9. Create a Full Width Call to Action Button

Learn how to create a full-width CTA button that changes color on hover. It uses styling for the row with custom CSS for the module to create the effect. It includes the CSS so you can copy and paste. It also includes the JSON file if you want to download it.

See the Tutorial

Ending Thoughts

If you want to transform your Divi site, these 9 tutorials are a great place to start. A lot can be learned from these tutorials. They demonstrate how to use the Divi modules to style your elements, the proper way to use CSS, how to add PHP, uploading files via FTP, using Developer Tools, and much more.

We want to hear from you! Which of these Divi tutorials is your favorite? Let us know in the comments.

Get Email Updates (It's Free)

No spam ever. Only Divi related updates. You need this.

Pin It on Pinterest

Shares