Page 1 of 1

Need help with jquery

Posted: Fri Oct 07, 2011 4:09 am
by 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.

Re: Need help with jquery

Posted: Fri Oct 07, 2011 10:16 am
by 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.

Re: Need help with jquery

Posted: Fri Oct 07, 2011 5:26 pm
by 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...

Re: Need help with jquery

Posted: Sat Oct 08, 2011 4:47 pm
by chrisbt
Yeah. Cheers for the tip, Dr CSS. Quite obvious really now that you have mentioned it ;)
Chris