You are not logged in. Please login or register.
Juicebox Support Forum → Posts by Steven @ Juicebox
@Joel
According to this web page, it sounds like the Share Dialog may be available only from within other Apps (rather than web pages).
Please post suggestions in the Feature Requests forum thread.
This keeps them all together and ensures that they are not overlooked. Thank you.
The social sharing buttons work fine on the desktop version, correctly referencing the image as contained within the local gallery and posting the correct thumbnail with the exception of Google+ which references the Flickr gallery, not the local one. (Is there any way to change this?)
This cannot be changed and is due to a limitation of the Google+ Share Link which supports only a single URL. Please see this forum post for further details.
On the mobile site however, the Facebook share doesn't work at all.
Thank you for reporting. I have logged this as a bug report.
While all the other buttons do (Google+ still referencing Flickr of course, not the local gallery) they point through the browser to the mobile sites of the social networks instead of through the native app. This seems pretty cumbersome to me and I'd like to know how to change it.
This cannot be changed as Juicebox does not support integration with Social Sharing Apps.
The shared links are simply web site URLs and, as such, are opened in the default web browser.
The image file names themselves should not contain spaces but your image Titles and Captions (which are displayed on-screen in the gallery) can contain spaces and other characters if you like.
You can enter whatever text you like in the Title and Caption text fields in JuiceboxBuilder-Pro.
You may even want to embed Titles and Captions within the images themselves (in the IPTC metadata) using an imaging program such as Adobe Photoshop and then extract these for use in the gallery by going to 'Images -> Titles -> Use IPTC Title' and 'Images -> Captions -> Use IPTC Caption'.
I do not know what could be causing this error message.
Unfortunately, debugging this problem may require some trial and error and perhaps the best course of action would be to remove elements from your web page, one by one, until the error no longer occurs and you find the cause of the problem.
So, can you tell me if what I am seeing here is of any potential danger?
There is no danger. What you are seeing is just the gallery's XML file which stores the image information used to display the gallery.
Although the page is generated dynamically by a PHP file, it is essentially just a web page and Google is indexing it like any other web page.
If you want to prevent Google from indexing this '/wp-content/plugins/wp-juicebox/config.php' file on your web site, you could try using a 'robots.txt' file. Please see this web page for details.
You can embed multiple galleries using the baseUrl method as documented here.
You can keep each gallery as a self-contained entity in its own folder and upload the complete gallery folders to your web server but all the HTML pages into which the galleries are embedded can be anywhere on your web server (all in the same folder if you wish).
A Juicebox gallery will resize dynamically with the size of the user's browser window only if the dimensions of the gallery itself and those of all parent containers are expressed as percentages. If there is an absolute pixel value anywhere up the chain, the gallery's size will become fixed (e.g. 100% x 100% x 800px = 800px).
The example you quoted has a header of a fixed height and then uses jQuery to assign new fixed height (not a percentage) to the gallery each time the user's browser window is resized.
You can view the source of the sample web pages in a browser and copy/modify them to suit your needs.
As an example, if you wanted a web page with a fixed height header and a gallery which takes up the remainder of the available space in the user's browser window, take a look at this forum post.
For reference, the Embedding Multiple Galleries support section can be found here.
You can view the source of the sample web pages in a browser and copy/modify them to suit your needs.
As an example, if you wanted a web page with a fixed height header and a gallery which takes up the remainder of the available space in the user's browser window, try the following as your gallery's 'index.html' page.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Juicebox Gallery</title>
<script type="text/javascript" src="jbcore/juicebox.js"></script>
<style type="text/css">
html, body { height: 100%; overflow: hidden; }
body {
margin: 0;
padding: 0;
background-color: #222;
color: #666;
font-family: sans-serif;
font-size: 20px;
}
#header {
text-align: center;
background-color: #333;
width: 100%;
height: 20px;
padding: 10px 0;
}
#juicebox-content {
width: 100%;
}
</style>
<script type="text/javascript">
function doLayout() {
var winHeight, footerHeight;
winHeight = window.innerHeight ? window.innerHeight : $(window).height();
headerHeight = $('#header').outerHeight();
var newH = parseInt(winHeight) - parseInt(headerHeight);
$('#juicebox-content').height(newH);
}
$(document).ready(function () {
doLayout();
$(window).bind('resize', doLayout);
new juicebox({
containerid: 'juicebox-container'
});
});
</script>
</head>
<body>
<div id="header">
<span>Header content goes here</span>
</div>
<div id="juicebox-content">
<div id="juicebox-container"></div>
</div>
</body>
</html>Thank you for providing the URL to your gallery.
Most of the errors on your web page are caused by having spaces in your image filenames.
As the image filenames form part of a URL when uploaded to a web server, it would be wise to use only web-safe characters.
Please see section 2.3 of this document for details: http://www.ietf.org/rfc/rfc3986.txt
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.
Juicebox-Pro (and all web servers) should be able to handle all images whose filenames use any or all of these characters.
Also, your splashPageUrl contains a backslash which should be changed to a slash.
Change:
splashImageUrl="http://64photosfromrodeodrive.com\Splash2.jpg"... to:
splashImageUrl="http://64photosfromrodeodrive.com/Splash2.jpg"So, is there no way to close an image that's opened from an expanded gallery while viewing from an ipad?
An image that's opened from an expanded gallery is simply an image displayed in a browser tab/window of its own.
The only way to close it would be to close the tab/window using the browser controls (as if it was a tab/window displaying any other web page).
If I could just tap to close the big image that was just opened that would be terrific
Instead of having the Open Image button display just the image in a new tab/window (which it does by default), you could display a simple web page (which could be generated dynamically from within gallery's 'index.html' page using JavaScript) which would display the image as a link to close the window.
First of all, you would need to set all the linkUrls in your gallery's XML file to point to a JavaScript function within the gallery's 'index.html' page (in this example named func()). You would also need to set all the linkTargets to '_self'.
For example:
<image imageURL="images/image.jpg" thumbURL="thumbs/thumb.jpg" linkURL="javascript: func();" linkTarget="_self">The JavaScript function would determine the URL of the current image using the Juicebox-Pro API (specifically the getImageIndex() and getImageInfo() methods).
A new window with the required code could then be opened using JavaScript.
At its most basic, a gallery's HTML 'index.html' page might look like this:
<!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'
});
function func() {
var index = jb.getImageIndex(); // Get current image index
var info = jb.getImageInfo(index); // Get current image info
var url = info.imageURL; // Get current image URL
var win = window.open("", "_blank");
win.document.writeln("<html>");
win.document.writeln("<body>");
win.document.writeln("<a href='#' onclick='javascript: window.close(); return false;'>");
win.document.writeln("<img src='" + url + "' alt='Click to close' />");
win.document.writeln("</a>");
win.document.writeln("</body>");
win.document.writeln("</html>");
win.document.close();
}
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->
</body>
</html>You could configure the new window using the available window.open() configuration options.
Please check your email.
I have sent you a message.
Juicebox galleries are compatible with all modern browsers (on both Mac and PC).
Here are a couple of things to check.
(1) Make sure that you are using the latest version of Juicebox-Pro (v1.3.2).
Instructions for getting the latest version and upgrading existing galleries can be found on the Upgrading Juicebox page.
(2) Try checking the code on your web page with the W3C Markup Validation Service and fix any errors reported.
If you continue to experience difficulties, please post the URL to your gallery so that I can take a look.
This seems to happen only in Mobile Safari. Multiple galleries open fine in Chrome on an iPod Touch but not in Mobile Safari.
Perhaps there is some incompatibility between the JavaScript code on your web page and Mobile Safari.
Try updating jQuery on your web page from v1.8.2 to the current stable version of v1.10.1.
Also update all other JavaScript libraries on your web page (if updates are available) in case this makes a difference.
I would also recommend fixing the HTML errors on your web page in case any of them are contributing to your problem.
You can validate your web page with the W3C Markup Validation Service and then fix the errors reported.
Once the code on your web pages validates correctly, the page should be rendered with greater predictability and consistency across different browsers.
When I click the expand button and the click close gallery that doesn't work.
Try clearing your browser's cache before reloading your gallery to ensure that your browser is not hanging onto and using any of your older gallery files.
If this does not help, please post the URL to your gallery so that I can take a look and let me know what browser(s) this happens in.
I noticed that in the new version #expand is added to the url when you click the expand button.
Can that have something to do with my problem?
This is normal behavior and should not be the cause of your problem.
The 'Open Image' button, by default, opens the image currently being displayed in the gallery in a new browser tab/window.
You can select the target window for the image using the corresponding linkTarget in your gallery's XML file (setting it to _blank, _self, _parent or _top as documented here).
Ordinarily, the user would have to close this tab/window or use the browser's back button (depending on the linkTarget used) to return to the gallery.
This is not the same as the expandInNewPage configuration option which is used when expanding a gallery embedded in a web page to fill the screen in either the same page as the gallery or in a new page (depending on the value used). A gallery can be expanded from either an embedded Large Screen Mode gallery or the Splash Page (in either Small Screen or Large Screen Mode).
For more information about Screen Modes and the Splash Page, please see here.
It is possible to save a preset file anywhere you like on your computer (though I would not recommend saving them alongside the presets which come with JuiceboxBuilder-Pro in the Program Files folder as they will be deleted if you ever uninstall JuiceboxBuilder-Pro, for example, before installing a new version).
If you cannot remember where you saved your preset files, try going through the motions of saving or loading a new preset file to see if the folder you originally used is remembered and automatically opened.
If not, then try searching your hard drive for the name of one of your preset files.
If you cannot remember the names of any of your preset files, you could search your hard drive for all files with a .xml file extension. Hopefully some of the results will look familiar.
hi , any advise on the ability of the software to sync audio to photos apart from letting the show play from the start .
This is not possible using Juicebox-Pro alone. Juicebox-Pro supports only a single audio track which can be started and stopped using the Audio Button on the Button Bar.
You would need to find to find a third party audio player (which can be controlled via JavaScript), listen for the Juicebox-Pro API event onImageChange(id) to be fired (which happens each time the main image in the gallery is changed) and use this to trigger a specific audio track to be played (depending on the image being displayed).
Also is it possible to have the fade transition work on android phone / ipad and iphone .
No. When in Touch Input Mode, the image transition will always be SLIDE (which best matches the swipe gesture used to change the image on mobile devices).
I got v1.3.2 and can not get ITCP data like Camera, Exposure time, ISO, Aperture etc.
JuiceboxBuilder-Pro does not support such IPTC fields.
JuiceboxBuilder-Pro uses the IPTC 'Document Title' and 'Description' fields to populate the gallery image titles and captions respectively. (These IPTC labels are those used by Adobe Photoshop. Other imaging programs may use different labels for these IPTC fields.)
I have read in the forum that one way to get around it is
to rezize the image in another software and unclick "Resize image".
This will prevent JuiceboxBuilder-Pro from processing the images and they will simply be copied across to the gallery's 'images' folder. As the images are not processed by JuiceboxBuilder, they will retain any metadata which is embedded within them but JuiceboxBuilder will still not be able to extract any other IPTC fields for use in the image titles and captions.
Is it possible to get the other info or must I use other software to get
this function?
You can extract the metadata of your choice from your images for use as the image titles and captions when using the Juicebox plugin for Lightroom to create your galleries.
I took a look at the full.html file, and I can't see where the img src tags are being generated (I'm assuming this is in the javascript code).
That is correct.
the larger devices don't seem to be using jbcore/full.html even in SMALL mode
A Juicebox gallery will use the 'full.html' page only if the gallery is expanded in a new page.
Please see the description of the expandInNewPage configuration option (in the General Options section of the Config Options page) and the Expand Gallery Behavior section for more information.
Is there an easy workaround for this?
If the problem occurs only when the gallery is expanded in a new page, then the suggestions in the link above (to either lock the viewport of the embedding page or to set expandInNewPage="FALSE") may work for you. Otherwise, I would recommend using only web-safe characters for folder names when they are uploaded to a web server and form part of a URL.
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.
Juicebox (and all web servers) should be able to handle all folder names which use any or all of these characters.
It is not possible to disable the sourcePath entries from being written to the 'config.xml' file by JuiceboxBuilder.
They are required if JuiceboxBuilder needs to reprocess an image (for example if removing a watermark).
If you really want to remove the sourcePath entries from your gallery's 'config.xml' file, you could remove them all with a single global regular expression search and replace action in a text editor.
If you are using WP-Juicebox, instructions for installation and use can be found here.
If you are not using WP-Juicebox and are embedding your Juicebox gallery manually, then follow the baseUrl embeding method documented here.
Take a look at the FAQs to see if any describe the scenario you are experiencing and offer help.
If you continue to experience difficulties, please let me know what method you are using (WP-Juicebox or baseUrl), describe the problem in more detail and post the URL to the web page into which you are trying to embed your gallery so that I can take a look and help further.
Edit:
If you are not able to install a plugin in Edublogs (to use WP-Juicebox) and do not have access to the web space they provide (to upload your gallery folder manually for the baseUrl method), then you would need to host your gallery elsewhere and embed it in your web page using an iframe.
For details on how to do this, please see the Embedding in a Web Template Site instructions.
Juicebox does not support scrolling thumbnails (whereby thumbnails scroll one-by-one like in the website you quoted) and it would not be possible to integrate the jQuery thumbnail scroller into Juicebox as the logic behind the Juicebox thumbnail paging is in the 'juicebox.js' file which is obfuscated and cannot be modified.
If it's not possible, can I make a request for something similar in JBx 1.4? :) :)
Please post suggestions for future versions of Juicebox in the Feature Requests forum thread.
It keeps them all together and ensures that they are not overlooked. Thank you.
Your caption area is transparent when I view your gallery in IE9 and IE10 (but not in IE8).
The developers are aware of transparency issues in IE8 and are currently investigating solutions.
In the meantime, as the caption area is opaque in IE8, a possible workaround would be to set captionBackColor to a different color than your caption's text (such as the gallery's background color) so that the text is visible (but keep the alpha channel at 0 for full transparency in all other browsers), e.g.:
captionBackColor="rgba(191,221,237,0)"If you are not using IE8, make sure your Internet Explorer browser is not in 'Compatibility View' mode.
There are no configuration options which would allow the Gallery Title to be displayed on main image pages in Small Screen Mode.
However, you could force your gallery to be displayed in Large Screen Mode on all devices and in all browsers (and position the Gallery Title as required using the galleryTitlePosition configuration option) by setting screenMode="LARGE".
For more information about Screen Modes, please see here.
Unfortunately, there is a bug in Juicebox-Pro v1.3.2 whereby the Gallery Title is not displayed if galleryTitlePosition="ABOVE_THUMBS".
A bug report has been logged and this issue should hopefully be fixed in the next version of Juicebox-Pro.
Until then, the only workaround would be to set galleryTitlePosition to any value other than ABOVE_THUMBS.
You can change the position of the caption area within the gallery using the captionPosition configuration option.
The image title will always be displayed above the image caption in the caption area.
You can change the horizontal alignment of both the image title and the image caption using the captionHAlign configuration option.
For reference, all the Caption Options can be found here.
You can change the horizontal alignment of the image title on its own using HTML formatting as documented in this FAQ:
How do I add HTML formatting to image captions and titles?
For example:
<title><![CDATA[<div style="text-align: right;">Title Text</div>]]></title>You could also extract the image title for the currently displayed image using the Juicebox-Pro API (specifically the methods getimageIndex() and getImageInfo() in conjuction with the onImageChange() event) and display it elsewhere on your web page using JavaScript.
For example:
<!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;
}
#text {
width: 400px;
height: 80px;
background-color: #acc2e3;
}
</style>
</head>
<body>
<!--START JUICEBOX EMBED-->
<script src="jbcore/juicebox.js"></script>
<script>
jb = new juicebox({
containerId: 'juicebox-container',
galleryWidth: '400',
galleryHeight: '400'
});
jb.onImageChange = function(e) {
var index = jb.getImageIndex();
var info = jb.getImageInfo(index);
var title = info.title;
document.getElementById("text").innerHTML = title;
}
</script>
<div id="juicebox-container"></div>
<div id="text"></div>
<!--END JUICEBOX EMBED-->
</body>
</html>Juicebox Support Forum → Posts by Steven @ Juicebox
Powered by PunBB, supported by Informer Technologies, Inc.