You are not logged in. Please login or register.
Juicebox Support Forum → Posts by Steven @ Juicebox
Yes (or you could just remove the sourcePath attribute completely).
However, if you do so and JuiceboxBuilder-Pro has to re-process the images, then it will have only the images in the 'images' folder to work with which may not be of as high a quality as the original source images (if they have already been resized).
Despite identical settings, it has tiny thumbnails (nine/row in both Portrait and Landscape), and tiny text & controls.
Your Africa gallery uses Juicebox-Pro v1.4.0 but your Aviation gallery uses Juicebox-Pro v1.3.3.
Upgrade your Aviation gallery to Juicebox-Pro v1.4.0 by replacing the gallery's 'jbcore' folder with the 'jbcore' folder from the Juicebox-Pro v1.4.0 download zip package ('juicebox_pro_1.4.0/web/jbcore/').
Thumbnail Paging Text is not set, but shows.
Your galleries set showSmallPagingText="TRUE". If you do not want the thumbnail paging text to be displayed in Small Screen Mode, then set showSmallPagingText="FALSE" (in JuiceboxBuilder-Pro's 'Customize -> Thumbnails' section).
Gallery Title is set to centre but appears on the left.
The galleryTitleHAlign configuration option (which affects the horizontal alignment of the Gallery Title) is applied only in Large Screen Mode. In Small Screen Mode, the default value of LEFT is always used.
You're welcome!
For others reading this and experiencing a similar problem, WP-Juicebox requires that allow_url_fopen is enabled in the web server's PHP settings (PHP_INI_SYSTEM). The default value for this configuration is '1' (enabled).
WP-Juicebox uses simplexml_load_file to fetch the images from Picasa's web servers and this PHP function internally relies on allow_url_fopen being enabled.
If you create a gallery and edit it at a later date, JuiceboxBuilder-Pro will reuse the source images (to create new images and thumbnails for the gallery) only if you do anything on the 'Images' tab that requires the images to be reprocessed (for example resizing them and adding or removing a watermark).
If you open an existing gallery to edit it and change only configuration options (on the 'Customize' tab), then the images in the gallery will remain untouched.
If you want JuiceboxBuilder-Pro to reprocess the images (to use new versions of your source images), a quick and easy way to do so would be to select and then immediately deselect the 'Use Watermark' checkbox on the 'Images' tab.
Please note that JuiceboxBuilder-Pro stores the location of the source images (using sourcePath attributes to the <image> tags) in the gallery's 'config.xml' file when the gallery is initially created. If the images need to be reprocessed when editing a gallery, the source images will be used only if they still exist in their original locations on your hard drive. If the source images have been moved or renamed, JuiceboxBuidler-Pro will use the images in the gallery's 'images' folder instead.
I just purchased the pro version and wonder how I can remove the JuiceBox logo from the bottom right hand corner.
If you see the Juicebox logo at the bottom right of your gallery, then your gallery is still a Juicebox-Lite gallery. The Juicebox badge/link is displayed in all Lite galleries but not in any Pro galleries. If you create a gallery with JuiceboxBuilder-Pro, then the resulting gallery will be a Pro gallery.
Upgrade your existing gallery to Pro and the logo will be removed. To do this, either:
(1) Open and re-save your gallery (on the 'Publish' tab) in JuiceboxBuilder-Pro.
.. or:
(2) Replace your gallery's 'jbcore' folder with the 'jbcore' folder from the Juicebox-Pro download zip package ('juicebox_pro_1.4.0/web/jbcore/').
My other question is about the gallery title colour, in the preview it appears as white but when I upload it to my site it appears to be grey and due to the background colour it makes it unreadable.
First of all, make sure that your online gallery uses the same configuration options as the gallery on your computer.
If you are updating a gallery and are in any doubt as to whether the existing files on your web server are being overwritten, try deleting the gallery from your web server first before uploading the new version in its place. (When deleting anything from your web server, please make a backup copy first, just in case anything goes wrong and you need to reinstate the files.)
Also, check to see if you have any global CSS rules (affecting the font color) on your web page that the gallery may be inheriting. If so, apply these rules only to elements on your web page which require them through use of ids and classes.
If you continue to experience difficulties, please post the URL to your gallery's web page so that I can take a look and help further.
@kilooloogung
1. I don't get a Back button on iPhone 5, making getting out of a Gallery convoluted
Your gallery currently sets showSmallBackButton="FALSE". Set showSmallBackButton="TRUE" (in JuiceboxBuilder-Pro's 'Customize -> Back Button' section) to display the Back Button in Small Screen Mode.
2. I don't get Autoplay options on iPhone 5 or iPad Air (OK on desktop)
Your gallery AutoPlays on load when I view it on an iPod Touch 4 (I do not have an iPhone 5 to test) and the AutoPlay Button is displayed in the Button Bar and functions fine. (Tested in both Mobile Safari and Chrome .)
Try clearing your browser's cache before reloading your gallery to see if this helps.
The decision was made to swiftly release an updated version of Juicebox-Pro (with this bugfix integrated) but to not increase the version number. If you need to differentiate between versions, the Build Time (in the comments section at the top of the 'juicebox.js' file) will always differ from build to build.
1. I would like to align my images at the bottom
Move the thumbnails to somewhere other than the default position of BOTTOM (e.g. thumbsPosition="TOP") and set imageVAlign="BOTTOM". You may also want to set imagePadding="0" and stagePadding="0".
2. I would like to resize the images/gallery dynamically when the user hovers like: its 500px height and 100% width, and when the user hovers i would like to resize to 750px height and 100% width.
There is no Juicebox-Pro API event which you could hook into when the user hovers over the gallery.
You could perhaps use the jQuery mouseover and mouseout events (on the gallery's container) in conjunction with the API method setGallerySize().
Try something like the following. Create a sample gallery with JuiceboxBuilder-Pro and replace the gallery's 'index.html' page with the code below:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="viewport" content="minimal-ui" />
<style type="text/css">
body {
margin: 0px;
}
</style>
<script src="jbcore/juicebox.js"></script>
<script>
function getWindowWidth() {
return window.innerWidth ? window.innerWidth : $(window).width();
}
var jb = new juicebox({
containerId: 'juicebox-container',
galleryHeight: '500',
galleryWidth: getWindowWidth()
});
$(document).ready(function() {
$('#juicebox-container')
.mouseover(function() {
jb.setGallerySize(getWindowWidth(), '750');
})
.mouseout(function() {
jb.setGallerySize(getWindowWidth(), '500');
});
$(window).on('resize', function() {
jb.setGallerySize(getWindowWidth(), '500');
});
});
</script>
</head>
<title>Test</title>
<body>
<div id="juicebox-container"></div>
</body>
</html>No. Juicebox-Pro supports only a single audio track.
I have run your web page through the W3C Markup Validation Service and notice that there are two unclosed <div> elements on your web page. I do not know what part of your Drupal installation is responsible for this (Drupal core, a theme, module or custom code) but investigating this and fixing the HTML errors on your web page would be the first thing I would do. (Try using a different theme to see if your current theme is the source of the problem.)
Once the code on your web page validates correctly, your gallery should hopefully display correctly.
Even if fixing the HTML errors on your web page does not fix the problem, we will at least be able to eliminate them as a possible cause.
Also, it looks like your gallery may somehow have a width of zero.
If I give the <div class="juicebox-parent"> container on your web page a fixed width such as 800px (using Firefox's developer tools), your gallery seems to display OK.
Perhaps you could post your query in the Drupal forum. Please note that we did not write the Juicebox module for Drupal ourselves. If you post your query in the Drupal forum, the author of the module may be familiar with the problem and be able to offer a solution.
I hope this helps and points you in the right direction.
You're welcome!
I'm glad my suggestion works for you.
Thank for you posting back to let me know.
You don't get it when you click on 'Venlo 1' on the home page?
That is correct. When I click on the 'Venlo 1' link on your home page, I see no gallery on the resulting web page. (I have viewed the web page in Firefox 28.0, Chrome 34, IE11, Opera 20.0 and Safari 5.1.7.)
It looks like the CSS on your web page may be forcing the gallery container's position and/or size to be such that the gallery itself is not visible on screen.
With regard to your original query, we now plan to open up buttonBarBackColor and captionBackColor for use in Small Screen Mode as well as Large Screen Mode in a future version of Juicebox-Pro.
I have been unable to replicate the problem you report (on a PC).
I have viewed the demo gallery in Firefox 28.0, Chrome 34, IE11, Safari 5.1.7 and Opera 20.0 and after expanding and closing the gallery, AutoPlay does not automatically start.
I do not know what might be causing the problem on your own system but try clearing your browser's cache before reloading the gallery to see if this makes any difference.
In the meantime, I have notified the developers who will be able to try it using Safari 7.0.3 on a Mac (the same setup as yourself) to see if the problem can be reproduced.
The Shopping Cart button is automatically disabled in Small Screen Mode (used by default to display the gallery on mobile devices) as the Fotomoto popup interface does not fit on smaller screens.
(This is noted in the Additional Notes in the Shopping Cart support section.)
You could try forcing your gallery to use Large Screen Mode on all devices and in all browsers (by setting screenMode="LARGE" in JuiceboxBuilder-Pro's 'Customize -> General' section) but you are likely to run into problems with the size of the Fotomoto popup interface.
There is no known solution to this problem which is why we automatically disable the Shopping Cart button in Small Screen Mode.
It looks like you might have already solved your problem.
When I go to your web page, your gallery displays and functions correctly.
If you do not see the gallery in your web page, then try clearing your browser's cache before reloading your web page to see if this makes a difference.
Try using relative paths for your baseURL and configURL (rather than absolute paths which hardcode your 'www' subdomain) so that your web site displays correctly on both http://comingsoon.it and http://www.comingsoon.it.
Also, when using a baseURL, as long as your gallery's XML file is named 'config.xml' and is located in your gallery folder, then you do not need to use a configURL to point to the XML file.
Try changing:
baseUrl : 'http://www.comingsoon.it/testArea/anteprime/emma/',
configUrl : 'http://www.comingsoon.it/testArea/anteprime/emma/config.xml',... to either:
baseUrl : '/testArea/anteprime/emma/',... or:
baseUrl : '/imgdb/primopiano/impaginate/emma/',... as you seem to have uploaded your gallery folder to two different locations on your web server.
I do not see a Juicebox gallery on the web page whose link you posted (http://www.reinaertdevos.eu/content/venlo-1) although there is embedding code on the page.
The settings used in this gallery can be seen here: http://www.reinaertdevos.eu/juicebox/xm … es/default
These settings result in a white background for both the Button Bar and the Back Button (in Large Screen Mode).
However, the settings used in the 'teaser' gallery on this page: http://www.reinaertdevos.eu/
... are quite different: http://www.reinaertdevos.eu/juicebox/xm … ges/teaser
... and, because screenMode="SMALL" is used, the background for the Button Bar is the default value of 'rgba(0,0,0,.5)'.
It looks like you might want to change the settings in the 'teaser' gallery so that screenMode="AUTO" and showSplashPage="ALWAYS".
All of your web pages seem to use different code (with different CSS) which accounts for the change in position of your menu across your different web pages.
Also, some pages load your 'style-menu2.css' file whereas others load your 'style-menu4.css' file.
The 'style-menu4.css' file includes the following CSS rules (not found in the 'style-menu2.css' file) which will affect the position of your menu only on web pages which load this file.
#menu_left{
margin-left:20%;
}
#entete_left{
margin-top:7%;
margin-left:16%;
}Try to use a single web page as a template and change only the content to create new pages.
Also, use the same CSS code for each and every page and the results will be consistent across all your web pages.
The positioning of the menu in your web page is due to the CSS in your 'style-menu2.css' file. In this file you have the following code:
body {font: normal .8em/1.5em Arial, Helvetica, sans-serif;background: #ebebeb;width: 900px;margin: 100px auto;color: #666;}In your http://vercorshandisport.org/html5/lafe … feclaz.php web page, the margin: 100px auto; entry from the line of code above creates a 100px margin around the content of your web page.
In your http://vercorshandisport.org/html5/stage2014/stage.php web page, you have the following code after the 'style-menu2.css' file has loaded.
<style type="text/css">
body {
margin: 0px;
}
</style>This overrides the body margin rule in the 'style-menu2.css' file, resulting in no margin around the content of your web page.
If I understand, thumbnails in the pro version do not need to be square but they will all be the same width and height in a given gallery.
That is correct. The thumbnails were designed more as a navigational tool. As long as you set imageScaleMode to either SCALE_DOWN (the default value) or SCALE, your main images will be displayed in their entirety within the gallery's image area with their aspect ratios respected and without any cropping.
The configuration options you posted above are not the same as the ones used in the gallery whose URL you posted. The gallery on your web page uses the following configuration options.
gallerywidth="100%"
galleryheight="100%"
backgroundcolor="#ffffff"
textcolor="rgba(255,255,255,1)"
thumbframecolor="rgba(255,255,255,.5)"
showopenbutton="TRUE"
showexpandbutton="TRUE"
showthumbsbutton="TRUE"
usethumbdots="FALSE"
usefullscreenexpand="FALSE"
screenmode="SMALL"
imageshadowcolor="rgba(255,255,255,255.1)"
showautoplaybutton="TRUE"
shownavbuttons="TRUE"The gallery on your web page sets screenmode="SMALL".
If you want to use the Back Button in Small Screen Mode, you will have to set showSmallBackButton="TRUE".
Also, please note that buttonBarBackColor (the background color for the Button Bar) is a Large Screen Mode configuration option only. (This is noted in the description for buttonBarBackColor on the configuration options page.) When you gallery is displayed in Small Screen Mode, the default value of rgba(0,0,0,.5) will be used for the buttonBarBackColor.
If you want to use a Spage Page but want your gallery to be displayed in Large Screen Mode wherever possible, set screenMode="AUTO" and showSplashPage="ALWAYS" (instead of screenMode="SMALL").
You can use the languageList configuration option to translate the word 'of' (the last entry in the languageList) to something else, such as 'des' or '/'. Please see here for details.
For example, you could use the following to display "1 / 3", "2 / 3", etc.
languageList="Show Thumbnails|Hide Thumbnails|Expand Gallery|Close Gallery|Open Image in New Window|Images|View Gallery|Next Image|Previous Image|Play Audio|Pause Audio|Show Information|Hide Information|Start AutoPlay|Stop AutoPlay|AutoPlay ON|AutoPlay OFF|Go Back|Buy this Image|Share on Facebook|Share on Twitter|Share on Google+|Share on Pinterest|Share on Tumblr|/"(Alternatively, you could hide the paging text completely by setting showPagingText="FALSE" and showSmallPagingText="FALSE".)
If you are referring to a navigation menu (which is unrelated to your Juicebox galleries), then make sure that your menu does not use any global CSS rules that your Juicebox gallery has no option but to inherit.
If the problem that you are experiencing is that your menu is a drop-down menu but that it does not appear on top of your Juicebox gallery, then give your menu's HTML elements a large 'z-index' value so that the menu is always stacked on top of the gallery (and does not disappear behind it).
If you are currently using a menu and would like me to take a look to see if I can determine exactly what the problem is (and perhaps suggest a solution), then please post the URL to your web page so that I can take a look.
If you are looking to use a menu to switch between different Juicebox galleries on a web page, then please see the 'Switching between Multiple Galleries using JavaScript' example in the Embedding Multiple Galleries support section.
Yes. With Juicebox-Pro, you can set the dimensions for your gallery's thumbnails using the thumbWidth and thumbHeight configuration options. All thumbnails in a Juicebox-Pro gallery will be the same size as each other but they do not need to be square.
If you create your gallery with JuiceboxBuilder-Pro, the application will create thumbnails at the specified dimensions and will set the appropriate values for thumbWidth and thumbHeight in the gallerys 'config.xml' file.
For reference, a list of all Juicebox-Pro Thumbnail Options can be found here.
The configuration options you posted do not include any Back Button options but if I add the following to a Juicebox-Pro v1.4.0 test gallery using your configuration options, the Back Button appears black on a white background.
backButtonPosition="TOP"
backButtonUseIcon="TRUE"It sounds like you might be using an older version of Juicebox-Pro (although if you just downloaded it yesterday, this is unlikely) or there may be a conflict with some custom CSS code on your web page (if you have embedded your gallery into an existing web page alongside other content).
Please check for these two possibilities and if you continue to experience difficulties, please post the URL to your gallery so that I can take a look and help further.
(You can check which version of Juicebox-Pro your gallery is using by looking at the comments at the top of the 'jbcore/juicebox.js' file and you should be able to see if there are any custom CSS rules being applied to the Back Button using your browser's developer tools.)
If you are not able to upload .mp3 or .ogg files to your web server then you will need to host the files elsewhere (either another web server or perhaps a Dropbox public folder) and refer to them in the audioUrlMp3 and audioUrlOgg configuration options using absolute paths such as the following:
audioUrlMP3="https://dl.dropboxusercontent.com/u/134593202/music.mp3"
audioUrlOgg="https://dl.dropboxusercontent.com/u/134593202/music.ogg"Juicebox Support Forum → Posts by Steven @ Juicebox
Powered by PunBB, supported by Informer Technologies, Inc.