Frique supports this item


179 comments found.

Hi. Thank you for great script. But I have some problem. Is there an option that stops the autoplay with some event?

I try this:

    autoplay: false

but it does’t work.


Works fine as far as i can see. You fixed it in the meantime? Probably a CSS z-index issue.

Yes, script works fine. But menu collapses when etalage-autoplay begins work. Z-index is not issue solution.

I see what you mean. Please send me an email via my profile page, so I can reply and send you a version that should fix the specific problem.

Hello, Firstly, excellent work on this script! Secondly, I had a couple questions… questions about the possibility and procedure to accomplish a few modifications: Question 1: Is there an easy way to get the image change to occur with a mouse over of the insets instead of a click (a la amazon)? I added this: jQuery("#etalage li").mouseenter(function() { if(!(jQuery(this).hasClass("etalage_smallthumb_active"))) { jQuery(this).click(); } }); but doesn’t seem like its a good means to accomplish said goal…

Question 2: This is much more far stretched.. but… I’d like to have the inset images scroll sooner (when you have more then the containing li.etalage_small_thumbs holds, the scrolling action that occurs when you click the last displayed inset), so that I can position a different inset (video) inline with the rest of the insets… is that possible?!? Thanks! Dom


1. I think what you mean can be done with the plugin option “smallthumb_select_on_hover”. Add the option when you initiate Etalage like so:

    smallthumb_select_on_hover: true

2. You could force the width of the small-thumbnails row with css like so:

    width: 200px !important;

Hope this helps!

1.) Perfectamundo! (espanol for “perfect!”) 2.) It works! It only scrolls upward when the original inset is selected, but that’s good enough for me. Thanks a bunch frique!


Etalage came integrated with a theme we purchased. However it came without etalage usage instructions or documentation. Could you advise where we can find this.


Sorry forgot to ask do you also have API manual as we are looking at having a swatch extension installed on our Magento theme and and the swatch developer requires the actual API and manual.


In the case of a theme author using Etalage in their theme, they remain the holder of the license. When they integrate it into their theme they are then in charge of supporting their customers regarding their custom implementation of Etalage and their theme as a whole. You can ask for support from the theme author or get a personal copy of Etalage that comes with the documentation, unminified code and usage examples.


I tried to test if it’s possible to grab the image height and width before initialize etalage, this won’t works and what code actually works if the images are of different size?

