Zen Cart Logo
Forums / Templates, Stylesheets, Page Layout / Run Custom Jquery for a particular category

Run Custom Jquery for a particular category

Views: 2,041

Results 1 to 4 of 4
24 Apr 2012, 10:12 AM
#1
stephenconnolly avatar

stephenconnolly

New Zenner

Join Date:
Apr 2012
Posts:
19
Plugin Contributions:
0

Run Custom Jquery for a particular category

Hello,

I have a category that has an iframe. I've been able to apply some custom styling to that category by creating a new stylesheet: c_28_34.css, this works very well.

I also want to run a bit of custom Jquery code, specific to this category.

Is it possible to create a custom script that only applies to a certain category ?

Regards,
Stephen

24 Apr 2012, 10:36 AM
#2
dgent avatar

dgent

Totally Zenned

Join Date:
Nov 2009
Location:
UK
Posts:
1,117
Plugin Contributions:
0

Re: Run Custom Jquery for a particular category

Cant you just call the Jquery from the category description html so it only runs on that cat?

24 Apr 2012, 10:53 AM
#3
stephenconnolly avatar

stephenconnolly

New Zenner

Join Date:
Apr 2012
Posts:
19
Plugin Contributions:
0

Re: Run Custom Jquery for a particular category

Yes, I could do that alright, thanks for the reply.

25 Apr 2012, 3:03 PM
#4
ultimate_zc avatar

ultimate_zc

Zen Follower

Join Date:
Jun 2008
Location:
Osprey, Florida
Posts:
147
Plugin Contributions:
7

Re: Run Custom Jquery for a particular category

stephenconnolly:

Is it possible to create a custom script that only applies to a certain category ?

You have several options to run jQuery scripts for a specific category. More specifically the jQuery…

It may seem as if I'm getting of the subject but give me a chance to explain.

If you are running jQuery site wide, I would use the following code to grab jQuery from Google with a fallback if necessary:

<!-- grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<?php echo '<script type="text/javascript" src="' . DIR_WS_TEMPLATE . 'jscript/libs/jquery/1.7.1' . '/jquery-1.7.1.min.js"><\/script>'; ?>')</script>

You could add the above code to a new file named jscript_whatever.php adding it to the script folder of your custom template or even better in my opinion, add this code to your html_header.php and add it to the common folder of your custom template. Keep in mind that jQuery has to run before any "jQuery" scripts therefore, if modifying html_header.php, place it immediately after the last code for css.

You can then add a conditional code for your category to a jscript_whatever.php in your custom script folder:

<?php if ($current_page_base == 'index' and $cPath == '' or $cPath == '3') { ?>
<script type="text/javascript"> 
    $(document).ready(function () {
        // Your Code Goes Here
    });
</script>
<?php } ?>

If you are running jQuery only for that category simply combine what I just talked about to again a jscript_whatever.php in the following manner:

<?php if ($current_page_base == 'index' and $cPath == '' or $cPath == '3') { ?>
<!-- grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<?php echo '<script type="text/javascript" src="' . DIR_WS_TEMPLATE . 'jscript/libs/jquery/1.7.1' . '/jquery-1.7.1.min.js"><\/script>'; ?>')</script>
    <script type="text/javascript"> 
        $(document).ready(function () {
            // Your Code Goes Here
        });
    </script>
<?php } ?>

Hope that helps...