Image Gallery not loading correctly

Posted by Community Admin on 04-Aug-2018 21:26

Image Gallery not loading correctly

All Replies

Posted by Community Admin on 28-Jan-2014 00:00

I'm using Sitefinity 5.4 and I'm trying to add an Image Gallery widget (Thumbnail strip + Image on the same page), but it's not working correctly.

See here: shop.stephenjoseph5x.com/.../About

The gallery loads very slow, and after it's loaded, it doesn't work correctly.
Also, the last few images are all fuzzy, as if they are small images that have been stretched out by the browser. And if you check the code, this is indeed what's happening. But in reality, the images are over 300px wide. For some reason, the gallery is using smaller versions of the images, but I can't find a setting anywhere that might be causing this.

Help?

Posted by Community Admin on 30-Sep-2015 00:00

Hi Jennifer.

Were you able to fix this issue.

I am experiencing the same one on my end.

Thanks

Posted by Community Admin on 30-Sep-2015 00:00

Hi Mouad,

I have checked the information we have provided to Jennifer in the ticket she has opened related to the same issue and it appeared that the issue is cased by the page template the pages are based on.

When testing the behavior on a brand new page which is not based on a page template the Image gallery widget was working properly. Can you please create a brand new page with no template (please check the Don't use template option (start from scratch) option when creating the page) and the Image gallery should work properly?

I am also pasting here some of the additional information I have provided related to the Image Gallery widget when using the Thumbnail strip - Image on the same page mode which might be also useful:

Please note that when you choose the Thumbnail strip - Image on the same page mode, the whole functionality comes from the Galleria JavaScript plugin which Sitefinity is using. 

The image gallery plugin is using the original size of the images as shown here. But it has a predefined dimensions for the gallery container and for the images (please, refer to the screenshot). Therefore, the images which you have upload are being re-sized to fit the predefined dimensions and this might cause the images to look fuzzy. I can suggest that you add some css styling in order to set the desired height and width of the gallery container and your images should be displayed properly. Here is an example:

.galleria-container
height:1200px;
width:1200px;

You can also change the properties of this mode of the gallery, using the galleria-stage, galleria-thumbnails-container, galleria-thumbnails and .galleria-image classes. Please take a look at the example:

.galleria-container
  height:1200px;
  
.galleria-stage
bottom: 100px;
.galleria-thumbnails-container
height: 90px;
.galleria-thumbnails .galleria-image
height: 90px;
width: 150px;

You can either include the css in the theme for your template, or in a css widget, directly on the page/template.

Regards,
Sabrie Nedzhip
Telerik
 
Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Sitefinity CMS Ideas&Feedback Portal and vote to affect the priority of the items
 

This thread is closed