As a Divi developer, you may sometimes need to add custom code to your Divi theme. While it's possible to add it via a child theme, a custom plugin, or (in some cases) Divi's various options, these may not always be the most convenient method. To add custom code to the Divi Theme and manage it in a single location, you can use the free Code Snippets plugin for PHP code, or the premium Code Snippets Pro plugin for JavaScript, CSS, and HTML code. Both plugins offer an easy way to organize your code and keep things in order.

Note: Code Snippets is not to be confused with my own Divi Code Snippets module (which is designed for displaying, not running, code).

Adding PHP Code to the Divi Theme using Code Snippets

Divi itself doesn't include a way to add PHP code to your site. While it's possible to add PHP code using a child theme or custom plugin, these methods can be difficult for non-developers to set up or manage. Similarly, they may be overkill if you just want to try out a quick code snippet to your site.

This is where the Code Snippets plugin comes in handy. It offers an easy and organized way to add custom PHP code to your Divi theme. Code snippets can automatically load on the front-end or can be added to specific pages, posts or categories. You can also activate them / deactivate them at the click of a button, useful for time-limited code such as that relating to seasonal promotions.

Here's how you can use Code Snippets to add PHP code to your Divi Theme:

1. Install the Code Snippets plugin from the Wordpress Plugin Repository.
2. Activate the plugin, and then navigate to Snippets > Add New in your WordPress dashboard.
3. Give the snippet a title and then add the desired PHP code.
4. Select "Only run on site front-end" if you want the PHP code to run only on the front-end of the site, or "Run snippet everywhere" if you want it to run on both the front and back-end.
5. Save and activate the snippet.

That's it. You've now added custom PHP code to your Divi site using Code Snippets.

Adding JavaScript / CSS to the Divi Theme using Code Snippets Pro

Divi includes a range of places where you can add CSS and JavaScript code, for example:

• The "Divi > Theme Options > General > Custom CSS" option
• The "Divi > Theme Options > Integration" options
• The built-in Code Module
• The Divi Code Snippets feature
• The Custom CSS option in individual Page / Post settings
• The Custom CSS options in the Advanced Tab of modules

For many, some combination of these options will suffice. However, as the number of code snippets added increases, it can be come hard to keep track of and manage them. If you'd rather have (or give your clients) a central point for managing CSS and JavaScript code snippets (in addition to PHP code), then Code Snippets Pro may be the ideal solution.

Code Snippets Pro, the premium version of the standard Code Snippets plugin, adds the ability to add and organize JavaScript and CSS in addition to PHP code. As with the free version, you can add your code snippets site-wide or on specific pages and posts, and can categorize your code snippets to make them easier to find and manage.

Here's how to use Code Snippets Pro:

1. Install and activate Code Snippets Pro plugin.
2. Navigate to Code Snippets > Add New in your WordPress dashboard.
3. Give the code snippet a title.
4. Choose the type of code you want to add: Scripts (JS) or Styles (CSS)
5. Add the desired code. You can also use the code editor to write your code.
6. Select "Only run on site front-end" if you want the PHP code to run only on the front-end of the site, or "Run snippet everywhere" if you want it to run on both the front and back-end.
7. Save and activate the snippet.

If you're interested in using Code Snippets Pro, use the discount code "divibooster" to get 10% off your purchase.