JQuery Plugin

General ShopSite user discussion

JQuery Plugin

Postby azrac » Mon Jun 25, 2012 11:09 am

Hi,

I am trying to use JQuery Plugin for some picture slide show. I have followed all the instructions which are simple... but it is not working on my website.
All the css and js files are in publish dir.
Is there something that I am missing?

Thank you.
azrac
 
Posts: 45
Joined: Wed May 30, 2012 6:50 pm

Re: JQuery Plugin

Postby BFChris » Mon Jun 25, 2012 11:18 am

I think we need more information. Sample page? Version of Shopsite, etc?
~~Barefoot Chris
--------------------------------
Barefoot Chris Web Design
www.barefootchris.net
--------------------------------
BFChris
 
Posts: 322
Joined: Mon Oct 09, 2006 3:28 pm
Location: PA

Re: JQuery Plugin

Postby azrac » Mon Jun 25, 2012 2:49 pm

I have ShopSite Manager. I am using Custom Template.All I need to do is to put this plug in ... where the content of page is suppose to go.

Thank you.
azrac
 
Posts: 45
Joined: Wed May 30, 2012 6:50 pm

Re: JQuery Plugin

Postby Jim » Mon Jun 25, 2012 3:21 pm

How are you referencing the code? Make sure that you are are calling it from your.domain.com/.../publish/ where the ... may be a directory such as store or shop or may be empty if you store is at the root of your domain.

The code should go in a number of different places, the page template ; in one of the text fields, (text 1, text 2, text2) for the page; the meta description field; or if it will be on all of your pages you and you are using the global header in your template, it could be placed in the Preferences > Layout Settings > Header.

If you use the meta description area see this kbase article for how to add additional content http://support.shopsite.com/KBase/questions/1974
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Re: JQuery Plugin

Postby azrac » Mon Jun 25, 2012 4:08 pm

Jim,
I am not sure I understand what you are talking about.
I have created a new template that will have jquery plugin slider... here is the code... this works on my web server.
Also I have uploaded all the files into the publish directory. Is there a way of creating folders in publish ?
THANK YOU.
[--DEFINE LINK_TO_PAGE--]
# This define is used to control how the link to this page will
# look on other pages
[--END_DEFINE LINK_TO_PAGE--]

[-- DEFINE PAGE --]
<html>
<!DOCTYPE html>

<html>
<head>
<title>Collection</title>


<link rel="stylesheet" href="[--OUTPUT_DIRECTORY_URL--]/publish/nivo-slider.css" type="text/css" media="screen" />
<link rel="stylesheet" href="[--OUTPUT_DIRECTORY_URL--]/publish/default.css" type="text/css" media="screen" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="[--OUTPUT_DIRECTORY_URL--]/publish/jquery.nivo.slider.pack.js" type="text/javascript"></script>

</head>

<body>


<div class="slider-wrapper theme-default">
<div id="slider" class="nivoSlider">
<img src="media/collection/collection_1.jpg" alt="" title="Maxi Beige Dress By AMNA"/>
<a href="http://dev7studios.com"><img src="media/collection/collection_2.jpg" alt="" title="Maxi Beige Dress By AMNA" /></a>
<img src="media/collection/collection_3.jpg" alt="" title="Maxi Beige Dress By AMNA" />
<img src="media/collection/collection_4.jpg" title="Maxi Beige Dress By AMNA" alt="" />
</div>
</div>
<div id="htmlcaption" class="nivo-html-caption">
<strong>This</strong> is an example of a <em>HTML</em> caption with <a href="#">a link</a>.
</div>
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider();
});
</script>

</body>
</html>

</html>
[-- END_DEFINE PAGE --]
azrac
 
Posts: 45
Joined: Wed May 30, 2012 6:50 pm

Re: JQuery Plugin

Postby Jim » Mon Jun 25, 2012 4:39 pm

