isotropic-2022
Share
Blog
Search
Menu

How To Fix TypeError: $ is not a function on line... in Oxygen Builder

By James LePage
 on December 11, 2020
Last modified on January 6th, 2022

How To Fix TypeError: $ is not a function on line... in Oxygen Builder

By James LePage
 on December 11, 2020
Last modified on January 6th, 2022

This article shows you how to fix TypeError: $ is not a function on line 1 (or any line) in Oxygen Builder.

Luckily this is a really simple fix, and it's caused by WordPress itself.

text

Whenever you add any jQuery code to Oxygen (via the JS section of a Code Block), this error will trigger because WordPress does not recognize jQuery well. Despite that issue, it does support jQuery, and it comes pre installed on the CMS. All you need to do is make it easy for WP to understand that you do, infact, want to use jQuery code on you Oxygen Builder Code Blog.

Here’s how to fix it. On a simple chunk of jQuery code, simply swap the $ for jQuery. Here’s an example:

Original: $('.my-paroller').paroller();
Oxygen Builder Compatible: jQuery('.my-paroller').paroller();

For longer jQuery in an Oxygen Builder Code Block that’s toggling the “TypeError: $ is not a function” error, use this:

(function($) {YOUR CODE})( jQuery );

That should solve your problem.

Subscribe & Share
If you liked this content, subscribe for our monthly roundup of WordPress news, website inspiration, exclusive deals and interesting articles.
Unsubscribe at any time. We do not spam and will never sell or share your email.
Subscribe
Notify of
guest
4 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Jeff K.
3 years ago

Hi
It works wonderfully, the error message has disappeared.

Many Thanks! you are our hope.
I am very happy there are people like YOU who take the time to help others.
You are an idol..

Julian
Julian
1 year ago

Hi James,

please could you explain it to me?
I just have to replace all "$" with "jQuery"? I've been trying for ages to add a position aware button, but unfortunately I can't. maybe you have tips for a good procedure

see here: https://codepen.io/kkick/pen/oWZMov

I also tried changing the background color of the button. However, this negates the javascript effect. maybe you have some tips for me 🙂

Bang
Bang
1 year ago

Hey, thanks for the solution, but what if i get a "JQuery is not defined" in the code block?

Article By
James LePage
Contributors/Editors
notloggedin
James LePage is the founder of Isotropic, a WordPress education company and digital agency. He is also the founder of CodeWP.ai, a venture backed startup bringing AI to WordPress creators.
We're looking for new authors. Explore Isotropic Jobs.
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram