Prestashop JCarousel Module

Hi Friends,

I've found a jQuery Carousel (by Jan Sorgalla) and have converted as a prestashop module. This module is currently being used on www.giftlelo.com. (Gift Le Lo is a hub of fashion designer's products and handmade items. Anyone can join gift le lo.)

What is this?

Well... This module is carousel, as the name suggest; a continuously revolving images.

How to install?

  • Download "jcarousel.zip" and save it wherever you want.
  • Extract "jcarousel.zip" and copy "jcarousel" folder to your shop's module directory. (you can find slides, assets etc folders inside jcarousel folder)
  • Go to Admin Panel and click on "Modules" Tab
  • You can find "jcarousel module" inside Home section
  • Click on "Install" button and you are done.

How to display my images?

Very easy! you need to open "modules/jcarousel/jcarousel.tpl" file. you can find these below code. Replace images path with your images path.


    <li><a href="manufacturer.php?id_manufacturer=3"><img src="{$module_dir}slides/Slide1.jpg" alt="" width="533" height="260" border="0" /></a></li>
    <li><a href="manufacturer.php?id_manufacturer=3"><img src="{$module_dir}slides/Slide2.jpg" alt="" width="533" height="260" border="0" /></a></li>
    <li><a href="product.php?id_product=17"><img src="{$module_dir}slides/Slide3.jpg" width="533" height="260" alt="" /></a></li>
    <li><a href="product.php?id_product=14"><img src="{$module_dir}slides/Slide4.jpg" alt="" width="533" height="260" border="0" /></a></li>
    <li><a href="manufacturer.php?id_manufacturer=3"><img src="{$module_dir}slides/Slide7.jpg" alt="" width="533" height="260" border="0" /></a></li>
    <li><a href="product.php?id_product=26"><img src="{$module_dir}slides/Slide5.jpg" width="533" height="260" alt="" /></a></li>
    <li><a href="product.php?id_product=17"><img src="{$module_dir}slides/Slide6.jpg" alt="" width="533" height="260" border="0" /></a></li>

How to change image size

If you have some css knowledge you can easily change. open "modules/jcarousel/assets/jquery.jcarousel.css" & "modules/jcarousel/assets/skin.css". Find height/width attributes and change accordingly.

Statutory Warning!

It might not work if you have another jcarousel module enabled for homepage.

Example:

Demo in action! (opens in a new window)

You want it? Download!



AttachmentSize
jcarousel.zip348.63 KB