Juicebox v1.5.1 Released!

2015-07-09 08:55:49

If you created the 'config.php' file in a text editor, please make sure that it is named 'config.php' and that it does not have a different file extension such as 'config.php.txt'.

Also, please check that your web server has PHP installed on it. (Most web servers have PHP installed by default but it would be worth checking to be sure.)

If you continue to experience difficulties, please post the URL to your gallery's web page so that I can see the problem for myself and hopefully help further.
It might also help if you could zip your complete gallery folder and upload it somewhere (and provide a download link) so that I can take a look at all your files together and figure out what the problem is. Thank you.

2015-07-08 22:59:08

Do PHP files work with Muse?

PHP is a server-side scripting language. All PHP code is processed on the web server and, as such, you will not be able to preview your dynamically-generated gallery locally in Muse but it will work fine when you upload it to your web server.

Does this mean that I delete the confi.xml file?

That is correct. You would not need to use the 'config.xml' file created by JuiceboxBuilder-Pro. This is a static file which will only ever display the images listed in it. If you added images to a designated folder and wanted them to be displayed inthe gallery, then you would need to either:
(1) Manually edit the 'config.xml' file to include the new images.
... or:
(2) Use the 'config.php' file (from the forum post I linked to above) to dynamically generate a fresh XML file each time the gallery is displayed (listing all images in the designated folder at the time the gallery is displayed ).

And where exactly do I copy this: configUrl : 'config.php' in the embedding code?

Your embedding code might look something like this:

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

2015-07-07 22:48:48

Since I would like to be able to just add images to the "images" folder via ftp, what are the steps that I need to follow?

If you want to be able to upload images to a designated folder and have them displayed in your gallery without the need to modify any gallery files, then please see the example in this forum post.

Will the config file change based on the images folder?

Yes. Using the method in the forum post, when the gallery is viewed, the 'config.xml' file will be built dynamically (on the web server by the PHP script) using the image data from the designated folder.

2015-07-07 22:40:11

Juicebox-Pro (the gallery itself) has no limit to the number of image that can be included.
However, if you try to add many images at once to JuiceboxBuilder-Pro (the desktop application which creates the Juicebox-Pro gallery), Adobe AIR (the platform on which JuiceboxBuilder-Pro runs) may not be able to allocate enough memory for the task at hand. Even if your computer has plenty of free RAM, Adobe AIR applications are limited to around 1GB of memory allocation. A workaround would be to add your images in smaller batches.

2015-07-07 10:35:11

@marathonmax

The bugfix you quoted ensures that images are scaled to fill the thumbnail dimensions. (Images were previously only cropped.)

For example, prior to the bugfix, if you had a thumbURL image which had dimensions of 1024 x 768 and your thumbWidth and thumbHeight were both 85 (default values), then the actual thumbnail displayed in the gallery would be just the centre 85 x 85 of the original image.
However, now (post-bugfix), the 1024 x 768 image will be scaled to fill the thumbnail dimensions so the height of the original image will be scaled down (from 768 to 85) to fill the thumbnail height and the width will be cropped (losing 256 pixels).

Basically, pre-bugfix, the images used for the thumbnails really had to be the same dimensions as the thumbWidth and thumbHeight (although this would not have been a problem when using JuiceboxBuilder-Pro to build a gallery). Now though, it is possible to use images of any dimensions for the thumbnails (although cropping will occur if the aspect ratios of the source images and thumbnail dimensions do not match exactly). This would be useful if someone wanted to use a single folder of images for both the main images and the thumbnails in a gallery.

Thumbnails do not need to be square (you can set thumbWidth and thumbHeight independently of each other) but all thumbnails in a gallery will have the same dimensions.

Please note that thumbWidth and thumbHeight are Pro-only options which are not available in Juicebox-Lite, the free version.

2015-07-05 18:33:42

Juicebox-Pro (but not Juicebox-Lite) supports the flickrGroupId configuration option to display photos posted to a group's pool.
A list of all Flickr Pro Options can be found here.

