2,776 Reply by Steven @ Juicebox

(7 replies, posted in Juicebox-Pro Support)

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.

Go to forum: Juicebox-Pro Support

2,777 Reply by Steven @ Juicebox

(12 replies, posted in Juicebox-Pro Support)

You're welcome!

Go to forum: Juicebox-Pro Support

2,778 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Lite Support)

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.

Go to forum: Juicebox-Lite Support

2,779 Reply by Steven @ Juicebox

(496 replies, posted in Juicebox-Pro Support)

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.)

Go to forum: Juicebox-Pro Support

2,780 Reply by Steven @ Juicebox

(12 replies, posted in Juicebox-Pro Support)

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.

Go to forum: Juicebox-Pro Support

2,781 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Lite Support)

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?

Go to forum: Juicebox-Lite Support

2,782 Reply by Steven @ Juicebox

(12 replies, posted in Juicebox-Pro Support)

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.

Go to forum: Juicebox-Pro Support

2,783 Reply by Steven @ Juicebox

(496 replies, posted in Juicebox-Pro Support)

@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.

Go to forum: Juicebox-Pro Support

2,784 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Lite Support)

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.)

Go to forum: Juicebox-Lite Support

2,785 Reply by Steven @ Juicebox

(8 replies, posted in Juicebox-Pro Support)

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).

Go to forum: Juicebox-Pro Support

2,786 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Pro Support)

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.

Go to forum: Juicebox-Pro Support

2,787 Reply by Steven @ Juicebox

(5 replies, posted in Juicebox-Pro Support)

You're welcome!

Go to forum: Juicebox-Pro Support

2,788 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Pro Support)

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?

Go to forum: Juicebox-Pro Support

2,789 Reply by Steven @ Juicebox

(5 replies, posted in Juicebox-Pro Support)

Replace:

$gallery=GetDirArray('images');

... with:

$gallery = array_reverse(GetDirArray('images'));

Go to forum: Juicebox-Pro Support

2,790 Reply by Steven @ Juicebox

(5 replies, posted in Juicebox-Pro Support)

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.

Go to forum: Juicebox-Pro Support

2,791 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Pro Support)

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.

Go to forum: Juicebox-Pro Support

2,792 Reply by Steven @ Juicebox

(5 replies, posted in Juicebox-Pro Support)

If your images are stored in an array, then the easiest way to reverse their order is to use the PHP function array_reverse before you iterate over them to create your <image> entries, e.g:

$images = array_reverse($images);

If this does not help, then please let me see the code of your 'config.php' file so that I can take a look at at and hopefully help further.

Go to forum: Juicebox-Pro Support

2,793 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Pro Support)

