The error you reported above is more of a warning than a problem and is not going to be the cause of a flickering gallery.
It looks like you may have deleted your original post in this thread (it certainly seems to have disappeared).

Does the flickering occur when you view the gallery on its own web page (when you view the gallery's own 'index.html' page inside the gallery folder) or just when the gallery is embedded in your main page?
Also, does your button bar disappear when expanding the gallery from its own web page or just when expanding the gallery from your main page.

If you have any add-ons installed in IE11, try temporarily disabling them to see if this makes a difference.

If you continue to experience difficulties, please explain exactly what the flickering looks like (do images quickly appear and disappear, is it just the main image or the whole gallery) and at what point in the gallery the flickering occurs (when the gallery is initially loaded or at the start or end of an image transition or when clicking a button on the Button Barl).

You will need to upgrade to Juicebox v1.4.2 in order for your Flickr gallery to work.
Please see this Juicebox blog entry for more information.
Details on how to upgrade Juicebox can be found here.

OK. I'm glad everything seems to be working as expected again. Thank you for letting me know.

there is only one image with a link "view gallery", and if one clicks on it, one arrives on a second page with the gallery and the thumbs

What you are describing here is the Splash Page (which is displayed by default in Small Screen Mode or if showSplashPage="ALWAYS"). You can find more information about the Splash Page in the Screen Modes section of the Gallery Tour.

3,479

(3 replies, posted in Juicebox-Pro Support)

I think it is unlikely. Assigning a unique link to each thumbnail in Small Screen Mode would bypass the main image display of the gallery.
It is possible to assign a unique link to each main image in a gallery in both Small Screen Mode and Large Screen Mode (but only one main image is displayed at any one time).
You would set the links in the linkURL text fields (on JuiceboxBuilder-Pro's 'Images' tab) and set imageClickMode="OPEN_URL" (in JuiceboxBuidler-Pro's 'Customize -> Main Image' section).
When the main image in the gallery is clicked (or tapped on a mobile device), the corresponding linkURL will be opened in the user's browser.

If you would like to make a suggestion for a future version of Juicebox, please post in the Feature Requests forum thread. It keeps all the suggestions together and ensures that they are not overlooked. Thank you.

@joaqimb

I have viewed your Boogieboy and Namur galleries in Internet Explorer 11 and I do not see a flickering image and the Button Bar appears at the upper-right corner of the expanded gallery. Everything appears to be working as expected.
If these are not the galleries you are referring to, then please post the URL to the gallery in question and let me know what version of Internet Explorer you use.

The following are general tips which may help with the symptoms you describe but if the galleries I named above are the ones you are referring to, then the problem may be local to your computer or the version of Internet Explorer that you use.

I have the same problem in Internet Explorer. But not in Firefox or Google Chrome.

First of all, please ensure that you are using the latest version of Juicebox-Pro (v1.4.2).
Instructions for upgrading can be found here.

Please see this FAQ, which may help: My gallery looks strange in Internet Explorer 9. Why?

Also, please make sure that your Internet Explorer browser is not displaying your web page in Compatibility View.

Next, check your web page for any HTML errors. You can check the code on your web page with the W3C Markup Validation Service and then fix any errors reported. Once the code on your web page validates correctly, your web page should be rendered with greater predictability and consistency across different browsers.

And for more: when I go to full screen in IE, I loose my buttonbar at the top of the window.

Try one (or more) of the following:

  • Try setting a fully opaque expandedBackgroundColor (such as expandedBackgroundColor="rgba(255,255,255,1)") in JuiceboxBuilder-Pro's 'Customize -> Color' section (set the 'Opacity' value to '1').

  • Try setting expandInNewPage="TRUE" in JuiceboxBuilder-Pro's 'Customize -> General' section.

  • Try changing the useFullscreenExpand configuration option (from TRUE to FALSE or vice versa) in JuiceboxBuilder-Pro's 'Customize -> Lite' section.

3,481

(3 replies, posted in Juicebox-Pro Support)

You can certainly display a grid of thumbnails by forcing Juicebox to display your gallery using Small Screen Mode (by setting screenMode="SMALL" in JuiceboxBuilder-Pro's 'Customize -> General' section).
For more information about Screen Modes, please see here.

However, it is not possible to assign unique links to the thumbnails in a gallery. When you click a thumbnail in Small Screen Mode, the corresponding main image will be displayed.

If you want to reverse the order of images in a Media Library gallery, edit your gallery (on the 'Dashboard -> WP-Juicebox -> Manage Galleries' page) and select either 'Ascending' or 'Descending' (whichever is appropriate) for the 'Image Order'.

The images are ordered by the WordPress 'menu_order' so the images should be displayed in the gallery as they are listed in the 'Insert Media -> Media Library -> Uploaded to this post' display (or in reverse order if selected in the gallery settings).

If you want to reorder images in a gallery (more than just reversing the order), then edit the page or post containing the gallery, click the 'Add Media' button, select 'Insert Media -> Media Library -> Uploaded to this post' and drag and drop the thumbnails into the order you would like them to be displayed in your gallery.

3,483

(1 replies, posted in Juicebox-Pro Support)

Juicebox cannot distinguish between multiple galleries on a single web page using the # to specify a unique gallery on the page as well as share a specific image within a gallery (and the code that deals with this is within the 'juicebox.js' JavaScript file which is packed and obfuscated and cannot be modified).
Unfortunately, I cannot think of a workaround for this (I have tried using query strings and window.location.hash in a test scenario without success).
If you like, you could perhaps suggest this for a future version of Juicebox in the Feature Requests thread.

3,484

(8 replies, posted in Juicebox-Pro Support)

I have taken a look at your web site and have found your gallery's web page.
The problem is that you have entered your embedding code into your Drupal editor as plain text and not as HTML code (and the embedding code is appearing as text on your web page rather than being rendered as actual HTML code by the browser).
You will need to change your editor's 'Text format' (at the bottom of the editor) from 'Plain text' to 'Full HTML' before entering the embedding code.

1. JuiceboxBuilder asks for the index page of the website. Default value: index. html. My site has in index.html page but only by alias for another page. May this be the problem? If so: how can I solve the problem?

This is not the problem (see above) but you can change the name of the page to anything you like (to avoid filename conflicts).
If you are embedding your gallery in an existing web page, then you do not need to use (or upload) the gallery's own 'index.html' file at all. It is used only if you want to display the gallery on a page of its own.
Also, the 'index.html' file will be stored within the gallery folder and if you use a baseUrl, you will upload the entire gallery folder (not just the contents) so there is no chance that the gallery's 'index.html' file will conflict with one of your own 'index.html' files.

2. What is the root directory of the site? 'public_html' or "/".

On your web server, the root directory is 'public_html'.
If you upload a file named 'test.html' to your 'public_html' directory via FTP, then it will be accessible on the web at '/test.html' in one of your web pages.

3. When I use an absolute path "www.sitename.be/Juicebox Namur/...' than a partial link is generated, namely "www.sitename.be/Juicebox". How comes? By evidence this link does not work.

This fails within the forum software because you use a space in your 'Juicebox Namur' folder name (and the forum software sees a space as the end of the path). As long as the paths are correct within your web page, everything should be OK.
However, I would recommend that you use only web-safe characters for files and folders on your web server.
Please see section 2.3 of this document for details.

Characters that are allowed in a URI but do not have a reserved purpose are called unreserved. These include uppercase and lowercase letters, decimal digits, hyphen, period, underscore, and tilde.

3,485

(8 replies, posted in Juicebox-Pro Support)

Please post the URL to your web page so that I can take a lok and help further.
Once I see the code that you are using on your web server, I should be able to determine the cause of the problem.

3,486

(5 replies, posted in Juicebox-Pro Support)

It looks like the root of your problem lies with your external 'parallax.js' JavaScript file.
When it is loaded in your web page, it removes (rather than just hides) the following elements from your web page's Document Object Model (DOM).

story-home
story-live
story-travel
story-explore
story-about
story-contact

Your 'Live' gallery's container ('livecontainer') is within the 'story-live' <section> and your Travel gallery's container ('travelcontainer') is within the 'story-travel' <section>.
When Juicebox tries to loading the galleries into the respective gallery containers, the containers no longer exist on the web page because they have been removed by the code within 'parallax.js'.

The comment on your main web page regarding the 'parallax.js' file suggests that it may cause problems :

<!-- parallax.js really screws with the DOM, so make sure it's included last so other things don't notice :) -->

I do not know exactly how your web page has been designed to function (over 12 external CSS and JavaScript files are loaded on your page so it is difficult to see exactly what is going on) but if your web page somehow reinstates the elements which were initially removed by 'parallax.js' (perhaps when links are clicked), then the solution to your problem would be to delay loading your galleries until such a time that the required gallery containers are present and part of the DOM.
You could put your gallery's embedding code into a JavaScript function and run the function when a link is clicked using a jQuery .click() handler (as your web page already loads and uses jQuery).

Otherwise, an alternative would be to fiond a solution which does not use 'parallax.js'.

I've fixed up some of the code, but honestly when I first posted this, it worked when only one gallery is used;

This might be because 'parallax.js' removes DOM elements which are not initially displayed on screen (initially hidden by and accessed via a menu system) when the web page is loaded.

3,487

(8 replies, posted in Juicebox-Pro Support)

Having uploaded your entire gallery folder, the embedding code is all you need.
It looks like the problem is that your gallery folder is named 'Juicebox Namur' but the two paths in your embedding code use 'Juicebox_Namur' (notice the underscore instead of a space). Make sure that the name of the gallery folder in the paths in your embedding code matches the name of the gallery folder on your web server.

3,488

(2 replies, posted in Juicebox-Pro Support)

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

3,489

(8 replies, posted in Juicebox-Pro Support)

If you would like to manually embed a Juicebox gallery in a Drupal page, I would recommend using the baseUrl method of embedding as documented here.

Essentially, you would create a gallery with JuiceboxBuilder-Pro, upload the entire gallery folder (not just the contents) to your web server and paste the baseUrl embedding code into your web page.
It does not matter where you upload the gallery folder to on your web server as long as the paths within the embedding code (the path to the 'juicebox.js' file and the baseUrl itself) are correct.

You do not need to upload your gallery folder to a location within your Drupal installation and you do not need to use the Juicebox files from their location within the Drupal module (although you can if you like).

For example, if you have a gallery folder named 'my_gallery_folder' and you upload the entire folder to the root directory of your web server (into your 'public_html') folder, then the embedding cdoe you would use would look something like this:

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

To directly answer your query above, there are a few problems with the code you use.
(1) If using an absolute URL, it should start with 'http://'.
(2) The 'public_html' folder name does not form part of the publicly accessible path.
(3) Your baseUrl line of code should have a comma (',') after it as there are further configuration options after it.

Therefore:

<script src="www.joaqimb.be/public_html/sites/all/libraries/juicebox/juicebox.js"></script>

... would become:

<script src="http://www.joaqimb.be/sites/all/libraries/juicebox/juicebox.js"></script>

... and:

baseUrl : "www.joaqimb.be/public_html/sites/all/libraries/juicebox/classic/img/Juicebox Namur"

... would become:

baseUrl : "http://www.joaqimb.be/sites/all/libraries/juicebox/classic/img/Juicebox Namur/",

Rather than using absolute paths, I would recommend using the leading slash notation (to denote your root directory) rather than hard-coding the 'www' subdomain into your patsh so that your galleries display on both www.joaqimb.be and joaqimb.be.
Try using the the following lines of code in your embedding code:

<script src="/sites/all/libraries/juicebox/juicebox.js"></script>
baseUrl : "/sites/all/libraries/juicebox/classic/img/Juicebox Namur/",

3,490

(5 replies, posted in Juicebox-Pro Support)

Your galleries themselves seem to be OK. The 'config.xml' files and images seem to be in the correct locations on your web server. The problem seems to be with your embedding page.

When I load your web page, it initially seems to load OK but then some code on your web page appends #home to the URL and this is when the 'Juicebox Error: Cannot find div with id: "travelcontainer"' message is displayed and the browser fails to load the page (with a continuous spinning icon in the browser tab).

First of all, try fixing the errors on your web page so that the code on your web page validates correctly.
You can check the code on your web page with the W3C Markup Validation Service and then fix the errors reported.

Also, try removing whatever code is adding #home to the URL when the web page loads to see if this helps.

Please see this FAQ:
My images show locally, but not when I upload them to my website. Why?

Also, looking at your gallery's XML file, the first image in your gallery should be located here:
http://www.creation.se/webbtest/images/1_startsida.jpg
.. but going directly to that location in a browser results in an error 404 (file not found).
Please check that you have uploaded your gallery's 'images' and 'thumbs' folders to the correct location on your web server (inside your 'webbtest' directory) and make sure that the permissions on the folders and files are not too restrictive. Default permissions of 755 for folders and 644 for files should be fine.

3,492

(4 replies, posted in Juicebox-Lite Support)

when I give you the url everyone is capable to look in it, or am I wrong?

That is correct, although I will not be able to check the structure of your gallery and the paths within your gallery's XML file if I am unable to see the gallery. (If you post the URL to your gallery, I will delete it from your post once I have a note of it.)

must the images be placed in a particular folder?

The images for your gallery certainly need to be in a particular place. However, the correct location of the images will depend on where the Drupal module expects them to be. If I were to see your gallery, I could tell you where the code is looking for the images.
If you want to check this yourself, view the source of your gallery's web page in your browser, search for the 'configUrl' string, copy the value of the 'configUrl' and paste it into your browsers address bar to open the XML file in a new tab. Now check the 'imageURL' entries to see where Juicebox expects your images to be. If the 'imageUrl' paths are relative, they will be relative to the HTML document which contains the gallery's embedding code.

I would certainly recommend posting your query in the Drupal forum. It is likely that the author of the module has seen this problem before, may know what is causing it and should hopefully be able to suggest a solution for you. Your query certainly seems to be more related to Drupal and the use of the Juicebox module for Drupal than with Juicebox itself. (The structure of a Juicebox gallery created with the Juicebox module for Drupal will be determined by the module's code.)

3,493

(1 replies, posted in Juicebox-Pro Support)

You will need to upgrade to Juicebox v1.4.2 in order for your Flickr gallery to work.
Please see this Juicebox blog entry for more information.
Details on how to upgrade Juicebox can be found here.

3,494

(4 replies, posted in Juicebox-Lite Support)

Please post the URL to your gallery so that I can take a look. If I am able to see your gallery, I might be able to determine the cause of the problem.
However, it sounds like a problem with the Juicebox module for Drupal (which we did not write ourselves) rather than with Juicebox itself. If so, please post your query in the Drupal forum where the author of the module will be able to help you further.

There is no shortcode attribute that WP-Juicebox uses that would alter the size of images within a Picasa Web Album.
Juicebox already dynamically resizes images so that they fit within the gallery's image area. If speed of delivery is your main goal, then the only way to improve this would be to fetch smaller images from Picasa. Even if there was a shortcode attribute available, the most it could do is fetch the full-size image from Picasa and then resize it on the web server. This might result in smaller images being passes to the gallery but it might also result in a delay to the initial loading of the gallery as more processing would be involved.
If you are a Juicebox-Pro user, you might like to change the imagePreloading configuration option from its default value of PAGE to NEXT. This should speed up the initial loading of the gallery as only the next image in the gallery will be preloaded (rather than the all the images on the thumbnail page).

3,496

(496 replies, posted in Juicebox-Pro Support)

@Tiphaine

It would be much easier to implement direct download functionality if all browsers supported the HTML 5 download attribute but this is not yet the case. Please see here for a list of browsers which currently support this feature.
If you would like to try this (though it will only work in the browsers listed in the link above), you could include a link within each image's caption using the 'download' attribute such as the following:

<caption><![CDATA[<a href="images/image.jpg" download="image.jpg">Click here to download image.</a>]]></caption>

If entering the caption directly into JuiceboxBuilder-Pro (in a 'Caption' text field on the 'Images' tab), you would enter just the following:

<a href="images/image.jpg" download="image.jpg">Click here to download image.</a>

JuiceboxBuilder-Pro will enclose the caption in the <caption> and CDATA tags automatically behind the scenes so there is no need to enter them into JuiceboxBuilder-Pro.
(You would need to include them only if entering the caption manually by editing the 'config.xml' file in a plain text editor.)

The href="images/image.jpg" part is the path to the file which will be downloaded. You can use an absolute path (such as http://www.example.com/gallery/images/image.jpg) or a relative path (as in my example above). If using a relative path, it will be relative to the HTML page containing the gallery's embedding code.

The download="image.jpg" part is the name which will be given to the file when the user downloads it. (It does not have to be the same as the image's filename, although it should have the same file extension.)

The Click here to download image. part is the text that will be displayed on screen as the caption which, when clicked, will download the file.

Please remember that this will work only in certain browsers and visitors to your web site using browsers which do not support this HTML 5 attribute (such as Internet Explorer and Safari) may wonder why this feature in your gallery does not work as expected. (You may wish to add a note somewhere on your web page to say that direct download functionality is available only in Firefox, Chrome and Opera.)

I hope this helps.

The problem with editing existing galleries and setting default values seems to be only with WebKit based browsers as the problem happens in both Chrome 36.0 and Opera 22.0.
I will investigate the problem further but in the meantime, a quick and easy fix is to open the 'wp-juicebox/js/edit.js' file in a plain text editor and remove lines 9, 10 and 11:

jQuery('input', '#jb-edit-action, #jb-set-action').click(function() {
    jQuery('input', jQuery(this).parent()).prop('disabled', true);
});

This will not affect the functionality of WP-Juicebox.

3,498

(1 replies, posted in Juicebox-Pro Support)

Unfortunately, there is currently a known bug (which should hopefully be fixed in the next version of Juicebox) whereby the value of the expandInNewPage configuration option can change the scale of the embedding page. This may be the cause of your problem.
If your gallery currently sets expandInNewPage="TRUE", then try setting expandInNewPage="FALSE" (in JuiceboxBuilder-Pro's 'Customize -> General' section). Conversely, if your gallery currently sets expandInNewPage="FALSE", then try setting expandInNewPage="TRUE".
(Alternatively, try setting expandInNewPage="AUTO" if "TRUE" or "FALSE" do not work.)
As I noted, we hope to have this bug fixed in the next version of Juicebox but, in the meantime, changing the value of expandInNewPage should help.

Please check your email. I have sent you a message.

I don't expect such personal attention from tech support, but that would be great. Thanks.

If there is a chance that there is a bug in WP-Juicebox which some users are experiencing, I would like to get to the bottom of it and fix the problem if possible. Thank you for allowing me access to your web server and WordPress installation.

Is there a way to change that to look at the actual browser size?

No. The logic which is used to determine which Screen Mode to use when screenMode="AUTO" is within the 'juicebox.js' JavaScript file which is packed and obfuscated and cannot be changed.

And is it possible to change the resolution that the Juicebox switched from LSM to SSM?

No. This is not a user-changeable option.

If you really want to force Small Screen Mode on the Nexus 7, then you would need to detect the device being used with JavaScript and if it is the Nexus 7, then you would set screenMode="SMALL" in the gallery's embedding code (otherwise, you would set screenMode="AUTO" for Juicebox to use its own detection routine).
For example:

<!--START JUICEBOX EMBED-->
<script src="jbcore/juicebox.js"></script>
<script>
    var sm = 'AUTO';
    if (navigator.userAgent.match(/Nexus 7/i)) {
        sm = 'SMALL';
    }
    new juicebox({
        containerId: 'juicebox-container',
        screenMode: sm
    });
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

If you wanted to incorporate this into WP-Juicebox, then you would need to open the 'wp-juicebox.php' file in a plain text editor and insert the following line between lines 286 and 287 (code above condensed for ease of insertion into WP-Juicebox):

$string_builder .= '        screenMode: navigator.userAgent.match(/Nexus 7/i) ? "SMALL" : "AUTO",' . PHP_EOL;

Please note that screenMode is a Juicebox-Pro option which is not available in Juicebox-Lite (the free version).