2015-07-04 19:11:02

You're welcome.

2015-07-03 10:41:23

Just a thought which might help either yourself or anyone else reading this thread...
You could perhaps change the captionPosition. Maybe not an ideal solution but it might be a suitable workaround until the bug is fixed.

2015-07-03 10:12:34

A Juicebox gallery container is essentially just a <div> on a web page and a Juicebox gallery will resize in exactly the same way as any other <div> with similar dimensions would.
If you want a gallery container to retain a constant aspect ratio at all times, then please see the example in this forum post.

2015-07-03 10:12:30

Thank you for pointing this out. I have noted it in my bug report.
Unfortunately, the only workaround for this seems to be my second suggestion above (to make your gallery images larger so that they always fill the image area top to bottom so that the problem cannot be seen).

2015-07-03 10:11:27

Here's an example of how you can find the actual height of the current image being displayed in the gallery (using JavaScript and the Juicebox-Pro API).
Just create a sample gallery with JuiceboxBuilder-Pro and use the following code as the gallery's 'index.html' file:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <style type="text/css">
            body {
                margin: 0px;
            }
        </style>
        <script type="text/javascript" src="jbcore/juicebox.js"></script>
        <script type="text/javascript">
            var jb = new juicebox({
                containerId: "juicebox-container"
            });
            jb.onImageChange = function(e) {
                var index = e.id;
                var info = jb.getImageInfo(index);
                var url = info.imageURL;
                var image = new Image();
                image.src = url;
                var height = image.height;
                alert('Actual height of current image is ' + height + 'px.');
            };
        </script>
        <title>Test</title>
    </head>
    <body>
        <div id="juicebox-container"></div>
    </body>
</html>

Please note that this will provide the actual height of the file in the 'images' folder (not the height at which the image is displayed in the gallery which will depend on factors such as the gallery dimensions, the browser window size and whether or not gallery elements reserve space in the gallery reducing the available image area).

If you wanted to act upon the actual height of the current image and change the gallery's height to suit the current image's height you could do something like the following:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" id="jb-viewport" content="minimal-ui" />
        <style type="text/css">
            body {
                margin: 0px;
            }
            #wrap {
                width: 100%;
            }
        </style>
        <script type="text/javascript" src="jbcore/juicebox.js"></script>
        <script type="text/javascript">
            var widthInteger = 600;
            var widthString = widthInteger.toString();
            var jb = new juicebox({
                containerId: "juicebox-container",
                galleryHeight: "400",
                galleryWidth: widthString,
                imageScaleMode: "SCALE"
            });
            jb.onImageChange = function(e) {
                var index = e.id;
                var info = jb.getImageInfo(index);
                var url = info.imageURL;
                var image = new Image();
                image.src = url;
                var height = image.height;
                var width = image.width;
                var newHeight = Math.floor((widthInteger/width)*height) + 105;
                jb.setGallerySize(widthString, newHeight);
            };
        </script>
        <title>Test</title>
    </head>
    <body>
        <div id="wrap">
            <div id="juicebox-container"></div>
        </div>
    </body>
</html>

The gallery would have a constant width (600px in the example) and its height would be dependent on the height of the current image. The '105' value adds enough height to the gallery to accommodate the thumbnails and the thumbnail padding at their default values of '85' and '10' (top and bottom).

2015-06-29 20:14:39

... but nothing appears on the page itself - no image, no thumbnails, no navigation, nothing.

It sounds like there might be a problem with the actual Juicebox core files on your web server.
Try re-uploading your gallery's 'jbcore' folder to ensure that all Juicebox core are present and correct (in case something happened during the initial upload resulting in missing or corrupt files).
Also, please see this FAQ as it seems to describe your scenario and may help:
When I view my gallery, I see a blank area. Why?

If you continue to experience difficulties, 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 further. Thank you.

2015-06-29 20:14:35

Thank you for reporting this issue.
I have logged a bug report with the developers and hopefully it will be fixed in a future version of Juicebox.
In the meantime, you could perhaps tweak the position of the Button Bar using code such as the following in the <head> section of your gallery's web page:

