You're welcome!
It sounds like you've got it working now.
You are not logged in. Please login or register.
Juicebox Support Forum → Posts by Steven @ Juicebox
You're welcome!
It sounds like you've got it working now.
@stuart141simon
Thank you for your your suggestion.
In Small Screen Mode (where screen real estate if often limited), the caption area and Button Bar are overlaid on top of the image but their visibility can be toggled on and off (so that the image can be viewed on its own) by tapping the screen.
However, if you like, you could set captionPosition to a non-OVERLAY value, set buttonBarPosition="TOP" and then set screenMode="LARGE" to have the gallery displayed in Large Screen Mode on all devices and in all browsers.
By doing so, the caption area and Button Bar will never obscure the main images (in any device or browser).
I understand that this is not an ideal solution to your suggestion (in Large Screen Mode, thumbnails are displayed alongside the main images taking up more screen real estate, which is why Small Screen Mode exists) but it might be suitable for some other users reading this thread.
With regard to the "Can't find variable jb" message, make sure that you are using:
var jb = new juicebox(
... and not just:
new juicebox({
... in your gallery's embedding code.
Also, try using:
jb.onInitComplete = function() {
$('#jb-glry-id-0').focus();
};
... instead of:
jb.onInitComplete = function() {
$('#juicebox-container').find(':first-child').focus();
};
No, unfortunately not.
The code which handles the direct linking functionality is buried within the 'juicebox.js' JavaScript file which is packed and obfuscated and cannot be modified.
Please see this forum post for a possible solution to your problem.
Hopefully it will help.
Thank you for the screenshots demonstrating your problem.
Please see this FAQ:
My Juicebox gallery shows too much space above or below the main image, how do I fix this?
The problem is one of aspect ratios.
With a responsive gallery, you essentially have no control over the aspect ratio of your gallery. It will depend on the dimensions of the user's browser window. However, the aspect ratio of your images remains constant (as long as they are not cropped).
In your large monitor screenshot, your gallery fills the viewport and your images are scaled as large as possible without cropping. If they were scaled any larger, then cropping would occur. (If you reduce the browser window height, you will see the space above and below the images decrease.)
Possible solutions would be to:
(1) Fix your gallery's dimensions so that the aspect ratio of the gallery's image area always matches that of the images themselves.
(2) Set imageScaleMode="FILL" so that the images fill the image area (although the images may be cropped).
(3) Reduce the height of your gallery so that the space above and below the images is minimized.
Otherwise, you might need to accept that your gallery may not look exactly as you would like it to be in every browser window shape. Juicebox does its best to adapt to all screen sizes but it's difficult to make a gallery displaying images of a certain aspect ratio fill browser windows of different shapes.
Also, make sure that your images are at least 1920 x 1080 in size so that they need to be dynamically scaled down slightly by Juicebox when the gallery is displayed. This will ensure that your images are always displayed as large as possible within the image area.
Using the default setting of imageScaleMode="SCALE_DOWN", small images are not scaled up so if your images are not large enough to fill the image area, then they will not be scaled up and there may be more space surrounding them than is necessary.
You could set imageScaleMode="SCALE" to scale small images up to fill the image area but this would decrease their visual quality. It would be better to feed Juicebox larger images.
I hope these notes help.
I'm adding it to the Title in JBx.
That's where it should go.
Adding <span class="fixed"></span> to an image title simply marks the image to be in a fixed position (the position it is displayed in the JuiceboxBuilder-Pro 'Images' tab). This marker will not be displayed as the image title in the gallery. (It is still possible to use the image title if you want to. Just add your normal image title text before or after this marker.)
In your screenshot, the second image in your gallery should remain in position #2 whilst the other images will be displayed in a random order around it.
The script above (the most recent one) allows you to fix images with two methods (simultaneously, if you like):
(1) via the $fixed array in the code and ...
(2) by marking images with <span class="fixed"></span> in the image titles.
If you choose to use the image title method only, then change:
$fixed = array(1, 2, 3, 8, 11, 12);
... to:
$fixed = array();
... at the top of the code.
(The numbers were there just as an example.)
I haven't purchased this product yet, so apologies for posting this in the forum.
No problem at all!
Is there a download feature built into the product?
Please see this FAQ:
How do I allow or prevent users from saving gallery images?
It is not possible to right-click and save an image in a Juicebox gallery (and there is no direct download functionality) but what you could do is set showOpenButton="TRUE" (in JuiceboxBuilder-Pro's 'Customize -> Lite' section) to display the 'Open Image' button on the Button Bar. When the button is clicked, the image will be displayed in a new tab and can be downloaded via the browser's right-click 'Save Image As...' option.
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:
<a href="images/wide.jpg" download="wide.jpg">Click here to download image.</a>
The href="images/wide.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/wide.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="wide.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 only work 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.)
The suggestions above will work equally well with Juicebox-Lite (the free version) and Juicebox-Pro so you could try things out with Juicebox-Lite before purchasing Juicebox-Pro.
Juicebox-Lite can be downloaded from this web page.
I hope this helps.
thanks for the explanation,
You're welcome.
... now everything works fine.
That's great to hear. Thank you for letting me know.
It was a bit tricky with the default color for the expanded background color, because it was the color I preferred.
Although default values are not written to the gallery's XML file, you can use a custom background color and still use the default expanded background color by opening your gallery's XML file in a plain text editor and adding expandedBackgroundColor="rgba(34,34,34,1)" as an attribute to the opening <juiceboxgallery> tag.
If you like, you could set a non-default value for the expanded background color in JuiceboxBuilder-Pro so that there is an expandedBackgroundColor entry present in the gallery's XML file (as you are currently doing by changing the opacity to 0.9) and then just open the file in a plain text editor and change the value (in your case, change the opacity to 1).
I'm going to punt on this and move on.
No problem if you want to move on but please feel free to post your web gallery's URL if you'd like me to take a look.
There might be something else on your web page alongside your gallery which is causing the problem.
WordPress pages tend to have a lot of content and can load a lot of external JavaScript files. You might like to try temporarily disabling all plugins other than WP-Juicebox and then checking out your gallery's web page in Chrome to see if the problem still occurs (or if the problem is perhaps related to another plugin).
Also, please make sure that you are using the latest version of Juicebox (v1.4.4.2) to ensure that any bugs from previous versions are not contributing to your problem.
You can download the latest version of WP-Juicebox from the plugin's support page here.
And with some of the limitations within Juicebox, I think I need to look elsewhere.
Again, no problem at all if you want to leave things as they are but Juicebox is pretty flexible. There are a couple of hundred different configuration options and there is also an API to allow the embedding web page to interact with the gallery.
If you find there is something you'd like to do with Juicebox but haven't yet managed to do so, you can let me know.
I might be able to help (or at least confirm whether what you are looking to achieve is possible or not).
@Ruud Westerhout
You're welcome! I'm glad it helped.
@jvp
Unfortunately, there is no way to extract EXIF data via JuiceboxBuilder-Pro or WP-Juicebox.
(JuiceboxBuilder-Pro has the ability to extract the IPTC Document Title for the image titles and the IPTC Description for the image captions.)
The only way to integrate EXIF data into image titles or captions would be to use the Lightroom plugin.
Lightroom has the ability to extract whatever IPTC or EXIF data you like and use it for image titles or captions.
You can build up an image title or caption using the Text Template Editor (see this screenshot).
(This is a feature of Lightroom itself rather than the Juicebox plugin.)
However, I appreciate you taking the time to post your suggestion again.
I do not know which suggestions will be implemented in future versions but this is certainly the best place for all ideas.
Thank you.
There is no reason why a gallery should be slower in Chrome than in any other browsers.
Try completely clearing your Chrome browser's cache before reloading your gallery's web page and check to see if you have any extensions installed in your Chrome browser which might somehow be contributing to the slow speed.
Also, check out our own demo galleries here to see if the same thing happens in your Chrome browser.
Demo Galleries: http://www.juicebox.net/demos/
If you continue to experience difficulties, please post the URL to one of your gallery pages and I'll take a look in Chrome and Firefox and let you know if I notice any difference myself.
It sounds like you have been able to resolve most of your problems.
Can anyone give me a hint how to get these back, so I do not have to re-configure everything new, I already forgot all my settings I had until now.
EDIT: Been active, got most settings back.
Unfortunately, I don't know of an easy way to reinstate interface settings from a previous version of the plugin.
n LR6, it shows that Plugin 1.4.3.0 is still active, this I do not understand.
EDIT: A restart of my PC solved this, now I see the latest version.
Restarting Lightroom with the new plugin in place should have been enough (there should have been be no need to reboot your computer) but I'm glad you've got the new version up and running.
-but now, when I leave the WEB tab and go f.e. to DEVELOP, the next time I enter WEB I notice that again the settings are forgotten and I see a "photos" directory to be where my preferred directory used to be
EDIT: Also this seem to have been a setting in my 'old' LR6 and Plugin combination. At the moment this is working correct.
I'm glad that things seem to have settled down and that you have reinstated your settings.
If you continue to experience difficulties, please let me know and I'll try to help out if I can.
From your screenshot, it looks like you are using the default expandedBackgroundColor of #222222 and opacity 1.
If a default value is set in JuiceboxBuilder-Pro, then the corresponding option will not be written to the gallery's XML file.
Usually, if an option is not present in the settings, then when the gallery is displayed, Juicebox will use the default value.
However, if an expandedBackgroundColor is not explicity set in your gallery, then the actual expanded background color will be the same as the normal background color.
(This is the only option which does this.)
The solution is to make sure that there is an expandedBackgroundColor option present in your gallery settings.
Either:
(1) Change the expandedBackgroundColor (or its opacity) in the JuiceboxBuilder-Pro interface.
... or:
(2) Manually add the expandedBackgroundColor option to your gallery's settings. Instructions for setting options can be found here.
You could open your gallery's XML file in a plain text editor and add expandedBackgroundColor="rgba(34,34,34,1)" alongside all the other options (as an attribute to the opening <juiceboxgallery> tag) or add the following line in your gallery's embedding code in your HTML page (ensuring that all options are separated by commas):
expandedBackgroundColor: "rgba(34,34,34,1)",
In your http://www.reisedampfer.de/html5/norwegen_2014/ page, your gallery's embedding code uses the following line:
backgroundColor: 'rgba(204,204,204,1)'
However, when you embed the gallery in your http://www.reisedampfer.de/app595898963 … wegen-2014 page, the embedding code uses the following line (resulting in a white background):
backgroundColor: "rgba(255,255,255,1)"
Change the backgroundColor in the embedding code to either rgba(204,204,204,1) (to match the background color of your page) or rgba(0,0,0,0) (for the gallery's background to be fully transparent so that your own page's background shines through).
If you want to set a different color for the expanded gallery, use the expandedBackgroundColor configuration option (in JuiceboxBuilder-Pro's 'Customize -> Color' section).
Your gallery does not currently use an expandedBackgroundColor so the expanded background color will be the same as the normal (unexpanded) background color.
@gilles9999
The Splash Page always shows just a single image and a link to expand the gallery.
If you want to display a grid of thumbnails, set:
screenMode="SMALL" (in JuiceboxBuilder-Pro's 'Customize -> General' section)
showSplashPage="NEVER" ('Customize -> Splash Page')
The user will be able to expand the gallery via the Expand Button as long as you set showExpandButton="TRUE" ('Customize -> Lite').
I'm glad you've been able to resolve your problem.
Thank you for letting me know.
Rotation can certainly be challenging at the best of times and there seems to be little consistency between programs, even between browsers. (I've seen examples of images which display differently in Chrome and Firefox.)
Often, the best course of action is to strip the EXIF information (at least the orientation flag) from the image and then rotate it until it is visibly correct.
You're welcome!
I'm glad you've got it working as you like. Thank you for posting back to let me know.
Just something to keep in mind for the future feature list.
Please post suggestions for future versions in the Feature Requests forum thread.
This keeps all the ideas together and ensures that they are not overlooked by the developers.
Thank you.
Please see this note regarding Using Percentage Heights.
Also, you might like to take a look at this forum thread which has an example of how to keep a gallery's aspect ration constant.
I hope this helps.
@ion.rogozea
Thank you for your suggestions.
Unfortunately, there is no built-in way to navigate between galleries within Juicebox.
(We have Showkase as an automated way to index and organize multiple galleries.)
when the user clicks Next on the last image of a gallery, to jump to a certain URL
Perhaps the easiest way to do something similar would be to include a link in the last image's caption.
For example:
<caption><![CDATA[<a href="http://www.example.com/gallery2/index.html" target="_self">Click here to view Gallery #2.</a>]]></caption>
In Small Screen Mode, Juicebox uses the Splash Page by default.
You can disable the Splash Page by setting showSplashPage="NEVER" (in JuiceboxBuilder-Pro's 'Customize -> Splash Page' section).
Alternatively, you could display your galleries in Large Screen Mode (which does not use the Splash Page by default) on all devices by setting screenMode="LARGE" ('Customize -> General').
This should hopefully solve your problem.
More information about Screen Modes and the Splash Page can be found in the Gallery Tour.
I'm running V1.4.3...
First of all, I'd recommend upgrading to the latest version (v1.4.4.2) as many bugs have been fixed since v1.4.3.
Please see the Version History for a list of changes between versions.
Instructions for upgrading can be found on the Upgrading Juicebox support page.
If you want to disable the auto hide functionality of the image overlay overlay, set inactivityTimeout="0" (in the 'Customize -> Main Image' section).
If you want the image overlay to always be displayed, set showImageOverlay="ALWAYS" instead of its default value of AUTO ('Customize -> Main Image').
If you want the image navigation buttons to always be displayed, set showImageNav="ALWAYS" ('Customize -> Main Image'). The image navigation buttons can be positioned relative to the STAGE or the IMAGE via the imageNavPosition configuration option (also in the 'Customize -> Main Image' section).
I hope this helps.
For reference, a complete list of configuration options can be found here.
If you continue to experience difficulties, please post the URL to your gallery so that I can take a look.
Also, let me know what you see and what you expect (or hope) to see so that I can hopefully help further.
(I'm not sure which button you mean when you say "all of the buttons except the first".)
Thank you.
Please see my reply to your query in this forum thread.
I hope it helps.
It might be easier for you to leave the main images in your gallery (Juicebox was not intended for use without main images) and set imageClickMode="OPEN_URL" so that the corresponding linkURL is opened when the user clicks anywhere on a main image.
Juicebox Support Forum → Posts by Steven @ Juicebox
Powered by PunBB, supported by Informer Technologies, Inc.