Hey Friends,
Where do you write your JavaScript when designing websites with Divi? Earlier I used to put them inside head element using <script> tags. But when the code becomes bigger, it’s ready difficult to manage the code as we have a little space inside. In this tutorial I’m going to talk about writing custom CSS and java scripts to add social media icons to Divi website.
It was the same for CSS, Although Divi comes with a separate section to add custom CSS it becomes very difficult to edit when you have lots of CSS in there.
Therefore, I have been trying different plugins to overcome this issue and a way to split my big JavaScript codes into small parts, like we do when creating a custom website without WordPress.
After a couple of hours of searching and research, I was able to find a nice plugin that does exactly what I wanted. It’s called Simple Custom CSS and JS.
Add JavaScript
Let’s install the plugin. Go to Plugins -> Add New and search for “simple custom CSS and js”. Then the plugin will appear as below.
Click the “Install Now” button and activate it. Next on the WordPress sidebar, a new Item will appear as “Custom CSS & JS” with a + icon in Infront of it. Hover over it and click the “Add Custom JS” link. It will take you to a page like below. You can give the code any name.
Please remember to remove all the comments before you enter any code and make sure you enter your JavaScript code inside WordPress jQuery no conflict wrapper.
Next, make sure you change “Where on page” on the right side to “Footer” and keep other settings as it is and click “Publish”.
Add custom CSS code
This plugin can also be used to write custom CSS on WordPress. The process is pretty much the same as we added JavaScript. Hover over the “CSS& JS” item on the left sidebar and click “Add Custom CSS”.
Here make sure you select the “Where on page” setting on the right sidebar to “Header”. Like we did, you can add as much as Stylesheets and JavaScript codes to add social media icons to your website as below.
I hope that although this is a short tutorial, It will be helpful for you. I will see you in the next tutorial. Till then happy Designing.
I love looking through an article that can make people think. Also, many thanks for allowing me to comment. Crystie Bay Desiree
Just wanna say that this is handy , Thanks for taking your time to write this. Ynes Wake Cosetta
Sweet web site, super design, real clean and utilise pleasant. Bette Huey Flemings