Juicebox v1.5.1 Released!

2013-04-07 19:56:07

This is certainly possible.
Take a look at the View Resizable Gallery with Top Menu Example in the Embedding Multiple Galleries section of the Embedding Guide.
If you view the source of the web page in your browser, you should hopefully see how the example works.
You can then copy and modify the code to suit your needs.

An automated solution would be to create a multiple-gallery album using jAlbum and the Juicebox skin.
When using jAlbum and the Juicebox skin, you can drag and drop a complete folder structure into jAlbum's main window and click 'Make Album'.
The resulting album will have a separate Juicebox gallery for each and every folder/subfolder in your input structure and all the galleries will be linked together via a JavaScript navigation tree (displayed on the left of the screen). On clicking a link for a gallery, the current gallery is replaced with the newly selected one.
Here is a sample album created by jAlbum and the Juicebox Skin.

2013-04-07 19:49:14

For testing purposes, try expressing your gallery's dimensions as absolute pixel values rather than as percentages, e.g.

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

Also, when using percentage heights, please see the note for Using Percentage Heights in the Embedding Guide.

2013-04-07 11:18:21

Yes. If you already have an existing .htaccess file, you can just add the code to the file.

2013-04-06 21:13:06

It looks like there might be a problem with your gallery's 'config.xml' file.
Try opening http://www.liveinthepines.com/config.xml directly in a browser (such as Chrome) and you will see the following error message:

This page contains the following errors:
error on line 122 at column 19: Extra content at the end of the document

Try removing the extra content after the closing </juiceboxgallery> tag to see if this makes a difference.

2013-04-06 11:28:32

Using the following code (as you do) will horizontally center the gallery in its parent container.

<div id="juicebox-container" style="margin: 0 auto;">

However, you may then need to horizontally center the gallery's parent container in its parent container.
Your gallery seems to be nested within 7 further <div> containers and an <article>.
Looking at your web page, it looks like you may need to horizontally center the <div class="entry-content"> within the <article class="post-13 page type-page status-publish hentry"> (using the same method as before).

2013-04-06 11:20:29

Did the file need a specific name? I just named it (new.htaccess).

The file must be named .htaccess not anything else such as new.htaccess. If you have trouble creating a file with such a filename on your system, you can upload the file as new.htaccess but then rename it using an FTP program once it is on your server.
(I posted this as a suggestion as another user claimed to have success using such a .htaccess file.)

2013-04-05 11:14:00

For your own website's galleries, try creating an .htaccess file containing the following code and upload it to your website's root directory. (Please note that this requires an Apache server and is untested.)

<IfModule mod_headers.c>
Header set Cache-Control "no-transform"
</IfModule>

You could also contact your 3G provider to see if it is possible for content modification to be turned off on your account.

Do you know if this is the case with the simple viewer galleries too?

Yes. There is a similar FAQ for SimpleViewer here. Unfortunately, content modification breaks many websites that uses JavaScript, not just Juicebox and SimpleViewer galleries.

2013-04-05 11:05:26

Instead of:

baseUrl : '/public_html/wp/wp-content/gallery13/130225_AIME/',

... use:

baseUrl : '/wp/wp-content/gallery13/130225_AIME/',

Or, instead of:

baseUrl : '/http://specialevents.com.au/wp/wp-content/gallery13/130225_AIME/',

... use:

baseUrl : 'http://specialevents.com.au/wp/wp-content/gallery13/130225_AIME/',

Use similar paths to point towards your gallery's 'juicebox.js' file, i.e. either:

<script src="/wp/wp-content/gallery13/130225_AIME/jbcore/juicebox.js"></script>

... or:

<script src="http://specialevents.com.au/wp/wp-content/gallery13/130225_AIME/jbcore/juicebox.js"></script>

2013-04-04 22:22:33

It sounds like you are using WP-Juicebox (the Juicebox plugin for WordPress) so hopefully the following information will be relevant.

When creating a gallery with WP-Juicebox, the plugin uses the Media Library image's 'Title' for the Juicebox 'Title' and, by default, WordPress populates the Media Library 'Title' fields with the image filenames.

If you would like to use the post's title for the Juicebox 'Title' in an individual gallery, then you could edit each gallery image in your Media Library and paste the post's title into the 'Title' fields.

Otherwise, if you wish this change to happen globally for all galleries you create (without the need to change the 'Title' fields on individual images), then open the 'wp-juicebox/config.php' file in a plain text editor and change line 69 to the following:

$title_text = $new_dom_doc->createCDATASection(get_the_title($post_id));

Please note that the line number above refers to WP-Juicebox v1.2.0.1.

2013-04-03 22:02:41

