If you'd like your Audio Button to stand out from the other icons on the Button Bar, you could color it differently by using CSS such as the following. (This example will color the Audio Button red.)

.jb-bb-button.jb-bb-btn-audio {
    color: #ff0000;
}

Put this CSS code at the foot of your gallery's 'jbcore/classic/theme.css' file. (If you put the code in the gallery's embedding page, then the Audio Button will not be colored if/when the gallery is expanded in a new page (for example, on iOS devices).)

This might at least attract some attention and users will hover over the button where they will then see the rollover tooltip text  "Play Audio". If you like, you can change this tooltip text via the languageList configuration option. Please see the International Gallery Text support section for details. (The languageList option was intended for translating the on-screen text into different languages but you can use it to change the messages to whatever you like.)

If you want to actually change the Audio Button icon itself, then this is also possible (but more difficult).
Please check out the Using Custom Icons support section in the Theming Guide for details.

Alternatively, you could create your own Audio Button and place it alongside the gallery on the embedding page.
You would need to use the Juicebox-Pro API (specifically the toggleAudio() method) and knowledge of JavaScript would be required.
Take a look at the Juicebox-Pro API demo gallery here. You'll see that there is a 'Toggle Audio' button to the left of the gallery. You could do something similar for your own gallery's web page. (Check out the source of the demo in your browser to see how it is done.)
Your custom Audio Button does not need to be an HTML button, though. You could make any HTML element (e.g. text or an image) clickable and act like a button.

