How to fix “Uncaught TypeError: $ is not a function” in WordPress

The “Uncaught TypeError: $ is not a function” error in WordPress usually occurs when you are using jQuery in your custom JavaScript code but have not properly defined the $ alias.

In WordPress, jQuery runs in “no conflict” mode, which means that the $ alias is not available by default. Instead, you need to use the jQuery object, or you can wrap your code in an immediately-invoked function expression (IIFE) to define the $ alias locally.

To resolve the error, update your jQuery code like this:

(function($) {
    // Your custom jQuery code here, using the $ alias
    $(document).ready(function() {
        // Your code that needs to run when the DOM is ready
    });
})(jQuery);

This code wraps your jQuery code in an IIFE and passes the jQuery object as an argument, which is locally aliased to $.

This way, you can safely use the $ alias inside the function without conflicting with other JavaScript libraries.

Update your custom JavaScript file with the above pattern and make sure your script is enqueued with jQuery as a dependency in your theme’s functions.php file. If you’re unsure how to do that, refer to previous answers on including jQuery and enqueuing custom scripts in a WordPress theme.

Remember to always backup your files before making any changes, and test your changes on a staging site or local development environment before applying them to your live site.