Conveyor belt slideshow javascript for Featured Items
 

I wanted a way to jazz up the Featured Items display on my store's homepage without using Flash or orther plugins. The Conveyor Belt Slideshow javascript found on DynamicDrive.com fit the bill. The trick was to build the image array from the Featured Items in X-cart. Here are the steps to get this working:

1. Open skin1/customer/products.tpl and find
   Code:

   ---

   {if $usertype eq "C" and $config.Appearance.products_per_row ne "" and $config.Appearance.products_per_row gt 0 and $config.Appearance.products_per_row lt 4 and ($featured eq "Y" or $config.Appearance.featured_only_multicolumn eq "N")}

   ---

   and replace that with
   Code:

   ---

   {elseif $usertype eq "C" and $config.Appearance.products_per_row ne "" and $config.Appearance.products_per_row gt 0 and $config.Appearance.products_per_row lt 4 and ($featured ne "Y" and $config.Appearance.featured_only_multicolumn eq "N")}

   ---

2. Now, just above that, paste
   Code:

   ---

   {if $featured eq "Y"}
{literal}


{/literal}

   ---

3. Copy the code from DynamicDrive: http://www.dynamicdrive.com/dynamicindex14/leftrightslide.htm
   and paste it just between the {literal}s.
   
4. In the code you just got from DynamicDrive, find
   Code:

   ---

   leftrightslide[0]='[img]dynamicbook1.gif[/img]'
leftrightslide[1]='[img]dynamicbook2.gif[/img]'
leftrightslide[2]='[img]dynamicbook3.gif[/img]'
leftrightslide[3]='[img]dynamicbook4.gif[/img]'
leftrightslide[4]='[img]dynamicbook5.gif[/img]'

   ---

   and replace it with
   Code:

   ---

   {/literal}
{section name=product loop=$f_products}

leftrightslide[{counter}]='{include file="product_thumbnail.tpl" productid=$products[product].productid image_x=$config.Appearance.thumbnail_width product=$products[product].product tmbn_url=$products[product].tmbn_url}'

{/section}
{literal}

   ---

5. That's it - modify the variables in the DynamicDrive script as needed and feature some items in the store admin.

A couple of notes: I wasn't able to get this code to function both at the home-level and in subcategories (has to do with the $productid variable format changing), the thumbnail images are aligned=bottom, the images scroll right to left (negative numbers in the settings don't have the expected results). If you have questions about the code, please don't paste any of the DynamicDrive script in your message as that would violate their TOS. This was done in X-Cart Gold 4.0.17.

happy modding,
-Glen

i try it for 3.5.10 but he shows only the feature product and just 1? how can i change it that this script shows all the products on the left or right side of our site?

Sorry, but I haven't tried this in X-cart 3.5 so I don't have any suggestions for you.

Very nice!

I'd love to have a div below the conveyor belt that shows the short description of the most recently rolled-over thumbnail. I started looking into that, but other things are higher priority. If you happen to do that, please post!

- Stefan

I've tried this in 4.0.12 and although I dont get any errors I also dont get any slideshow. Any help would be gratefully received

www.acousticdevices.com

Allan

Allan-
I looked at your site and it looks like you have a simple typo in your code. There appears to be an "l" directly after: I think removing that should fix your problem.
-Glen

Thanks Eagle Eyed Glen

Works a treat.

Any idea how I can have more products showing though without it trying to spread them over two pages?

Allan

Allan-
Glad that fixed the problem. I'm not sure I follow you regarding the "more products" question. You could widen the conveyor belt to the same dimensions as that banner ad at the bottom of your page (728px). You can do this by changing
-Glen

Nice one Glen, great mod.

I use an ISDN script in my Ebay store - the ISDN script is derived from the Dynamic Drive script mentioned in the first post but has been tweaked. http://stores.ebay.com.au/Oz-Quilts_W0QQssPageNameZl2QQtZkm
I have several customised Sliders running across different categories on Ebay.

If you want to play with this code you could create an ISDN script and pick out any enhancements you want to create a customised look to your script. http://www.isdntek.com/tagbot/xsell.htm

Hope this helps someone