What you are seeing on your iPhone is the Splash Page.
For more information on the Splash Page, please see here.
You can disable or configure the Splash Page using the Splash Page configuration options.

The reason that your Splash Page image is not displaying correctly is possibly due to a conflict between the CSS of your current WordPress theme and that of the gallery itself.
Try temporarily reverting to the default WordPress theme to see if this makes a difference.

2013-04-03 14:18:12

Thank you for sharing your solution.
That seems to work well across all browsers (and versions of Internet Explorer).
It would be great if valid code was rendered identically in all browsers but this is not always the case, especially in older browsers.

So far, I have been unable to create a stripped-back test case which fails in IE8 by nesting the 'juicebox-container' <div> in multiple parent containers. As long as all the parent containers have heights specified by inline CSS, the gallery is displayed at the correct height in IE8 (and other browsers).

2013-04-03 14:15:44

why when clicking on the Gallery image I'm taken to the jbcore/full.html page

Please see the description of the expandInNewPage configuration option and the Expand Gallery Behavior section for more information.

why is it blank

This looks like a bug relating to the use of a baseUrl and a relative path for a themeUrl.
Try putting your gallery's 'theme.css' file in the 'jbcore/classic/' folder (overwriting the stock 'theme.css' file) and then remove the themeUrl entry from your gallery's embedding code.
I have logged a bug report with the developers.

2013-04-02 14:51:53

If you were a Juicebox-Pro user, you could use the imagePadding and/or stagePadding configuration options to add padding around a main image when no thumbnails are being displayed. Both configuration options are Juicebox-Pro only (and are not available to Juicebox-Lite users) and take effect when thumbnails are displayed or hidden. The stagePadding surrounds the entire gallery (including thumbnails when they are displayed) and the imagePadding surrounds only the main image.