$(document).ready(function(){ $("#imgSizeS").load(function(){ var imgWidth=100; var imgHeight=100; var imgWidth = $("#imgSizeS").width(); var imgHeight = $("#imgSizeS").height(); alert(imgWidth) alert(imgHeight) //imgSizeL $('#etalage').etalage({ thumb_image_width: imgWidth, thumb_image_height: imgHeight, source_image_width: imgWidth*4, source_image_height: imgHeight*4 }); }); });

I just found out it works perfectly without applying any parameters and I could just use PHP to adjust the width will be fine. Great coding you have and works beautifully!

Hi Frique,

I’m creating some kind of selling project item for CodeCanyon that requires a slider.

Your slider seems to be perfect for showing the products, but I’m not sure if I purchase the Extended license I will be able to include that in the package.

I will give you fill credit for the slider (that is not the main feature of the item), but it will show the products that I want to show.

Can I use your slider for that? if not, I will appreciate if you tell me, but if you are agree, I will send the users to this page to acquire etalage if they want to use it in other project.

Thank you and GLWS

Hi Klerith,
The extended license should suffice for that purpose. It allows you to incorporate Etalage in your own project however you want, as long as you don’t sell Etalage by itself :)

Regards, Frique

As author, I understand what you are saying, but I prefer to ask and know if you are ok, I will give you full credit.

Thank you.

as I do to be enabled responsive design?

Hi. Etalage doesn’t have responsive features. I would advise to use CSS media queries to provide a simpler solution to smaller screens.

ok, thanks you !

Hi, can this display the zoom on the ‘inside’ rather than to the right?

Hi. Sorry, that’s not possible with Etalage at the moment.

Hi Frique,

thanks for this great script. I implemented it into my wordpress installation and it works fine in firefox, chrome and safari. :) In IE I have problems even viewing the pictures. :( What can I do here? Please have a look here:

Thanks in advance. Cheers Micha

Hi Micha,

You seem to start the script tag’s content with a ”—>” which doesn’t belong there. That might be why IE decides to abort everything after that.

Hi Frique,

thx for your answer. I deleted the ”—>” but unfortunately it does not work yet. Any further ideas what to do?

Thanks. :)

It’s hard to debug, and it seems the demo page is now using another solution. My suggestion would be to start at the beginning where Etalage still works in IE, then apply customizations gradually to see when it breaks.

hello, i just bought the plugin, the problem is that when the image is zoomed, it is resided into some fixed dimensions, please check this screen:

is possible to fix this? how can we get autoHight for the images, please help. we cant use the plugin if we cant fix this. thank you

Hi. Please look at the plugin options “zoom_width” and “zoom_height”, which determine the zoomed photo’s dimensions.

I keep receiving this error in my error-log for my website

File does not exist: /home/kkclient/

I checked the location of this file reference, and it is…

etalage.css, for the following…

background: url(../images/hint.gif) no-repeat;

I have not been able to find this file in my system, and I am not able to locate this in other locations. Was this accidentally not packaged?

Hi. You most likely copied the initialization code from the demo pages and have the “show_hint” option set to “true”. Remove that line or set it to false to make Etalage stop looking for it. If you do want to use it, you can find it in the download package’s images folder.

With Etalogue when you open a product page all large images load at once. With others, only the main image loads + thumbnails. All other large images load only AFTER you click the thumbnail. This makes mobile site run much much faster,

Is there any solution for this?


That is correct and it is a design decision. When loading the images after interaction, the user will always have to wait a bit. When they are all preloaded the user can see the zoomed images right away when interacting.

On a sidenote, Etalage was created in a time when the mobile web was less important so it is not optimal for mobile use.

Hi, just wanted know if it will work on ebay listing? Regards Grazyna

Hi. I have no experience setting up ebay listing pages so I can’t tell.

You’d have to be able to do the following:
  • Include jquery (unless already included)
  • Include a custom script (1 for Etalage, 1 for the initialization snippet)
  • Include a custom CSS file
  • Add your custom HTML with image URLs


is it possible to get a tax invoice for the purchase?

Purchase Code: aaba7d0f-a689-4aec-814c-b267c0600951

The address reads: Elmar Lohmüller Idingerstr. 5 79110 Freiburg Germany

Thank you, best regards


Hello Elmar. Please contact CodeCanyon/Envato about this, as they handle the financial aspect of the marketplace.

Thanks, I found it:-) Another question: I have 4 pictures, and I want them to be available in Fanybox after the user clicked on the large image…so that the user can move to the next image. Is that possible? Thanks Elmar

Hi. This is an incomplete example, but should work:

Hi, Ive inherrited a website that contains your script for image zooming and whilst all appears to work correctly for single images, as soon as the product contains multiple images the zoomed image is out of sequence.

Ive tried all sorts of things from triggering a click onload to trying to change the order via JS. but nothing seems to sort out the item arrangement.

If the client has to purchase a new license for support, that shouldnt be a problem, but I am finding it to be rather stange.

is the link to the site, any assistance greatly appreciated


When I view the generated source code in Chrome’s dev tools I see there is a script tag inside the ul id="etalage" that shouldn’t be there. This is probably in the way when the script is processing the markup.

I lost the download after I purchased your tool too zoom images. I need the zip file again to customize it. Please let me know if I need to provide any information regarding this

Hi. The download should be listed and always available on your downloads page at

Is there a way to make it 2 images per slide?

If there’s no way, how much to customise the script so that it will show two images per slide, just like this:

(This has been answered by email.)

Hi, I would like the thumbs on the left side, but with the design of example one. Can you help please? I tried a lot, but am no expert. Thanks – Ulrich

Hi Ulrich,

When you initiate Etalage, you probably do something like this:

The option to alter the thumbs position is “smallthumbs_position”. Add the option like so:
$('#etalage').etalage( {
  smallthumbs_position: 'left'
} );

See the documentation and the code with the included examples for more customization options.

Hello, I ran the plugin and it loads fine and works, but it resiezes the images to the basic example site. how can i resize them?

Hi. All options are described in the included instructions.html file. You can change the image dimensions with thumb_image_width, thumb_image_height, source_image_width, source_image_height.


We’ve recently inherited a website which uses your etalage zoom extension.

The extension is working fine but we would like to disable the zoom if the user is using a mobile device or small screen can you please advise is this possible?

Thanks Ben

Hi Ben,

As you’ve noticed Etalage is rather outdated in that sense. I would advise to hide Etalage with a CSS mediaquery on narrow resolutions / touch screens and then show a basic alternative instead.