New Check out the curated list of the finest design resources I've gathered for you! Take a look →

How to Add Custom Javascript and CSS in WordPress

This guide will walk you through the process of adding custom Javascript and CSS to your WordPress website. Whether you choose to use a plugin or add the code directly to your theme, these methods will allow you to customize your website’s design and functionality.

Requirements

  • Access to your WordPress server
  • File containing the custom Javascript or CSS

Method 1: Using a Plugin

  1. Install and activate a custom CSS and Javascript plugin.
  2. Choose a plugin from options like Simple Custom CSS, Custom CSS and JS, or WP Add Custom CSS.
  3. Follow the plugin’s instructions to upload and add your custom Javascript or CSS code.

Method 2: Adding Code to the Theme

  1. Upload your Javascript or CSS file to your theme’s folder on the server.
  2. Register the file in the theme’s functions.js file.
  3. Add your custom code to your theme’s header.php or footer.php file.
  4. Consider creating a child theme to prevent code loss during future theme updates.

Wrapping Up

In this guide, we have explained two methods for adding custom Javascript and CSS to your WordPress website. Whether you prefer using a plugin or adding the code directly to your theme, these methods allow you to enhance the design and functionality of your website. We hope this article has provided you with a helpful guide on how to proceed. For more insightful tips and articles, feel free to explore my other resources.

Rizwan Aritonang

An independent WordPress & Front-End Developer from Bandung, Indonesia.

Get In Touch

Leave a Comment