Need help with jquery

[Steve1677]

I have absolutely no idea where to begin.
I tried a bunch of stuff but nothing works.
So here's what i need ...

I installed the jquery plugin.
Now i need to know step by step (please) how to get it to work on my website. Like where to put the codes or scripts exactly to get a plugin to work.

EX: Layout>Templates>MYTEMPLATE>Content
OR
Content>Pages>MYPAGE>Content

And what do i do in (Layout>jquery) and then you have 3 tabs
Scripts, Plugins, Options

I basicaly need a really easy beginners tutorial on how to get a plugin to work.

Thanks to whoever can help me.

[chrisbt]

Hi Steve, I haven't used the cmsms jquery plugin so can't help with that. But as you haven't had any replies I thought I'd chip in with how I do the same. Adding jQuery functionality is really quite simple and can easily add some great functionality to your website. I'd recommend checking out the beginners guides on jquery.com or buying a jquery book. I'm sure you'll be hooked by the results in no time.

First create a directory under your root CMSMS directory called 'scripts'. Add your jquery plugin to this directory.

Add the following three lines into the 'head' of your page template after the '{cms_stylesheet}' tag.

Code: Select all

<__script__ src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></__script>
<__script__ src="scripts/jquery.pluginname.js" type="text/javascript"></__script>
<__script__ src="scripts/script.js" type="text/javascript"></__script>

The first line loads the jquery library from the Google CDN (recommended - cos it's faster). Version 1.4.2 (personal preference - but its widely used).
The second line is to load your required plugin. Replace 'jquery.pluginname.js' with the name of your plugin.
The third line is to load your own jquery code that makes it all happen. See below.

Using a text editor create a file in the 'scripts' directory called 'script.js', that contains the following:

Code: Select all

 $(document).ready(function() {

   // your code goes here...

   $("a").click(function() {   // this is just some test code 
     alert("Hello world!");    // to show you that jquery is working.
   });

 });

This should pop up a "Hello World" alert box whenever an <a> link is click on a page that uses this template. You will then need to remove this test code and replace it with the code you need to get your plugin working.

I hope this works for you. Let me know if I can provide any more specific advise for what you are trying to achieve. Good Luck.

[Dr.CSS]

Please note: You should be putting all extra items in a folder in uploads like uploads/jquery, not in a root folder as you can get to and work with files in uploads using file manager a lot easier than if they are in a root folder...

[chrisbt]

Yeah. Cheers for the tip, Dr CSS. Quite obvious really now that you have mentioned it
Chris