You are not logged in. Please login or register.
Juicebox Support Forum → Posts by Steven @ Juicebox
The bug noted above whereby the default value of maxThumbRows (1) is not respected on small screen devices when screenMode="LARGE" has now been fixed in Juicebox v1.4.4.
Please see the Upgrading Juicebox support page for instructions on how to download the latest version and upgrade existing galleries.
Please see the Version History for a list of changes between versions.
@tina.maldita
It is not possible to specify an exact number of thumbnails to display. The actual number of thumbnails is dynamic and will depend on the area available (factors being the size of the gallery and, if the gallery is responsive, the size of the browser window).
You can, however, set maxThumbRows and maxThumbColumns to specify maximum limits for the thumbnail rows and columns respectively. Also, if you give your gallery fixed pixel dimensions (rather than percentages), then the size and shape of the gallery will not change if the browser window is resized so the number of thumbnails will not change.
You could perhaps tweak your gallery dimensions, thumbnail dimensions and maxThumbRows and maxThumbColumns to give you the exact number of thumbnails that you are looking for.
If your thumbnails are not displaying locally or on your web server, then please double-check that the thumbnail images exist in the 'thumbs' folder and that the thumbUrl entries in your gallery's 'config.xml' file exactly match the thumbnail filenames taking care with case-sensitivity, especially with file extensions. For example, on a case-sensitive web server, 'image.jpg' is not the same as 'image.JPG'.
The link you provided seems to be an incomplete URL. I get an error 404 (file not found) when opening the URL in a browser.
If you like, please zip the entire gallery folder that is causing you the problem, upload it somewhere (perhaps your web server or a file sharing service such as Dropbox or Google Drive) and post a download link.
If I am able to see the complete gallery (rather than trying to find individual files on your web server, not knowing what all the actual filenames of your images may be), I should hopefully have a better chance of figuring out the cause of your problem. Thank you.
According to your gallery's 'config.xml' file, the first thumbnail in your gallery should be located here: http://yourspace.minotstateu.edu/russ.h … roup_1.jpg
... but going directly to that location in a browser results in an error 404 (file not found).
Please check that your thumbnail files have been uploaded to the correct location on your web server and that their permissions (and the permissions of the 'thumbs' folder itself) are not too restrictive.
Default permissions of 755 for folders and 644 for files should be fine.
Also, please see this FAQ which may help:
My images show locally, but not when I upload them to my website. Why?
@juicebuck
I have 10 images in this test gallery and when I open up the index.html only numbers 8 and 9 show up in the thumb preview.
Please post the URL to your gallery's web page so that I can take a look at the problem for myself and hopefully help.
Please check your email. I have sent you a message.
Thank you.
Juicebox was designed to be embedded into a <div> in a web page.
Do you have an example of the issue you are having? If so, please post the URL to your page so that I can take a look and hopefully help further. Maybe if I see your gallery in your page, I will have a better understanding of your problem.
Thank you.
A Juicebox gallery is essentially just an HTML 5 element (which would be embedded in a web page) and a link to a gallery would just be the URL to the web page containing the gallery.
Here is a link to a sample Juicebox-Lite gallery (on a web page of its own with no other content): http://www.juicebox.net/demos/lite/full/
Here is a link to a sample Juicebox-Lite gallery embedded in a web page alongside other content: http://www.juicebox.net/demos/lite/embedded/
Links to all demo galleries can all be found on this page: http://www.juicebox.net/demos/
To add a web page (whether it contains a Juicebox gallery or not) to an iOS device's Home Screen (whether the web page contains a Juicebox gallery or not), you would need to open the web page in Mobile Safari, tap the menu icon and select 'Add to Home Screen'.
I don't like fit to fill .
Unfortunately, there is not a scale-to-fit option for the thumbnails (only scale-to-fill), although you could certainly suggest this as an idea for a future version in the Feature Requests forum thread if you like. (The thumbnails were designed more as a navigation tool than as a method to showcase the images themselves. The main images can be scaled to fit within the gallery's image area (in their entirety, retaining their aspect ratios and without cropping) by using either imageScaleMode="SCALE_DOWN" or "SCALE").
Anyway I have solved my problem by editing the macro supplied by Imatch so that it can create all the required images and add which ever preset I want to the config.xml.
I'm glad you've found a suitable workaround for your problem.
Would I be right in assuming that the 215kb js file contains some of the jquery library.
Yes. Juicebox contains its own bundled version of jQuery so that no other dependencies are required. A user can just
Is there any way of optimising this overhead ?
The 'juicebox.js' JavaScript file is packed and obfuscated and cannot be modified so it would not be possible to remove the jQuery content from the file. Also, one benefit of Juicebox using its own version of jQuery (other than not having to ensure that jQuery is included in the web page containing the gallery's embedding code) is that we can be sure that all Juicebox functionality works OK. If a version of jQuery older than that required is used or a bug is introduced into a new version of jQuery, the gallery may fail to function correctly. Juicebox using its own bundled version of jQuery avoids this possibility.
So if the portlet or the web page resizes, it will not adjust and portions of the gallery will not be viewable unless the web page is refreshed.
It sounds like your gallery might have fixed pixel dimensions (rather than being responsive) and, if so, it will always be displayed at the specified dimensions on all devices and in all browsers.
There are essentially two ways to make a Juicebox gallery responsive (with its dimensions dynamically changing with the size of the user's browser window).
Scenario #1:
A Juicebox gallery will be responsive (and will dynamically scale with the size of the user's browser window) if the gallery's own dimensions and the dimensions of all parent containers are expressed as percentages. If there is a fixed value anywhere up the chain, then the gallery's size will become fixed (e.g. 100% x 100% x 800px = 800px).
Please note that when using percentage heights, you may need to implement the suggestion noted here.
Scenario #2:
You could use JavaScript to listen for a change in the size of the user's browser window and assign new dimensions to the Juicebox gallery if and when this happens.
An example of this can be found in the resizable galleries support section here.
Take a look at the source of this sample gallery in your browser to see how this might be achieved.
Both scenarios above apply equally to Juicebox-Lite and Juicebox-Pro.
You're welcome!
I downloaded Juicebox Plugin for Wordpress -- and nothing else. Should I have downloaded something else as well?
You can certainly use WP-Juicebox (the dedicated Juicebox plugin for WordPress) on its own.
Is the Wordpress plugin considered "lite" or "pro"?
WP-Juicebox comes bundled with Juicebox-Lite but if you are a Juicebox-Pro user, you can upgrade the plugin to use your Juicebox-Pro files by following the instructions here.
Do I have JuiceBox Builder with the Wordpress plugin??
No. JuiceboxBuilder-Lite (the desktop application to create and edit Juicebox-Lite galleries) is found inside the Juicebox-Lite zip package which can be downloaded from the link on this web page. (JuiceboxBuilder-Pro is found inside the Juicebox-Pro zip package.)
More information about JuiceboxBuilder can be found in the links below.
JuiceboxBuilder Tour: http://www.juicebox.net/tour/juiceboxbuilder/
JuiceboxBuilder User Guide: http://www.juicebox.net/support/juiceboxbuilder/
... and then copied and pasted the shortcode into our boat PAGE...
This is where the problem lies. A Juicebox gallery shortcode should not be copied and pasted into a different page. Each Gallery Id is linked to the page or post that it was originally created in.
If you copy a shortcode, it might initially display the images attached to the original page but if you edit and update the page, then the gallery will become linked to the new page and will then display the images attached to this new page.
As long as you do not copy and paste gallery shortcodes, everything should be OK.
If you want to recreate a gallery for different pages, you will need to re-upload the images for each page. (Wordpress natively allows each Media Library image to be attached to only one page.)
If you do not want to have to upload images to the Media Library multiple times, then you could perhaps use Flickr as a source of images and use the same Flickr options in each gallery.
We simply wound up with the four photos on the page, not within a slideshow.
Make sure that you do not click 'Insert into post'. This will display the images directly in the page. All that is required to display images in a WP-Juicebox gallery is to attach the images to the post. Just close the media window after uploading is complete.
So, in order to have a slideshow with 4 specific images, the juicebox gallery has to be on a page with NO OTHER IMAGES, otherwise it will incorporate any other images on the page into the slideshow?
A WP-Juicebox gallery sourced by the Media Library will display all images attached to the post. If you want to use Media Library images in the page but outside your Juicebox gallery, then I would recommend that you either use a different image source (such as Flickr) or create your galleries using JuiceboxBuilder and embed them manually using the baseUrl method of embedding documented here (without using WP-Juicebox at all).
Essentially, once you have created a gallery with JuiceboxBuilder, you would upload the complete gallery folder (not just the contents) to your web server and paste the baseUrl embedding code into the body of your WordPress page (ensuring that the method of entry is 'Text' rather than 'Visual'). It does not matter where on your web server you upload your gallery folder to as long as the two paths in the embedding code (the path to the 'juicebox.js' file and the baseUrl itself, pointing towards the gallery folder) are correct.
Thank you for clarifying your suggestions.
With regard to the Splash Page link suggestion, the Splash Page is actually part of the gallery itself (which is displayed only by embedding the gallery in a web page) and clicking the Splash Page expands the gallery (like clicking the 'Expand' button on the Button Bar). It is not really possible to have the Splash Page (on one page) redirect to a different page containing the same gallery (and other custom content). (The gallery would have to be embedded into both pages.)
I hope that makes sense.
It sounds like what you are looking to achieve could be done with a standard HTML image link such as the following:
<a href="gallery.html"><img src="image.jpg" width="100" height="50" alt="gallery" /></a>(You could overlay some text onto the image link using CSS to resemble a gallery's Splash Page.)
Unfortunately, there is currently a known bug whereby the default value of maxThumbRows (1) is not respected on small screen devices when screenMode="LARGE". (Multiple rows of thumbnails are displayed.) This bug has already been addressed and will be fixed in the next version of Juicebox-Pro. In the meantime, try explicitly setting maxThumbRows="1". This should hopefully solve your problem.
According to your gallery's 'config.xml' file, the first image in your gallery should be located here: http://www.vectorlineart.com/images/000-Index-page.jpg
... but going directly to that location in a browser results in an error 404 (file not found).
Please check that your thumbnail and image files have been uploaded to the correct locations on your web server and that their permissions (and the permissions of the 'thumbs' and 'images' folders themselves) are not too restrictive.
Default permissions of 755 for folders and 644 for files should be fine.
Also, please see this FAQ which may help:
My images show locally, but not when I upload them to my website. Why?
Unfortunately, the Shopping Cart icon is not currently active in Small Screen Mode (which is used by default when the gallery is displayed on a mobile device).
Initially, the Shopping Cart icon was displayed only in conjunction with Fotomoto (before custom purchaseURLs were introduced) and the Shopping Cart button was disabled in Small Screen Mode as the Fotomoto popup interface does not fit on small screens. (This is noted in the 'Additional notes' of the Shopping Cart support section.)
This has been logged as a bug (the Shopping Cart icon should be disabled in Small Screen Mode only when Fotomoto is used and not when custom purchaseURLs are set) which should hopefully be fixed in a future version.
In the meantime, a possible workaround would be to set screenMode="LARGE" to force the gallery to be displayed in Large Screen Mode on all devices and in all browsers.
@edwinoonk
Thank you for your suggestions.
I am using juicebox for wordpress to show my picasa webalbums. It would be neat if the picasa comment system could also be showed on the page.
By default, WP-Juicebox already uses the Picasa 'title' as the image title and the Picasa 'summary' as the image caption. ('title' and 'summary' are fields defined in the Picasa Web Albums Data API.)
If you enter a caption for a Picasa Web Album image, it should be displayed as the image caption in your Juicebox gallery.
If you have an example of this not working, please post a link so that I can take a look. Thank you.
Another option I would like is to have a parameter to force showing the splash page of an album...
This can be achieved by setting showSplashPage="ALWAYS".
For reference, the Splash Page configuration options can be found here.
I'm not sure why the behavior of the plugin seems to change without you doing anything but a WP-Juicebox gallery will display all images attached to the page or post containing the gallery and the chart you refer to seems to be a .gif image attached to the post ('boat-specs-table.gif').
Please double-check the images attached to the post in question either in the Media Library itself or by editing the post, clicking the 'Add Media' button and selecting 'Uploaded to this post' in the 'Insert Media -> Media Library' section.
One other question - in the Wordpress Plugin version of Juicebox - can we create more than one gallery so we can offer different galleries on different pages?
WP-Juicebox supports only one gallery per page or post.
If you want to embed multiple galleries on a single page or post, then you would need to do so manually following the baseUrl method documented here.
And also, is it possible to configure it so it doesn't require a "click" on a thumbnail to view, but rather just hovering your cursor over a thumbnail to display a new image?
Set changeImageOnHover="TRUE" in the Pro Options text area of your gallery settings window.
(If creating a gallery with JuiceboxBuilder-Pro, this option can be found in the Main Image section.)
JuiceboxBuilder-Lite and JuiceboxBuilder-Pro use the same methods for resizing images for thumbnails (and Juicebox-Lite and Juicebox-Pro use the same methods for displaying them in the gallery). The only difference is that Juicebox-Pro allows you to choose the thumbWidth and thumbHeight parameters.
JuiceboxBuilder-Lite and JuiceboxBuilder-Pro have always cropped images to fill (rather than to fit within) the chosen thumbnail dimensions.
I am not familiar with IMatch or its Juicebox plugin. Perhaps it scales the images differently that JuiceboxBuilder does when it creates the thumbnails for the gallery.
Maybe if you could post links to the two galleries that you are referring to (the Lite one that's OK and the Pro one that's not), I might be able to figure out what's going on. Thank you.
Also, there are a couple of workarounds that you might like to try:
(1) Upgrade the IMatch plugin from Juicebox-Lite to Juicebox-Pro by swapping the plugin's Lite 'jbcore' folder for the Pro version from your Juicebox-Pro download zip folder ('juicebox_pro_1.4.3.2/web/jbcore/'). The plugin should still use the same resizing algorithm as before and all galleries subsequently created by the plugin will be Pro.
(2) If you create your gallery with JuiceboxBuilder-Pro, you could swap the thumbnail images (in the 'thumbs' folder) for a custom set of your own (created by a different program).
There are several contributing factors which will affect the speed at which your web page will load.
(1) The speed of the web server hosting the site.
(2) The speed of your own internet connection.
(3) The number of external files (JavaScript and CSS) that your web page loads.
(4) The file size of the gallery images.
(5) The value of the imagePreloading configuration option.
You have little or no control over #1 and #2 but you can certainly check the others.
#3 Check that your web page loads only external resource files that are required. If there are any redundant files (for example JavaScript libraries which are not actually used on the page), then remove them and this should help with the initial load speed.
#4 Make sure your image file sizes are not too large. When creating a gallery with JuiceboxBuilder-Pro using the default settings (of 1024px x 768px at 80% quality), the resulting images will likely be approximately 120KB each.
This is usually a good compromise between file size and image quality for web gallery use.
If your images are substantially larger than this, then you might like to try reducing the file size to see if this helps.
#5 Try changing the imagePreloading configuration option (in JuiceboxBuilder-Pro's 'Customize -> Main Image' section) from the default value of 'PAGE' to 'NEXT' so that when the gallery is initially loaded, only the next image in the gallery is downloaded and cached by the browser (rather than all the images on the current thumbnail page).
Hopefully these suggestions will help.
You're welcome!
Many thanks for emailing me your complete gallery folder.
The spacing is actually caused by your images not being large enough to fill the gallery's image area (in a large browser window) and there is a gap at the top and bottom of the image in the gallery's image area. (This gap, in conjunction with the top of the thumbnail padding, accounts for the spacing you see.)
If you reduce the height of your browser window (so that the images need to be scaled down to fit within the image area) you should see the gap reduce until it is the same above and below the thumbnails (the only spacing left being the the thumbnail padding iteslf).
When using imageScaleMode="SCALE_DOWN" (the default setting), large images are scaled down to fit within the gallery's image area but small images are not scaled up (as their visual quality would be reduced).
Either increase the size of your images in your gallery or set imageScaleMode="SCALE".
Your landscape images are currently 640 x 479. The default values in JuiceboxBuilder-Pro are 1024 x 768 and this should be more suitable for your web gallery but you will need to feed JuiceboxBuilder-Pro larger source images in order for them to be resized down to 1024 x 758. Small images are not scaled up during the resizing process.
This should hopefully solve your problem.
Incidentally, if your browser window was much taller than it was wide, then you would also see space at the top and bottom of the main images.
Even using imageScaleMode="SCALE", the images would be scaled as large as possible to fit within the gallery's image area (without cropping) but, if the aspect ratio of the gallery is very different to that of the images, space can appear at the top and bottom of the images (or left and right, depending on the shape of the images).
For this scenario, please see this FAQ:
My Juicebox gallery shows too much space above or below the main image, how do I fix this?
Replace:
$gallery=GetDirArray('images');... with:
$gallery = array_reverse(GetDirArray('images'));I still have too much space on top.
Your gallery is too tall for your images. I would recommend setting your gallery's height to be a fixed pixel value so that the gallery's image area has an aspect ratio similar to that of the images themselves.
Another thing, the images still "flicker"or seem to load twice.
This problem may be related to server-side caching.
If caching is disabled on your web server, then Juicebox will have to download the images every time it needs them (as it will not be able to request them from a cache) and this may be causing the problem.
If you have an Apache web server and have a .htaccess file with an entry such as the following (to disable caching), then please try removing it to see if it helps.
Header set Cache-Control "max-age=0, private, no-cache, no-store, must-revalidate"This may solve the problem (or at least hopefully point you in the right direction).
And, how can I stop the autoPlay to stop when I accidentally tap or click on an image?
This might be difficult to achieve. There is no easy way to do this via configuration options. You might need to use JavaScript to remove all click and touch handlers from the gallery. However, I have not been successful in my own attempts to do this so, unfortunately, cannot provide any sample code that you can use.
Thank you for sending me your screenshot.
However, it can be difficult to determine the cause of a problem from just a screenshot alone.
I may need to see the web page that the gallery is embedded into and the gallery's configuration options.
The problem could possibly be a conflict with some custom CSS that you have on your web page or a certain combination of configuration options. (Unfortunately, I can't tell from a screenshot and I do not know if your gallery is embedded on a web page alongside other content).
Here are a couple of things to check which might help:
(1) Check, using your browser's developer tools (usually accessed via F12), to see if the spacing is due to any of your own custom CSS (if you use any). If you use any global CSS rules which the gallery is inheriting, I would recommend that you apply these rules to only those elements on your web page which require them through use of CSS selectors.
(2) One possible reason for there being a gap between the bottom of the captions and the top of the thumbnails is if you were to set:
galleryTitle=""
galleryTitlePosition="ABOVE_THUMBS"If you have set galleryTitlePosition="ABOVE_THUMBS" and use an empty galleryTitle, then just set galleryTitlePosition="NONE"instead.
If neither of the suggestions above help, then if at all possible, please send me a zipped version of your gallery and the web page it is embedded into (or upload it somewhere and provide a download link) so that I can investigate further. Thank you.
Juicebox Support Forum → Posts by Steven @ Juicebox
Powered by PunBB, supported by Informer Technologies, Inc.