WebsiteBaker Community Forum

WebsiteBaker Support (2.8.x) => Bakery Shop => Topic started by: svsanchez on July 08, 2015, 08:28:41 PM

Title: Thumnails in mobile
Post by: svsanchez on July 08, 2015, 08:28:41 PM

Hello, here's another hopefully simple question that doesn't seem to be addressed in the forums yet:

In Bakery when you use [THUMBS] you get the extra pictures of the product in little thumbs that can be clicked and be seen in their big version. It works nice on the PC, but I just noticed that if you tap the thumbnails on a mobile phone, the big images don't appear normally but instead they appear waaaaay down below.

At first I thought the thumbnails were not working at all until I noticed the scroll bar and went down the page and found the big image there.

You can see an example using your mobile and tapping in the product thumbnails in the next URL: http://butoys.com/pages/bakery/4203-lego-city-excavator-transport-1036.php

Thanks in advance!

Title: Re: Thumnails in mobile
Post by: instantflorian on July 08, 2015, 11:45:07 PM

This is merely a typical issue if there are JavaScript errors. I've checked it with my android phone, and there the big image is displayed on a new page. The Javascript error console (desktop PC, but anyway) shows some errors:

Zeitstempel: 08.07.2015 23:36:56
Fehler: ReferenceError: droplinemenu is not defined
Quelldatei: http://butoys.com/pages/bakery/4203-lego-city-excavator-transport-1036.php
Zeile: 47

 Zeitstempel: 08.07.2015 23:36:56
Fehler: ReferenceError: addthis is not defined
Quelldatei: http://butoys.com/pages/bakery/4203-lego-city-excavator-transport-1036.php
Zeile: 494

Zeitstempel: 08.07.2015 23:36:56
Fehler: TypeError: $(...) is null
Quelldatei: http://butoys.com/pages/bakery/4203-lego-city-excavator-transport-1036.php
Zeile: 57

So I don't think it's a general problem with the Bakery lightbox but an issue with some incompatible scripts.

Title: Re: Thumnails in mobile
Post by: svsanchez on July 09, 2015, 03:24:18 AM

Hello InstantFlorian, thanks a lot for your reply, I have removed all javascript errors with the JavaConsole tool (I didn't know about it) but the problem persists!  :?

Title: Re: Thumnails in mobile
Post by: svsanchez on July 09, 2015, 03:37:12 AM

Hello InstantFlorian, never mind I found the problem which was also java related:

I was missing the <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script> line on my mobile template! :-o

Title: Re: Thumnails in mobile
Post by: svsanchez on July 09, 2015, 03:39:59 AM

BUT now I have another question:

Is there a way to make the lightbox image as big as the mobile screen?

Currently the lightbox image is very large, sometimes bigger than 900 pixeles so when you click on the thumbnail you only get a little portion of the picture in a small mobile, which causes a problem for some users who don't know that there is a "CLOSE" button at the bottom right of the picture!

Title: Re: Thumnails in mobile
Post by: fischstäbchenbrenner on July 09, 2015, 10:28:28 AM

Most of the "older" slideshows dont work well on mobiles.

I usually switch to Photoswipe, if the screenwidth is smaller than 1000px

See it:
http://www.beesign.com/webdesign/responsive.php?homepage=http://WebsiteBaker.at/wb-templates/unterseiten/responsive-fg.html

Try it:
http://WebsiteBaker.at/download/responsiveFG-0.31.zip
(this is a new version of the foldergallery)