Using JQuery in my Theme: Moodle 3.3

Using JQuery in my Theme: Moodle 3.3

by Dave Emsley -
Number of replies: 7

Hi There,

I'm a little confused with the way to use JQuery in a Moodle theme at the moment.  For Moodle 3.3 there seems to some guidance here https://docs.moodle.org/dev/jQuery#How_to_use_JQuery but it is not clear.

The page says "To make use of JQuery, either list it as a dependency of your module, or use a require call to load it" and then gives some code snippets as examples.  Unfortunately it doesn't say WHERE I need to inlcude the code snippets if someone could point me in the right direction please?

Cheers

Dave

Average of ratings: -
In reply to Dave Emsley

Re: Using JQuery in my Theme: Moodle 3.3

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

It does say where as there are the words "see Javascript Modules" which links to https://docs.moodle.org/dev/Javascript_Modules.

In reply to Gareth J Barnard

Re: Using JQuery in my Theme: Moodle 3.3

by Dave Emsley -

Thanks for the response Gareth but that document is also unclear. It wants to use "grunt" and wants that installing onto the server.  Not something that I always have control over.

It also seems to want minified code in the /amd/build folder if I have got that right.  In which case are these the ones that are used?  Or, if absent, does it use the full-fat version?


Cheers
Dave



In reply to Dave Emsley

Re: Using JQuery in my Theme: Moodle 3.3

by Gareth J Barnard -
Picture of Core developers Picture of Particularly helpful Moodlers Picture of Plugin developers

Hi Dave,

Ok, on your development server (that you should have full control over) install Grunt.  This makes the 'build' from the 'src'.  On the production server you don't need Grunt as you 'install' the theme with the 'build' folder containing the JS files.

G

In reply to Gareth J Barnard

Re: Using JQuery in my Theme: Moodle 3.3

by Andrea Nenci -

I read fast that article.

Now the question is, there's a way to include personal JS and third party script without create a module? I think it's a very annoing thing, i only need to include a library and use it with 3 line of code, in only one page of my moodle

In reply to Andrea Nenci

Re: Using JQuery in my Theme: Moodle 3.3

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

Hi, Depending on the Moodle version and the Parent theme you are intending to use (assuming it is NOT Boost theme), then you can add the custom files in a JavaScript directory of your theme and add the three lines of code in the layout file/s where you wish the JS call to be made.

Don't forget to add the required setting in your Theme's config.php...

$THEMES->javascripts = array('mycustomjsfilename');

Or this line if it's a .min file...

$THEMES->javascripts_footer = array('mycustomjsfilename');

Where 'mycustomjsfilename' is the name of your js file.

Hope this helps?

PS: https://moodle.org/mod/forum/discuss.php?d=352246

Thus is a link to a previous post from last year, which explains how JQuery/JS works in Boost theme...!!!

Mary

EDITED to make this more readable.

In reply to Mary Evans

Re: Using JQuery in my Theme: Moodle 3.3

by Andrea Nenci -

The Moodle version is 3.3 and the Theme is boost, unfortunatly 

I'll just see and try the solution you linked withut fortune, but maybe i'd made something wrong

In reply to Andrea Nenci

Re: Using JQuery in my Theme: Moodle 3.3

by Mary Evans -
Picture of Core developers Picture of Documentation writers Picture of Peer reviewers Picture of Plugin developers Picture of Testers

Please don't struggle, if you want help, we can help you fix things!

At the moment we are all learning and if Moodle has omitted to add new updates to its Moodle Documents, then we can certainly push them to do those up-dates.

Mary