<style type="text/css">
    .jb-bb-bar {
        margin-left: -2px !important;
    }
</style>

2015-06-28 19:22:56

I'm glad it worked. Thank you for letting me know.

2015-06-28 09:11:18

It worked for me (with your menu covering both the gallery's Button Bar and caption area) when I dynamically added the code to your web page locally using the developer tools in Firefox.

Please try changing lines 2704-2712 in your bootstrap.min.css file from:

.collapse {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition: height .35s ease;
    -moz-transition: height .35s ease;
    -o-transition: height .35s ease;
    transition: height .35s ease
}

... to:

.collapse {
    z-index: 9999;
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition: height .35s ease;
    -moz-transition: height .35s ease;
    -o-transition: height .35s ease;
    transition: height .35s ease;
}

... and clear your browser's cache before reloading your web page to ensure that your browser is using the new version of the CSS file.

If this still does not work, then please let me know and I'll take another look.

Also, the link I posted above (regarding UberMenu and 'z-index' values) should help.
http://sevenspark.com/diagnosis/z-index … rm_ref=877

2015-06-28 09:04:38

If you do not set playAudioOnLoad="TRUE" or showAudioButton="TRUE" (to allow audio functionality), then audioUrlMp3 will not actually be used and its entry in the gallery's 'config.xml' file will just be redundant.
If you wanted to prevent audioUrlMp3 from being written to the gallery's 'config.xml' file, then you could change line 42 of the plugin's 'config.xml' file from:

if (value ~= tostring(model.default[key])) then

... to:

if (value ~= tostring(model.default[key]) and key ~= "audioUrlMp3") then

2015-06-27 20:34:27

As the new Lightoom plugin no longer has a Pro Option text area, you would need to use one of the available configuration options to enter your custom data.
I would recommend using an input field which accepts text and will not actually be used in your own gallery. For example, if you are not using audio in your gallery, you could use the audioUrlMp3 field.

Add the following to the plugin's 'config.xml' file (on line 48 which is currently blank):

<% local dir = ""
if mode ~= "preview" then
    dir = model.juicebox.audioUrlMp3
end %>

... and change line 54 from:

<image imageURL="images/<%= getImage(index).exportFilename %>.jpg" thumbURL="thumbs/<%= getImage(index).exportFilename %>.jpg" linkURL="<%= getImage(index).metadata.linkURL %>" linkTarget="_blank">

... to:

<image imageURL="<%= dir %>images/<%= getImage(index).exportFilename %>.jpg" thumbURL="thumbs/<%= getImage(index).exportFilename %>.jpg" linkURL="<%= getImage(index).metadata.linkURL %>" linkTarget="_blank">

You can then enter something like the following into the audioUrlMp3 field:

http://www.example.com/juicebox/gallery/

... and the imageURL entries will look like this:

imageURL="http://www.example.com/juicebox/gallery/images/image.jpg"

Please note that the line numbers refer to the current version of the plugin (v1.4.4.0).

2015-06-27 10:02:42

Thank you for the additional information.
I now see the problem in your sidebar gallery when the menu is not fixed to the top of the page.

It looks like it might be enough to just add the following to your web page's CSS:

.collapse {
    z-index: 9999;
}

Add this to the existing .collapse code in your 'bootstrap.min.css' file (on line 2704) and it will be included in all of your web pages that load the CSS file.

Hopefully this will solve your problem.

For reference, further information about UberMenu and 'z-index' issues can be found here.

2015-06-27 09:33:50

The easiest solution would probably be to increase the CSS 'z-index' value on your menu and hover elements so that they are stacked on top of all gallery elements.

I don't actually see the problem myself.
If I scroll down one of your pages with a gallery on it (so that the caption area is close to the menu) and then hover over a menu button, the menu element completely covers the gallery (the caption does not show through).
If you can tell me exactly how I might be able to see the problem (which page or pages exhibit the problem and what steps I can take to replicate it), I will take another look and hopefully be able to help further.

2015-06-27 08:58:37

I see the problem now in a large desktop monitor. (I was previously using my laptop.)
The problem is seen only when there is space between the main image and the thumbnails (which is why you see the problem only in expanded mode and I did not see the problem on my laptop).

The problem seems to be due to setting imageTransitionType="CROSS_FADE" and it is not directly related to the AutoPlay functionality.
If you are currently viewing the last thumbnail on a thumbnail page and manually navigate to the next image using the main image navigation button, the problem can be seen.

I have logged a bug report with the developers and this should hopefully be fixed in the next version of Juicebox-Pro.

In the meantime, possible workarounds would be to either:
(1) Set imageTransitionType to SLIDE, FADE or NONE.
... or:
(2) Make your gallery images larger so that, even on large monitors or in expanded mode, the images fill the image area from top to bottom (so that the problem cannot be seen).

2015-06-26 22:10:29

There are two possible instances for 'alt' attributes for each image.

(1) The 'alt' attribute for the <img> tag corresponding to the image displayed in the gallery. This 'alt' attribute is populated by the Image Title and is generated dynamically by the 'juicebox.js' JavaScript file at the time the gallery is displayed. The 'juicebox.js' file is obfuscated and cannot be modified so this 'alt' attribute cannot be changed.

(2) The 'alt' attribute for the <img> tag in the SEO content code (which is produced only if the 'Add SEO Conntent' checkbox is selected in JuiceboxBuilder-Pro's 'Customize -> Sharing' section). This 'alt' attributes is populated by the Image Caption. Although it is not possible to change what JuiceboxBuilder-Pro uses to populate these 'alt' attributes, the SEO content code forms part of the gallery's embedding code (presented on JuiceboxBuilder-Pro's 'Publish' tab and included in the gallery's 'index.html' file) which you can edit manually in a text editor.

2015-06-26 07:29:03

I am unable to see the problem when viewing your gallery in Chrome, Firefox or IE11 on my PC.
What browser (or browsers) to you see the problem in?
Also, does the problem happen only in expanded mode or also in normal mode?

I notice that your gallery uses Juicebox-Pro v1.4.4 which was released only a week ago.
Try completely clearing your browser's cache before reloading your gallery's web page to make sure that your browser is not using cached files from previous versions of Juicebox-Pro.

2015-06-26 07:11:47

I'm glad you've got it working.
Thank you for posting back to let me know.

2015-06-24 21:30:14

The problem is likely to be due to the backslashes in your gallery's imageURL and thumbURL paths (in the 'config.xml' file). As these are relative paths, use slashes instead.
For example, change:

imageURL="images\0000029709.jpg"

... to:

imageURL="images/0000029709.jpg"

A couple of other things to check/try...

In your gallery's embedding code (in the 'index.html' page), change:

useThumbDots: "0"

... to:

useThumbDots: "TRUE"

This will probably not make a difference but possible values for the useThumbDots configuration option are TRUE and FALSE (rather than 1 and 0).

Also, try removing the comment from the top of the 'config.xml' file.

Hopefully this will solve your problem.

2015-06-23 22:24:38

I'm glad you've been able to figure it out. Thanks for letting me know.

Juicebox v1.5.1 Released!

Search options (Page 110 of 235)

Posts found: 2,726 to 2,750 of 5,855

2,726 Reply by Steven @ Juicebox 2015-07-09 08:55:49

Re: ftp protocol for Muse sites (7 replies, posted in Juicebox-Pro Support)

2,727 Reply by Steven @ Juicebox 2015-07-08 22:59:08

Re: ftp protocol for Muse sites (7 replies, posted in Juicebox-Pro Support)

2,728 Reply by Steven @ Juicebox 2015-07-07 22:48:48

Re: ftp protocol for Muse sites (7 replies, posted in Juicebox-Pro Support)

2,729 Reply by Steven @ Juicebox 2015-07-07 22:40:11

Re: Error and Crash When Trying to Create Gallery with Hundreds of Images (3 replies, posted in Juicebox-Pro Support)

2,730 Reply by Steven @ Juicebox 2015-07-07 10:35:11

Re: thumbnail cropping (3 replies, posted in Juicebox-Pro Support)

2,731 Reply by Steven @ Juicebox 2015-07-05 18:33:42

Re: Flickr Groups [SOLVED] (3 replies, posted in Juicebox-Lite Support)

2,732 Reply by Steven @ Juicebox 2015-07-04 19:11:02

Re: Serve images from CDN (14 replies, posted in Juicebox-Pro Support)

2,733 Reply by Steven @ Juicebox 2015-07-03 10:41:23

Re: Caption Overlay moves down on thumbnail row refresh [SOLVED] (9 replies, posted in Juicebox-Pro Support)

2,734 Reply by Steven @ Juicebox 2015-07-03 10:12:34

Re: Remove extra space in responsive theme? (3 replies, posted in Juicebox-Pro Support)

2,735 Reply by Steven @ Juicebox 2015-07-03 10:12:30

Re: Caption Overlay moves down on thumbnail row refresh [SOLVED] (9 replies, posted in Juicebox-Pro Support)

2,736 Reply by Steven @ Juicebox 2015-07-03 10:11:27

Re: images are responsive, container is not (4 replies, posted in Juicebox-Pro Support)

2,737 Reply by Steven @ Juicebox 2015-06-29 20:14:39

Re: Images not showing in new galleries on Amazon S3 (7 replies, posted in Juicebox-Lite Support)

2,738 Reply by Steven @ Juicebox 2015-06-29 20:14:35

Re: Menu Bar not Centered (1 replies, posted in Juicebox-Pro Support)

2,739 Reply by Steven @ Juicebox 2015-06-28 19:22:56

Re: ubermenu and captions [SOLVED] (7 replies, posted in Juicebox-Pro Support)

2,740 Reply by Steven @ Juicebox 2015-06-28 09:11:18

Re: ubermenu and captions [SOLVED] (7 replies, posted in Juicebox-Pro Support)

2,741 Reply by Steven @ Juicebox 2015-06-28 09:04:38

Re: Serve images from CDN (14 replies, posted in Juicebox-Pro Support)

2,742 Reply by Steven @ Juicebox 2015-06-27 20:34:27

Re: Serve images from CDN (14 replies, posted in Juicebox-Pro Support)

2,743 Reply by Steven @ Juicebox 2015-06-27 10:02:42

Re: ubermenu and captions [SOLVED] (7 replies, posted in Juicebox-Pro Support)

2,744 Reply by Steven @ Juicebox 2015-06-27 09:33:50

Re: ubermenu and captions [SOLVED] (7 replies, posted in Juicebox-Pro Support)

2,745 Reply by Steven @ Juicebox 2015-06-27 08:58:37

Re: Caption Overlay moves down on thumbnail row refresh [SOLVED] (9 replies, posted in Juicebox-Pro Support)

2,746 Reply by Steven @ Juicebox 2015-06-26 22:10:29

Re: how to add alt text for Section 508 compliance (1 replies, posted in Juicebox-Pro Support)

2,747 Reply by Steven @ Juicebox 2015-06-26 07:29:03

Re: Caption Overlay moves down on thumbnail row refresh [SOLVED] (9 replies, posted in Juicebox-Pro Support)

2,748 Reply by Steven @ Juicebox 2015-06-26 07:11:47

Re: Gallery does not work in Firefox online [SOLVED] (3 replies, posted in Juicebox-Lite Support)

2,749 Reply by Steven @ Juicebox 2015-06-24 21:30:14

Re: Gallery does not work in Firefox online [SOLVED] (3 replies, posted in Juicebox-Lite Support)

2,750 Reply by Steven @ Juicebox 2015-06-23 22:24:38

Re: Fit in Square thumbnails [SOLVED] (8 replies, posted in Juicebox-Pro Support)

Posts found: 2,726 to 2,750 of 5,855