Can you use a browser and show the contents of the files you are trying to load?
I.E. "[--OUTPUT_DIRECTORY_URL--]/publish/nivo-slider.css" and "[--OUTPUT_DIRECTORY_URL--]/publish/jquery.nivo.slider.pack.js" by replacing the [--output_directory_url--] part the actual url? You should be able to display the code in your browser window from those urls.

You can create subdirectories of the publish directory but you need to do if through ftp or ssh, ShopSite will not create them. Make sure that if you upload the files by ftp that they have the same ownership and permissions as files uploaded or created from the backoffice of ShopSite. The webserver user should have read and possible write access to the files and directories. If it doesn't it won't be able to access the files to display them on the page.
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Re: JQuery Plugin

Postby azrac » Mon Jun 25, 2012 4:56 pm

Yes, I am able to see those files in the browser.
azrac
 
Posts: 45
Joined: Wed May 30, 2012 6:50 pm

Re: JQuery Plugin

Postby Jim » Tue Jun 26, 2012 10:06 am

What browser are you using? If you have a debug mode (such as firebug in Firefox) Try turning on debug and see if that help see what is happening.
Is you domain the same for both the secure and non-secure urls with the exception of the http and https or is the secure domain for a different website and is being shared?

What version of ShopSite are you using? Version 11sp2 includes jquery code automatically and maybe it is conflicting with what you are trying to use.
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Re: JQuery Plugin

Postby azrac » Tue Jun 26, 2012 5:09 pm

Hi again.

Maybe. I have Shopsite Manager... how do I find out the version I am using? I am new to all this... started using it a month ago, so I must have the newest version.
If JQuery plugin is included how do I included it in my web site? I've tried ShopSite Help with the jquery but I haven't found it. Please let me know. And thanks for all your help.
azrac
 
Posts: 45
Joined: Wed May 30, 2012 6:50 pm

Re: JQuery Plugin

Postby azrac » Tue Jun 26, 2012 5:16 pm

I am using Safari and Chrome... I turned on debugger on Chrome and this is what I got....

Uncaught SyntaxError: Unexpected token [ jquery.nivo.slider.pack.js:10
Uncaught TypeError: Object [object Object] has no method 'nivoSlider' collection.html:39
(anonymous function) collection.html:39
f.event.dispatch jquery.min.js:3
f.event.add.h.handle.i

I keep all the css and js in publish and images in media/images
azrac
 
Posts: 45
Joined: Wed May 30, 2012 6:50 pm

Re: JQuery Plugin

Postby Jim » Tue Jun 26, 2012 10:58 pm

You can find the version and product level that you store is running by going to the backoffice (merchant interface) of you store and clicking on the ShopSite image at the top left of the navbar. In the footer between the 2 logos it will list the version, product type and storeid for your store. Note ShopSite would only be adding jquery if you have ShopSite 11 sp2 r2 or greater which is the latest version so if you have ShopSite 11 sp1 or 10sp2, 10sp1 etc you won't have any ShopSite Jquery.

I don't know much, if anything about jquery (or javascript for that matter), so I don't know if I can be of much more help. Maybe someone in the forum will chime in on this issue. Based on the error message of Syntax error check for missing quotes, braces, punctuation etc around where the code reported as bad is found, i.e. [ jquery.nivo.slider.pack.js:10 Should there be a closing } ?

Are you using any ShopSite template tags in your jquery code? If so you need to make sure you specify the PROCESS option in the include statement that is calling the jquery code or the template tags will not be evaluated.
Jim
Site Admin
 
Posts: 4953
Joined: Fri Aug 04, 2006 1:42 pm
Location: Utah

Re: JQuery Plugin

Postby azrac » Wed Jun 27, 2012 4:52 am

Yes, I have the latest ShopSite. How do I call this query within my site?

I am calling the jQuery from the Text1(HTML and Javascript) of the page.
azrac
 
Posts: 45
Joined: Wed May 30, 2012 6:50 pm


Return to User Forum

Who is online

Users browsing this forum: No registered users and 63 guests