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).
You are not logged in. Please login or register.
Juicebox Support Forum → Posts by Steven @ Juicebox
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).
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".
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.
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.
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.
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).
My sample code is a complete gallery 'index.html' page.
It would be difficult to incorporate this within Showkase as Showkase builds web pages from many source files.
You could perhaps edit a gallery's 'index.html' page (once the gallery pages have been built) but the code above relies on the gallery's background being transparent, which may not be suitable for your scenario.
Juicebox was not designed to allow for different background colors in normal and fullscreen modes and this is the best solution that I can think of.
With the single-site license, you can have an unlimited number of galleries on an unlimited number of pages (as many galleries per page as you like) as long as all your galleries are hosted on the same domain (and any subdomains).
It might need a little tweaking depending on your own scenario but here is an example which has a gallery with a red background in normal mode and a #d9d9d9 background in fullscreen mode:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Juicebox-Pro Gallery</title>
<meta charset="utf-8" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<style type="text/css">
body {
margin: 0px;
}
</style>
</head>
<body>
<!--START JUICEBOX EMBED-->
<script src="jbcore/juicebox.js"></script>
<script>
jb=new juicebox({
containerId : 'juicebox-container',
galleryWidth: '400',
galleryHeight: '400',
backgroundColor: 'rgba(0,0,0,0)'
});
jb.onExpand = function(isExpanded) {
if (isExpanded) {
document.body.style.backgroundColor="#d9d9d9";
document.getElementById("jb-glry-dlg").style.backgroundColor="#d9d9d9";
} else {
document.body.style.backgroundColor="#ffffff";
document.getElementById("jb-glry-dlg").style.backgroundColor="#ff0000";
}
};
</script>
<div id="juicebox-container" style="background-color: #ff0000;"></div>
<!--END JUICEBOX EMBED-->
</body>
</html>
There is no App (or any other method) that will allow you to create and upload a Juicebox gallery from a mobile device.
As an alternative to my Flickr suggestion, you could first set up a Juicebox gallery (on your computer) using a PHP file to read the contents of a directory and to display the images contained with that directory in your Juicebox gallery.
Please see this forum post for an example of such a PHP file.
You could then upload your images to the specified directory on your own web server using an FTP App.
As far as relative and absolute URLs are concerned, how can I modify the code where the absolute and relative URLs are included?
Try the following embedding code (the leading slash in the URLs denotes the root directory):
<!--START JUICEBOX EMBED-->
<script src="/juiceboxhomepage/jbcore/juicebox.js"></script>
<script>
new juicebox({
containerId : 'juicebox-container',
galleryWidth: "550",
galleryHeight: "475",
backgroundColor: "rgba(0,0,0,0)",
baseUrl : '/juiceboxhomepage/',
});
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->
Thank you for providing the URL to your gallery.
You have chosen to display the 'Info Button' in your gallery.
As noted in the description for the showInfoButton configuration option in the Button Bar Options section of the Config Options page:
If set to TRUE, then the default behaviour controlling overlay visibility is disabled.
You can now toggle the overlay on and off by tapping on the Info Button rather than anywhere on the screen.
Juicebox uses only one backgroundColor configuration option for both normal and fullscreen modes.
You could try changing the background color of the gallery container using JavaScript when the Juicebox-Pro API method onExpand() is fired.
@marcrmiller
Your gallery displays and functions OK in IE10 on my PC (and also in Firefox 19.0.2, Chrome 25 and Safari 5.1.7).
Please note that as you have use the www.cal500.com subdomain in the URLs within your embedding code, your gallery will display only when you access your web site using the www.cal500.com subdomain (and not when going to the main cal500.com domain).
All gallery files must be on the same domain (or subdomain) as the web page containing the embedding code due to the JavaScript same origin policy.
One solution to this would be to use relative URLs (rather than absolute URLs) in your embedding code.
You could perhaps first set up a Juicebox gallery (on your computer) using a Flickr account as the source of images.
You could then upload your images from your iOS device to your Flickr account and they would then appear in the Juicebox gallery without any modification to the gallery itself.
Juicebox does not currently have the ability to horizontally or vertically align the main images within the image area.
We plan to introduce new configuration options to allow such positioning in the next version of Juicebox-Pro (though I do not know when it will be released).
As long as showImageOverlay="AUTO" (which is the default value for this configuration option), then tapping on the screen should toggle the overlay. However, this will not happen if you set showImageOverlay="ALWAYS" or showImageOverlay="NEVER".
If this does not help, please post the URL to your gallery so that I can take a look.
@contactgeoff
I notice that your gallery uses Juicebox-Pro v1.1.1. Please try upgrading to the current version (v1.2.0) to see if this makes a difference.
Please see the Upgrading Juicebox page for details.
Looking at the source of the page which does not function as expected on mobile devices, I notice that your two galleries use different configuration options. The gallery that does not function as expected uses a Splash Page (whereas the other gallery sets useSplashPage="NEVER"). It is possible that there is a CSS conflict which affects only the Splash Page. (The gallery itself functions OK once the Splash Page is clicked.)
Try using the same configuration options for both galleries to see if this makes a difference.
What I am saying in my post above is that both of your galleries (http://chesterfieldsbronzes.com/temp/ and http://chesterfieldsbronzes.com/temp/test2/) scale dynamically with the size of the user's browser window.
If this does not happen in your own browser, try clearing your browser's cache to ensure that it is not hanging onto and using older versions of your gallery files.
Your gallery at http://chesterfieldsbronzes.com/temp/ does scale dynamically with the size of the user's browser window.
If you reduce the width of your browser window, you will see the number of thumbnails in the gallery reduce and when the gallery's width becomes smaller than the width of the main image, the main image shrinks to fit.
Likewise, reduce the height of your browser window and you will see the main image shrink to fit the available space.
Please bear in mind that because you have more content on your page than just the gallery itself, you may need to scroll down your page to see the gallery resize when changing your browser window's dimensions.
By the way, please view the first link on a phone it is totally broken.
It looks like there may be a conflict between the CSS in your current theme and that of the gallery itself.
Try temporarily reverting to the default WordPress theme to see if this makes a difference.
There is a lot of generalized CSS at the top of your theme's 'wp-content/themes/dynamik/css/dynamik-min.css file' which the gallery will inherit.
For example, there are CSS rules in that file that apply to all <div> and <img> tags on your page, including those in your gallery. Try removing this generalized CSS from the 'wp-content/themes/dynamik/css/dynamik-min.css' file to see if it helps.
@Michal
Checked the code in http://validator.w3.org/ as well and the only errors that it shows are in the code that's generated by JuiceboxBuilder-Lite - it expects "type" for <script>.
This is only because your page uses the XHTML 1.0 Transitional Doctype Declaration.
If your page uses the HTML5 Doctype Declaration (like the sample 'index.html' page in the 'web' folder), then you would not get this error message.
Still the same result : Juicebox Error: Config XML file not found happens sometimes (even though it's not Config.XML any more).
The error message refers to a generic 'configuration XML file' rather than a specific file named 'config.xml'.
BUT it does load it if I refresh. Sometimes one refresh is enough, sometimes needs more.
Your page loads the 'juicebox.js' file twice (from two different locations):
<script type="text/javascript" src="./nieswiateczne/jbcore/juicebox.js"></script>
<script src="swiateczne/jbcore/juicebox.js"></script>
Try removing one of them to see if this makes a difference.
Also, it should not make a difference but try renaming your XML files to the default 'config.xml' and then remove the configUrl option from your embedding code.
Perhaps a temporary glitch on your web server or a browser caching issue.
1. I have to add captions to photos after I upload them because the caption filed doesn't seem to relate to the IPTC captioning fields
That is correct. A WP-Juicebox gallery sourced by images in the WordPress Media Library uses the Media Library's Title and Caption fields for the Juicebox titles and captions.
2 the order I have the images in is never maintained when I upload and so I always have to rearrange them - even if there was a button to rearrange by file number would help.
When you upload images, WordPress (not WP-Juicebox) attaches them to the post in a certain order and when displaying a gallery, WP-Juicebox simply asks WordPress for a list of attached images and display them in the order given.
If you wish to change the order of images in a gallery (in WordPress 3.5 or later):
'Edit' the post that contains the gallery
Click the 'Add Media' button
Go to the 'Insert Media -> Media Library ' section (which should be displayed by default)
Select 'Uploaded to this post' from the list of options in the combobox
Drag and drop the images into the order that you require
Close the 'Add Media' window
What is the process for adding this gallery to my WordPress site?
If you want to embed a Juicebox gallery (which was not created by WP-Juicebox) in a WordPress page or post, then follow the baseUrl instructions here.
Essentially:
(1) Create a Juicebox gallery with the method of your choice.
(2) Upload the complete gallery folder to your web server.
(3) Paste the baseUrl embedding code into the body of your WordPress page or post (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 you know where it is and that the two paths within the baseUrl embedding code (the path to the 'juicebox.js' file and the baseUrl itself) are correct.
Make sure that all your thumbnail images have been uploaded successfully to the correct location on your web server. Also, make sure that your image filenames contain only web-safe characters (uppercase and lowercase letters, decimal digits, hyphen, period, underscore, and tilde).
This FAQ may also help:
My images show locally, but not when I upload them to my website. Why?
If you continue to experience difficulties, please post the URL to your gallery so that I can take a look.
Juicebox Support Forum → Posts by Steven @ Juicebox
Powered by PunBB, supported by Informer Technologies, Inc.