Watch the complete video overview 👇
Using The Code Snippets Library
Whenever you are using a code editor in Divi, you will notice some new icons at the top of the interface. You can use them to save code to your library, add code from your library, or import and export code to and from the code editor. It works like just the Divi Layouts Library and the recently-added Divi Theme Builder Library.
Saving Code To Your Library
If you want to save a snippet to your library, click the Save To Library icon to save all of the code currently in the code editor. Or, use your mouse to select the specific code within the editor that you would like to save, and then click the Save To Library icon to save only the code you have selected. You can also toggle the Save To Divi Cloud option to sync the snippet to the cloud.
Adding Code From Your Library
To add code from your library, click the plus icon to view all of your saved code snippets. You can use, organize, edit, delete, duplicate, and import and export snippets from your library within this popup. As you can see, the code snippet I just saved is now available in my library, synced to the cloud, and it will be waiting for me here the next time I want to use it.
Editing And Managing Code In Your Library
All of your code snippets can be managed within the library popup. Click the triple dot icon to edit, rename, tag, categorize, duplicate or delete a code snippet.
Building Your Code Snippets Collection
The Divi Code Snippets library is useful in many situations. If you search Google for “divi code snippets,” you will find all kinds of snippets that designers commonly use to customize the appearance and functionality of Divi, whether that be via a Child Theme or Divi’s code options. Here are just a few resources I found:
- Divi And WordPress Snippets by WP Zone.
- Divi Code Snippets Library by Divi Builder Addons
- CSS Code Snippets for Divi Buttons
- Equalize your Blog Grid column height
- Vertically Center Any Content In Divi
- Create A Skinny Divi Email Optin Form
- 10 Useful Code Snippets for your Divi Menu Mobile
- Index of Handy Divi Snippets by Divi Dezigns
- The Snippets Library For Divi by Astuces Divi
- Divi Snippets Archive by Divi Theme Examples
- Divi Snippets And Hacks by Quiroz.co
- Useful Divi CSS Snippets For Every Project
- 10 CSS Snippets Every Divi Site Should Use
- 5 Simple CSS Snippets To Customize Divi Mobile Menu Bar
- How To Make Any Non-Divi Button Look like A Divi Button
- Six Tips for a Better Divi Mobile Menu
Now, you can save those snippets, organize them in your library and sync them to the cloud. Each time you start a new website, your favorite snippets will be waiting for you!
Get Started With Divi Code Snippets
The Divi Code Snippets library is available today, so update Divi and let us know what you think in the comments. Stay tuned for more great Divi features coming soon, and don’t forget to follow and subscribe so that you can be the first to know when our next Divi feature is released. I always give a detailed look into each feature and it’s a great way to get up to speed before you update your website. If you are running your websites on Divi, these are posts you really don’t want to miss.
Get 10% Off Today!
Today's The Best Day To Get Divi Or Upgrade Your Account To Lifetime
Join the most enthusiastic and loving WordPress theme community on the web and download Divi today. Using the new Visual Builder, you can build websites faster than ever before with its incredibly fast and intuitive visual interface. You have to see it to believe it!