Without seeing your gallery, I would expect that the only space between the bottom of the caption and the top of the thumbnails is the thumbnail padding.
You could set thumbPadding="0" (in JuiceboxBuilder-Pro's 'Customize -> Thumbnail' section) to completely remove the space you are referring to but please note that it would remove the padding from all sides of the thumbnails (not just the top).
If you were to try to remove any space in the gallery using CSS, it may cause problems as Juicebox would not know of such modifications and would expect gallery elements to be in their default positions.

Please post the URL to your gallery so that I can take a look at it for myself.
Once I see your gallery, I might have a better understanding of your query and be able to help further.
Thank you.

Go to forum: Juicebox-Pro Support

2,794 Reply by Steven @ Juicebox

(5 replies, posted in Juicebox-Pro Support)

... have less space between the top and the image and the image and the thumbnails.

Please see this FAQ:
My Juicebox gallery shows too much space above or below the main image, how do I fix this?

With a responsive site and a percentage height gallery, you do not know what size and shape the gallery will be (it will be dependent on the size and shape of the user's browser window). However, when using imageScaleMode="SCALE_DOWN" (the default value), you can be sure that Juicebox will scale the images down so that they are displayed as large as possible without cropping within the gallery's image area.
Please note that the size of the gallery is not determined by the size or aspect ratio of the gallery images. It is determined by the gallery dimensions and, if you use percentages, then also by the layout of your page (the dimensions of the gallery's parent containers).

Hopefully the suggestions in the FAQ will help.

With regard to padding, Juicebox has several padding options: stagePadding, imagePadding, imageNavPadding and thumbPadding. stagePadding and imagePadding are set to 0 by default.

Go to forum: Juicebox-Pro Support

2,795 Reply by Steven @ Juicebox

(5 replies, posted in Juicebox-Pro Support)

Please post the URL to your gallery so that I can take a look at the problem for myself. Thank you.

In the meantime, please see this note regarding Using Percentage Heights.
If you are using a percentage height, I would recommend that:
(1) You set the gallery's height to 100% so that the gallery fills its parent container. You can then set the height of the parent container as required.
(2) Make sure that all parent containers of the gallery have heights specified via CSS. Otherwise, Juicebox may not be ablet o calculate what its actual height should be. (For example, if you set the gallery's height to be 100%, Juicebox needs to know what its actual height should be 100% of.)

Alternatively, try setting your gallery's height to a fixed pixel value (such as '600px') instead to see if this helps.

Go to forum: Juicebox-Pro Support

2,796 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Pro Support)

If you are referring to the code in this forum post, then you can add your gallery's configuration options as attributes to the opening <juiceboxgallery > tag.
For example, you could change the line:

echo '<juiceboxgallery galleryTitle="Juicebox Gallery">';

... to something like:

echo '<juiceboxgallery galleryTitle="Juicebox Gallery thumbsPosition="TOP" autoPlayOnLoad="TRUE" captionPosition="BELOW_IMAGE">';

Alternatively, you can set configuration options in the JavaScript embedding code as noted here.

Go to forum: Juicebox-Pro Support

2,797 Reply by Steven @ Juicebox

(3 replies, posted in Juicebox-Pro Support)

You're welcome!

Go to forum: Juicebox-Pro Support

2,798 Reply by Steven @ Juicebox

(3 replies, posted in Juicebox-Pro Support)

To hide the thumbnails and Thumbnail Button on the Button Bar, set the following:
showThumbsOnLoad="FALSE" ('Customize -> Thumbnails')
showSmallThumbsOnLoad="FALSE" ('Customize -> Thumbnails')
showThumbsButton="FALSE" ('Customize -> Thumbnails')
showSmallThumbsButton="FALSE" ('Customize -> Thumbnails')

To have the slide show start automatically, set:
autoPlayOnLoad="TRUE" ('Customize -> AutoPlay')

You can change the imageTransitionType and imageTransitionTime in the Main Image section and you can set the displayTime in the AutoPlay section.

If you want the slide show to loop continuously, set:
enableLooping="TRUE" ('Customize -> General')

Depending on the dimensions of your gallery and images, you might also want to fill the gallery's image area by setting:
imageScaleMode="FILL" ('Customize -> Main Image')

In order for the automated slide show to display on mobile devices, you could force the gallery to be displayed in Large Screen Mode on all devices and in all browsers by setting:
screenMode="LARGE"  ('Customize -> General')

Go to forum: Juicebox-Pro Support

2,799 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Lite Support)

Click the 'Change Sizes...' button in the 'Image Size' control panel on the 'Images' tab and you will be able to change the 'Quality' of the resized images. The default value is 80. The maximum value you can enter is 99.

Go to forum: Juicebox-Lite Support

2,800 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Pro Support)

I am not familiar with concrete5 but you should be able to embed a Juicebox gallery in one of your web pages using the baseUrl method documented here.

For example, if you uploaded a complete gallery folder named 'my_gallery_folder' to the root directory of your web space, then you could embed it in a web page using the following code:

<!--START JUICEBOX EMBED-->
<script src="/my_gallery_folder/jbcore/juicebox.js"></script>
<script>
  new juicebox({
    baseUrl: '/my_gallery_folder/',
    containerId : 'juicebox-container',
    galleryWidth : '100%',
    galleryHeight : '600',
    backgroundColor: '#222222'
  });
  </script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

The leading slash in the paths denotes your root directory so the code above should work in any web page throughout your site.

Go to forum: Juicebox-Pro Support