Divi Particles Really Easy in 5 Minutes

Divi Particles
There are plenty articles out there how to add an impressive particle effects to containers in Divi or any other pagebuilder. Here now, we want to do this the easiest  way possible.

Particle Effects and how to add them to Your Site

There are plenty articles out there how to add an impressive particle effects to containers in Divi or any other pagebuilder. They all are like “install this, download that, configure those” etc. Here now, we want to do this the easiest  way possible first and, maybe, go for a little more complexity later on.

I would not recommend anything to you I’ve not been using enthusiastically myself. Bold links are affiliate links. I recommend what you’ll find there and If you make a purchase, I will get a commission without additional costs to you.

Learn

Keep reading for an explanation on how to go on about it.

Keep reading

The button will take you to a step by step guide through the process.
Continue

Watch

Take a look at what this is all about and see the feature in action.

Go there

The button will take you to a project were we implemented this feature.
particles.js

Download

Get the files from GitHub immediately and for free.

From GitHub

The button will take you to GitHub were the files you need are available.
GitHub

At first you just need to copypaste everything you’ll find here into a Divi code module and give a section, row or module the CSS-ID particles. Done! Now the Divi particles should use the background of the particles element as canvas to draw upon. 

Row Settings Particles

You can then play around with colors, sizes and opacities. Or generate a whole new look here. Try replacing the old part of the script with the new configuration, if you dare.

Particles.js is a well known resource which works well with different frameworks, pagebuilders and, of course, vanilla HTML as well. Look, an Elementor HTML widget:

Adding Divi Particles is really easy, right? Copypasting one script and IDing one element. The average twelve year old could do that.

Would you like to dive a little deeper into JavaScript with Divi? You can learn how to to execute JavaScript when clicking Divi buttons here.

Share

Share on facebook
Share on twitter
Share on linkedin

Related Posts

WooCommerce SQL

Howto Manipulate WooCommerce Metadata via SQL

With Germanized on board, WooCommerce has several ways to save article numbers. Has the intern spent two days entering the EAN in the wrong field for the 3000 articles in the WooCommerce online shop? Then an SQL superhero has to save the day who can copy content from one field to another in no time.

eCommerce Sales

5 eCommerce Lockdown Tips

eCommerce is booming because since Corona everyone understands the importance of online stores and digitization. We have been supporting online stores since the beginning of the millennium, when you still had to program them yourself, and we would like to tell you here how your eCommerce tools can make good sales and keep you afloat in a crisis.

GET IN TOUCH

Contact.