I hope this gives you some ideas as to how you could make your Audio Button more prominent now that autoplay is becoming less likely to happen (depending on the user's browser).

That's great!
I'm glad you've got it working.

This is not something that Juicebox was designed to do but it should be possible with help from the Juicebox-Pro API.

You'll need to edit your gallery's embedding code, though.
There are no configuration options which you can set to make this happen.

If you want to redirect the user to a custom web page when the last image in the gallery has been reached, then try something like this:

<script type="text/javascript">
    var jb = new juicebox({
        backgroundColor: "rgba(0,0,0,1)",
        containerId: "juicebox-container",
        galleryHeight: "100%",
        galleryWidth: "100%"
    });
    jb.onInitComplete = function() {
        var imageCount = jb.getImageCount();
        jb.onImageChange = function(e) {
            if (e.id === imageCount) {
                window.location.href = 'http://www.example.com';
            }
        };
    };
</script>

If you want to introduce a delay (so that the last image can be seen for a set amount of time before the redirection happens), then try the following, changing the delay time of 5s (500ms) to whatever you like:

<script type="text/javascript">
    var jb = new juicebox({
        backgroundColor: "rgba(0,0,0,1)",
        containerId: "juicebox-container",
        galleryHeight: "100%",
        galleryWidth: "100%"
    });
    jb.onInitComplete = function() {
        var imageCount = jb.getImageCount();
        jb.onImageChange = function(e) {
            if (e.id === imageCount) {
                window.setTimeout(function() {
                    window.location.href = 'http://www.example.com';
                }, 5000);
            }
        };
    };
</script>

If you want the redirection to happen only when the last image has been reached via AutoPlay (and not by user navigation), then try the following, which also includes the delay:

<script type="text/javascript">
    var jb = new juicebox({
        backgroundColor: "rgba(0,0,0,1)",
        containerId: "juicebox-container",
        galleryHeight: "100%",
        galleryWidth: "100%"
    });
    jb.onInitComplete = function() {
        var imageCount = jb.getImageCount();
        jb.onImageChange = function(e) {
            if (e.id === imageCount && $('.jb-bb-btn-auto-play').first().hasClass('jb-status-playing')) {
                window.setTimeout(function() {
                    window.location.href = 'http://www.example.com';
                }, 5000);
            }
        };
    };
</script>

I hope this helps and points you in the right direction.

In order for both JuiceboxBuilder-Pro and the Juicebox Plugin for Lightroom to generate an absolute path for the og:image entry, it is necessary to complete the Share URLcorrectly (in both applications).
Both applications generate an absolute path by concatenating the Share URL and the path to the first image in the gallery.
The only difference between JuiceboxBuilder-Pro and the Juicebox Plugin for Lightroom in this respect is that, in JuiceboxBuilder-Pro, the og:image entry is left empty if the Share URL is empty whereas the Juicebox Plugin for Lightroom still outputs the path to the first image even if the Share URL is empty.
The end result is the same in both cases, though: the Share URL must be completed correctly (in both applications) for the Facebook share window to display the image.

That is correct. This is just how Facebook works (by using the web page's Open Graph og:image entry for all shared links on the page).
It is not possible (at least not easily) to have the shared image's thumbnail displayed in the pop-up Facebook share window due to limitations imposed by Facebook on what data can be passed via their share URL. Only one thumbnail image can be used per web page. However, the shared link itself will still point towards the correct image within your gallery.

You can think of the og:image as being representative of the gallery as a whole so you could use an image which best represents your gallery.
The og:image does not need to be an image from the gallery itself. You can edit the gallery's 'index.html' in a plain text editor to change the og:image path. (Just make sure that the path you use is an absolute one.)

Just in case you are thinking of delving much deeper into this, the only user I know of who seems to have managed to overcome this restriction is sly from this thread.
His solution seems to be included within a rather complex custom JavaScript file (check out the 'jcaddon.js' file on his gallery pages) which overrides some of Juicebox-Pro's own sharing functionality and, therefore, is not officially supported.
(As such, I have not tested his solution myself and I cannot be sure that it will work across all platforms and in all browsers.)
However, I hope this points you in the right direction.

You og:image meta tag (in your gallery's 'index.html' file) is currently:

<meta property="og:image" content="/images/or_2011_05_0022.jpg" />

Facebook requires that the og:image path be an absolute path (rather than a relative path).

There are a couple of ways to fix this.

(1) Open your gallery in JuiceboxBuilder-Pro, go to the 'Customize -> Sharing' section, and enter the absolute path to the directory containing your 'images' folder in the 'Share Url' input box i.e.:

http://pascalriben.com/About Color/

Now re-save your gallery on the 'Publish' tab.
JuiceboxBuilder-Pro will use the 'Share Url' at the beginning of the og:image path and will append the path to the first image in the gallery after it.

... or:

(2) Open your gallery's 'index.html' file in a plain text editor and replace:

<meta property="og:image" content="/images/or_2011_05_0022.jpg" />

... with:

<meta property="og:image" content="http://pascalriben.com/About Color/images/or_2011_05_0022.jpg" />

(You can use the absolute path to whatever image you like.)

If, after making this change, you still do not see the image in the Facebook share window, then you might need to run your gallery's web page URL through Facebook's online debuggers to instruct Facebook to fetch new scrape information (including the og:image path) from your page.
(1) Facebook's Sharing Debugger: https://developers.facebook.com/tools/debug/sharing/
(2) Facebook's Batch Invalidator: https://developers.facebook.com/tools/d … ing/batch/
(3) Facebook's Open Graph Object Debugger: https://developers.facebook.com/tools/debug/og/object/
(Click the 'Fetch new scrape information' button.)

This should hopefully resolve your problem.

No worries!
I'm just glad to hear that your problems have been resolved.
Thank you for letting me know.

That's OK.
Leaving the post up might help others with similar problems.

Question #1

That's great! Thank you for letting me know.

Question #2

Unfortunately, Juicebox has no way to split an image into individual hit areas and associate each one with a unique link.
The easiest way to include two different links into a specific image would be to use an image caption such as this:

<caption><![CDATA[Click <a href="http://www.example.com">here</a> for Link #1.<br>Click <a href="http://www.example.com">here</a> for Link #2.]]></caption>

If you are entering the caption directly into the JuiceboxBuilder-Pro interface, then you can use just something like the following

Click <a href="http://www.example.com">here</a> for Link #1.<br>Click <a href="http://www.example.com">here</a> for Link #2.

... JuiceboxBuilder-Pro automatically adds the <caption> and CDATA tags to the gallery's 'config.xml' file.

You can further style the caption/link text with inline CSS if you like, as noted in the FAQ I linked to in my last post (here).

If you don't want the caption area to be seen on other images in the gallery, set showImageNumber="FALSE" in the Caption section (to hide the image number in the caption area) and set the opacity for both captionBackColor and captionBackTopColor to zero in the Color section (to hide the caption area gradient).

I hope this helps.

You can prevent the thumbnails from being displayed when the gallery is loaded by setting:
showThumbsOnLoad="FALSE" - (for Large Screen Mode) - Thumbnail Options
showSmallThumbsOnLoad="FALSE" - (for Small Screen Mode) - Thumbnail Options

You can prevent the user from toggling the thumbnails on and off (by disabling the Thumbnail Button on the Button Bar) by setting:
showThumbsButton="FALSE" - (for Large Screen Mode) - Lite Options
showSmallThumbsButton="FALSE" - (for Small Screen Mode) - Thumbnail Options

Juicebox was not designed to default to fullscreen mode and requires a click from the user (on the Expand Button on the Button Bar) to go into fullscreen mode.
If you really want your gallery to go fullscreen as soon as the gallery is loaded, then you could try one of the following suggestions but please remember that Juicebox was not designed with this in mind so you might encounter some unexpected problems.

(1) If you link directly to a web page containing a gallery, then try adding #expanded to the end of the URL.
As an example, take a look at this embedded demo gallery: https://www.juicebox.net/demos/pro/embedded/
... and now go to the same URL but with #expanded at the end of it: https://www.juicebox.net/demos/pro/embedded/#expanded

(2) If you cannot use a URL to automatically expand your gallery, then you could perhaps use the Juicebox-Pro API method toggleExpand() (within the onInitComplete event) inside your gallery's embedding code to fire fullscreen mode when the gallery is ready.
Here is some sample code which you could use to achieve this.

<!--START JUICEBOX EMBED-->
<script src="jbcore/juicebox.js"></script>
<script>
    var jb = new juicebox({
        containerId: "juicebox-container",
        galleryWidth: "600",
        galleryHeight: "400",
        showExpandButton: "TRUE"
    });
    jb.onInitComplete = function() {
        jb.toggleExpand();
    };
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

I hope this helps.

Edit:
Please note that if your gallery sets useFullscreenExpand="TRUE" (Lite Options) then neither of the suggestions above will trigger the Fullscreen API to go true fullscreen. (The gallery will expand only to fill the browser window, not the entire screen.)
This is due to a security feature of the Fullscreen API (please see here for further details) whereby the user must initiate the true fullscreen functionality via a click (on the Expand Gallery Button on the Button Bar).

I'm glad to hear that you've been able to resolve your problem.
Thank you for letting me know (and for sharing the link).

By default, the Download Button will download the image being displayed in the gallery (using the imageURL from the gallery's 'config.xml' file, the same path that Juicebox uses to display the image in the gallery).

If you have a Multi-Size Image gallery, then the Download Button will download the 'large' size image (the largeImageURL) in preference to the imageURL.

If an image has a linkURL associated with in, then the Download Button will download the file pointed to by the linkURL in preference to all of the above.

Please take a look at your gallery's XML data to check the imageURL, largeImageURL and linkURL entries to see if you can figure out where the problem is originating from.

If you are using the Juicebox module for Drupal, then please note that this is an unofficial plugin which was not written by ourselves.
The gallery's XML data is dynamically generated by the module's code and so, if you are unable to determine the cause of the problem, then it might be worth posting your query in the Drupal forum where the author of the module might be able to help you further.

Also, it might help if I am able to see the problem for myself so if you continue to experience difficulties, please post back with the URL to your gallery's web page so that I can take a look and hopefully help further.
Thank you.

Edit:
As your Download Button seems to be downloading the 'juicebox.php' file (but with an .html file extension), it might be worthwhile checking that PHP is installed and configured correctly on your web server.
The Download Button requires PHP 5.2.0 or later, as noted here (check the 'Web Server' system requirements).

The custom CSS is affecting the position of the image within the Splash Page container and the only way to counteract this is with CSS. The custom CSS will be applied to whatever image you choose to use for the Splash Page, no matter what shape or size it is.
Additionally, if your gallery is responsive, then the aspect ratio of the Splash Page will be dependent on the dimensions of the browser viewport being used to view the gallery so you have no way of knowing what shape and size the Splash Page will actually be for any given user (so there is no ideal size to use for the Splash Page image).

The quickest and easiest solution to the problem is to ensure that the max-width: 100% !important; CSS rule is not applied to the Splash Page image by removing the !important declaration from the rule. (This will likely not adversely affect other images on your web page at all.)

However, if you do not want to change the Jetpack CSS, then you'll need to change the Juicebox CSS instead.
Open the plugin's 'wp-juicebox/jbcore/classic/theme.css' file in a plain text editor.
Search for max-width: none; and replace all instances (there are four) to max-width: none !important.
In the current version of Juicebox-Pro (v1.5.1), they are on lines 119, 197, 247 and 696.

Otherwise, you could just add the following to the end of the 'theme.css' file:

.juicebox-gallery img, .jb-idx-thb-list .jb-idx-thumb img, .jb-dt-main-frame img, .jb-idx-thumbnail-container .jb-splash-holder img {
    max-width: none !important;
}

As the 'theme.css' file is loaded in your web page after the 'style.css' file, the !important declarations in the 'theme.css' file will override the !important declaration in the 'style.css' file

I hope this make sense and helps you to resolve your problem.