If using Juicebox-Lite, perhaps the easiest way to create padding around an entire gallery would be to create a border (of the same color as your gallery's background) around your gallery container <div> using CSS.

It would not be possible to create padding around a main image only when thumbnails are hidden by editing a Juicebox-Lite gallery's 'theme.css' file as the logic behind determining whether or not thumbnails are hidden is coded within the 'juicebox.js' JavaScript file which is obfuscated and cannot be modified.

2013-04-02 14:27:18

No. That arrangement would not work.
All the Juicebox gallery files must be on the same domain/subdomain as the page containing the JavaScript embedding code.
Please see this web page for more information about the JavaScript same-origin policy.

If your JavaScript embedding code is on a page on www.mydomain.com, then the gallery files would also need to be on that domain.
Otherwise, you could embed your gallery using an <iframe> (documented as Option #2 here).
You could upload your gallery folder to www.gallery.mydomain.com (and the gallery would be actually be embedded in the 'index.html' file within the gallery folder on that domain) and you could then load the gallery's 'index.html' file into an <iframe> on a page on www.mydomain.com.
However, please note that when embedding a gallery in an iframe, the 'Expand Gallery' button is disabled and the 'Back Button' will not work.

2013-04-02 10:21:29

There is a lot going on within your web page and as it loads, you can visibly see elements shifting around until they settle in place (as the JavaScript and CSS is being rendered by the browser).

There are differences in your web page, not just between versions of Internet Explorer but also between different browsers.
For example, in Firefox 19.0.2, your 'Select Language' combobox is initially completely obscured by the gallery (which it is not in IE10, Chrome 25 or Safari 5.1.7) but it partially appears if you resize the browser window and then maximize it.

As you are expressing your galleryWidth and galleryHeight as percentages, check all parent containers of the Juicebox container (your 'box_slideshow' <div>) to ensure that they all have heights specified via CSS and please see the Using Percentage Heights note in the embedding guide. This suggests using inline CSS on the parent containers rather than on the Juicebox container (your 'box_slideshow' <div>) itself.

If there is a problem with the gallery not being able to determine it's height in certain browsers, then you could perhaps express your gallery's height as a fixed pixel value rather than as a percentage.

Another workaround might be to isolate the gallery completely from the rest of your web page by embedding it using an <iframe>, documented as Option #2 here. As your gallery does not use the Expand Button or Back Button, there should be no drawbacks to using an <iframe>. This should avoid any conflicts with your main page and should hopefully work in all browsers.

2013-04-02 10:17:14

I am glad that you have been able to solve your problem.
Thank you for posting back to let me know.

2013-04-01 14:23:18

The link you have provided redirects to http://afrika.delosgaia.nl/index.htm and there seems to be only a SimpleViewer gallery on the page. I see neither a Juicebox-Pro gallery, nor the code you posted (only <div id="box_slideshow"></div>).

I'm not sure it will help (as I have not yet seen the page containing your Juicebox-Pro gallery) but take a look at this FAQ (it relates to IE9 but may also be relevant to IE8):
My gallery looks strange in Internet Explorer 9. Why?

Also, if you are embedding your Juicebox-Pro gallery directly into your 'box_slideshow' <div>, then try removing the 'style' attribute from the <div>, set your gallery's dimensions using the galleryWidth and galleryHeight configuration options (in the embedding code) and, if expressing galleryWidth and galleryHeight as percentages, check all parent containers of your 'box_slideshow' <div> to ensure that they all have heights specified via CSS.

There have been a couple of issues specific to IE8 (regarding the opacity of thumbnail frames and the the FADE image transition type) but these have already been addressed and will be fixed in the next version of Juicebox-Pro.
Just to let you know, there are no known issues regarding gallery sizing in IE8.

If you continue to experience difficulties, please post the link to your Juicebox-Pro gallery so that I can take a look and investigate further.

2013-04-01 13:54:31

If you have two gallery folders (named 'gallery1' and 'gallery2') which are complete and self-contained (apart from sharing a 'jbcore' folder in a different directory) and wish to display one of the galleries in the web page which contains the code you posted above, then you will need to use the baseUrl configuration option to point to a gallery folder.
Try the following code:

<div id="header">
    <a href="gallery1/index.html">Gal1</a> | <a href="gallery2/index.html">Gal2</a>
</div>

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

2013-03-31 11:03:43

This is not possible.
The only way to display the grid of thumbnails is to set screenMode="SMALL" but the Large Screen Mode configuration options will work only in Large Screen Mode. There is no way to mix or change the screen modes in a gallery.

2013-03-31 11:03:24

This is due to a known bug which has been addressed and will be fixed in the next version of Juicebox-Pro (although I do not know when it will be released).

2013-03-30 23:40:26

is there a way i could get a splash page with a full thumbnail overview of the gallery?

A Splash Page is a placeholder for the gallery: an image which, when clicked, displays the gallery itself.
This is different from the thumbnail grid displayed in Small Screen Mode.
If you always want the thumbnail grid to be displayed, set screenMode="SMALL".
If you always want the Splash Page to be displayed, set showSplashPage="ALWAYS".

2013-03-30 11:53:02

If there were less images in the galleries would that make it appreciably faster?

No. By default, Juicebox preloads only the main images on the current thumbnail page (and not all the images in the gallery at once). See the description of the imagePreloading configuration option in the Main Image Options section of the Config Options page for further details.
However, reducing the file size of your images may help if they are rather large. (If creating a gallery with JuiceboxBuilder-Pro using the default settings, the images are resized to approximately 100-120KB each which is suitable for web gallery use.)

I have not yet studied Cloudfront, but I have heard about it a couple times in conversation. Could this assist in speed of delivery? Are there any faster ways to deliver up an image to Juicebox than Picasa?

Probably the fasted method of delivery would be to host the images on the same web server as your WordPress installation using the WordPress Media Library as the source of your images.

2013-03-29 11:44:26

In order to display a Juicebox gallery, your web page must load the 'juicebox.js' file (which, in turn, loads the 'theme.css' file and other related resources).
However, there is no way to speed this up (other than to perhaps host your images locally rather than have Juicebox fetch them from Picasa's servers). WP-Juicebox embeds a Juicebox gallery using the same method as is described in the Embedding Guide with the exception that your WordPress pages and the Juicebox XML file are created dynamically by PHP when the page and gallery are viewed. If all pages were static, things might run a little quicker (as your server would not need to create the pages on demand) but this is not how WordPress works. The advantage of having the Juicebox XML file created dynamically is that you can change your gallery's images and captions directly in Picasa without having to manually rebuild your Juicebox XML file afterwards.

2013-03-28 12:18:09

There should be no problem in redirecting 'cal500.com' to 'www.cal500.com'.
The users will always end up browsing 'www.cal500.com' and that is where your absolute URLs point to.

2013-03-28 12:13:54

On this web page: http://www.irmucha.pl/nieswiateczne.html
... it looks like the initial gallery is being displayed by the following code:

$(document).ready(function () {
    doLayout();
    $(window).bind('resize', doLayout);
    new juicebox({
        containerid : 'juicebox-container'
    });
});

... and this instance of Juicebox does not have a valid 'config.xml' file in the correct location.
Try adding the baseURL configuration option (from the embedding code further down your page) to the code above, i.e.:

$(document).ready(function () {
    doLayout();
    $(window).bind('resize', doLayout);
    new juicebox({
        containerid : 'juicebox-container',
        baseUrl : 'nieswiateczne/'
    });
});

I expect that you may not need both instances of embedding code on your page.
Once you have added the baseURL configuration option to the first instance (at the top of the page), try removing the second instance (at the bottom of the page).

Juicebox v1.5.1 Released!

Search options (Page 194 of 235)

Posts found: 4,826 to 4,850 of 5,856

4,826 Reply by Steven @ Juicebox 2013-04-07 19:56:07

Re: Multiple galleries in same page...same div? (4 replies, posted in Juicebox-Lite Support)

4,827 Reply by Steven @ Juicebox 2013-04-07 19:49:14

Re: Gallery disappears once uploaded (6 replies, posted in Juicebox-Lite Support)

4,828 Reply by Steven @ Juicebox 2013-04-07 11:18:21

Re: Not loading galleries over cellular networks 3g/4g (6 replies, posted in Juicebox-Pro Support)

4,829 Reply by Steven @ Juicebox 2013-04-06 21:13:06

Re: Gallery disappears once uploaded (6 replies, posted in Juicebox-Lite Support)

4,830 Reply by Steven @ Juicebox 2013-04-06 11:28:32

Re: How Center Juicebox Gallery? (2 replies, posted in Juicebox-Pro Support)

4,831 Reply by Steven @ Juicebox 2013-04-06 11:20:29

Re: Not loading galleries over cellular networks 3g/4g (6 replies, posted in Juicebox-Pro Support)

4,832 Reply by Steven @ Juicebox 2013-04-05 11:14:00

Re: Not loading galleries over cellular networks 3g/4g (6 replies, posted in Juicebox-Pro Support)

4,833 Reply by Steven @ Juicebox 2013-04-05 11:05:26

Re: using Pro version with wordpress (3 replies, posted in Juicebox-Pro Support)

4,834 Reply by Steven @ Juicebox 2013-04-04 22:22:33

Re: Replace image name with post title (2 replies, posted in Juicebox-Pro Support)

4,835 Reply by Steven @ Juicebox 2013-04-03 22:02:41

Re: Iphone Thumbnails Missing (1 replies, posted in Juicebox-Pro Support)

4,836 Reply by Steven @ Juicebox 2013-04-03 14:18:12

Re: Embedded gallery is not correctly displeyd in IE8 (6 replies, posted in Juicebox-Pro Support)

4,837 Reply by Steven @ Juicebox 2013-04-03 14:15:44

Re: Juicebox on iPhone in DIV not 100% (7 replies, posted in Juicebox-Pro Support)

4,838 Reply by Steven @ Juicebox 2013-04-02 14:51:53

Re: "No thumbnails" padding (1 replies, posted in Juicebox-Lite Support)

4,839 Reply by Steven @ Juicebox 2013-04-02 14:27:18

Re: A question about baseUrl embedding (2 replies, posted in Juicebox-Pro Support)

4,840 Reply by Steven @ Juicebox 2013-04-02 10:21:29

Re: Embedded gallery is not correctly displeyd in IE8 (6 replies, posted in Juicebox-Pro Support)

4,841 Reply by Steven @ Juicebox 2013-04-02 10:17:14

Re: Multiple Galleries on Separate HTML Pages (5 replies, posted in Juicebox-Pro Support)

4,842 Reply by Steven @ Juicebox 2013-04-01 14:23:18

Re: Embedded gallery is not correctly displeyd in IE8 (6 replies, posted in Juicebox-Pro Support)

4,843 Reply by Steven @ Juicebox 2013-04-01 13:54:31

Re: Multiple Galleries on Separate HTML Pages (5 replies, posted in Juicebox-Pro Support)

4,844 Reply by Steven @ Juicebox 2013-03-31 11:03:43

Re: splash page with full thumbnail overview of the gallery (6 replies, posted in Juicebox-Pro Support)

4,845 Reply by Steven @ Juicebox 2013-03-31 11:03:24

Re: Fade effect not working in IE 8 (2 replies, posted in Juicebox-Pro Support)

4,846 Reply by Steven @ Juicebox 2013-03-30 23:40:26

Re: splash page with full thumbnail overview of the gallery (6 replies, posted in Juicebox-Pro Support)

4,847 Reply by Steven @ Juicebox 2013-03-30 11:53:02

Re: Can I Speed Up the Wordpress Plug-in (3 replies, posted in Juicebox-Pro Support)

4,848 Reply by Steven @ Juicebox 2013-03-29 11:44:26

Re: Can I Speed Up the Wordpress Plug-in (3 replies, posted in Juicebox-Pro Support)

4,849 Reply by Steven @ Juicebox 2013-03-28 12:18:09

Re: Juicebox .xml file not found, except locally. (8 replies, posted in Juicebox-Pro Support)

4,850 Reply by Steven @ Juicebox 2013-03-28 12:13:54

Re: Config XML error _ have tried various solutions here (10 replies, posted in Juicebox-Lite Support)

Posts found: 4,826 to 4,850 of 5,856