It would be great if you could please post your 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.
Many thanks!
You are not logged in. Please login or register.
Juicebox Support Forum → Posts by Steven @ Juicebox
It would be great if you could please post your 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.
Many thanks!
I appreciate you taking the time to post your suggestions in the forum.
However, if would be much better if you posted them in the Feature Request forum thread (a dedicated thread for ideas) where they will be seen by the developers and are less likely to get lost in amongst all the other support threads.
Thank you.
Incidentally, captions appear and disappear with their corresponding images so you might like to try setting imageTransitionType to either FADE or CROSS_FADE and then increasing the imageTransitionTime from its default value of 0.3 to something larger (although this will affect all image transitions, not just the initial image fade in).
Still, it might be worth trying a few different combinations in case you find something close to what you are trying to achieve.
(Both the configuration options in bold above can be found in the Main Image Options section of the Config Options page.)
You can skip the thumbnail page in Small Screen Mode and go straight to the main images by setting showSmallThumbsOnLoad="FALSE" (in JuiceboxBuilder-Pro's 'Customize -> Thumbnails' section). You can also hide the Thumbnail Button on the Button Bar if you like (so users cannot access the thumbnail page at all) by setting showSmallThumbsButton="FALSE".
There are similar configuration options available for Large Screen Mode to initially hide or show the thumbnails (showThumbsOnLoad) and to choose whether or not to display the Thumbnail Button (showThumbsButton).
Additionally, you can choose which image to initially display via firstImageIndex ('Customize -> General').
You're welcome.
The image you are describing is the Splash Page image.
More information about the Splash Page can be found in the Screen Modes section of the Gallery Tour.
By default, the Slash Page uses the first image in the gallery and scales the image to fill (rather than fit within) the Splash Page (which uses the gallery dimensions). If the image does not have the same aspect ratio as the gallery/Splash Page, then cropping will occur.
There is no way to change the scaling behavior for the Splash Page image but you can choose an image to be used for the Splash Page via the splashImageUrl configuration option.
The splashImageUrl can be an absolute path or a relative path (relative to the web page containing the gallery's embedding code).
The splashImageUrl does not need to be a gallery image so you could perhaps prepare an image that represents your gallery and looks better at the gallery/Splash Page dimensions.
For reference, all the Splash Page configuration options can be found here.
All you need to do to upgrade an existing gallery from Juicebox-Lite to Juicebox-Pro is replace the gallery's Lite 'jbcore' folder with the Pro 'jbcore' folder from the Juicebox-Pro zip package ('juicebox_pro_1.5.0/web/jbcore/'). This will instantly remove the image limit and branding and any Pro configuration options in the gallery's configuration file will become active.
You can also load a Juicebox-Lite gallery (using a local copy of the gallery on your computer) into JuiceboxBuilder-Pro (the desktop application to create and edit Juicebox-Pro galleries), configure the gallery with Pro options if you like (on the 'Customize' tab) and re-save the gallery on the 'Publish' tab. The gallery will be upgraded to Juicebox-Pro and you can then re-upload the gallery to your web server.
Is there a built-in limitation of the number of albums per one page?
No, there's no limit to the number of galleries you can have on a single web page.
OK, solved!
That's great to hear! I'm glad you've been able to resolve your problem. Thank you for posting back to let me know.
For anyone who wants to embed multiple galleries on a single web page, here are a few tips.
(1) Load the 'juicebox.js' file just once per web page (rather than once per gallery).
(2) Embed each gallery into a div container with a unique containerId.
(3) In each gallery's embedding code, use a configUrl (to point towards a unique configuration file) or a baseUrl (to point towards a unique gallery folder).
Short descriptions of the configuration options in bold above can be found in the Embed Options section of the Config Options page.
There is no way to change the imageURL prefix in JuiceboxBuilder-Pro. Images are always placed in a folder named 'images' and the imageURL paths always start with "images/". There are no user-changeable configuration options to change the name of the image folder or to set a different prefix for the imageURL. The code which handles this is compiled and cannot be modified.
If you want to use a different gallery structure to that created by JuiceboxBuilder-Pro, then you'll need to edit your gallery's 'config.xml' file in a plain text editor to change the imageURL paths.
However, if you use a text editor such as Notepad++, you'll be able to change all instances of "images/" to whatever you like across multiple files (if you have many galleries to change) in a single global search and replace action which should take just a matter of seconds.
@racerx2oo3 & @studio tissot mayenfisch
Thanks for offering to share your solutions and feedback!
I hope you get on well with your implementations.
You could modify the template 'index.html' file that JuiceboxBuilder-Pro uses to generate the gallery's 'index.html' file.
On a Windows PC, this template file is located here: C:\Program Files (x86)\JuiceboxBuilder-Pro\template\index.html
Try replacing the contents of this template file with the following. (I would strongly suggest that you take a backup of the original template file first, just in case anything goes wrong and you need to reinstate it at a later date.)
<!DOCTYPE html>
<html lang="en">
<head>
<title>%%TITLE%%</title>
<meta charset="utf-8" />
<meta name="viewport" id="jb-viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1, maximum-scale=1, user-scalable=0" />
<meta name="description" content="%%DESCRIPTION%%" />
<!-- START OPEN GRAPH TAGS-->
<meta property="og:title" content="%%TITLE%%" />
<meta property="og:type" content="website" />
<meta property="og:url" content="%%GALLERY_URL%%" />
<meta property="og:image" content="%%IMAGE_URL%%" />
<meta property="og:description" content="%%DESCRIPTION%%" />
<!-- END OPEN GRAPH TAGS-->
<style type="text/css">
body {
margin: 0px;
}
</style>
</head>
<body>
<!--START JUICEBOX EMBED-->
<script src="jbcore/juicebox.js"></script>
<script type="text/javascript">
var purchaseURL;
var strWindowName = 'Shopping Cart';
var strWindowFeatures = 'menubar=yes,location=yes,resizable=yes,scrollbars=yes,status=yes,width=600,height=400';
var jb = new juicebox({
containerId: "juicebox-container",
galleryWidth: '%%WIDTH%%',
galleryHeight: '%%HEIGHT%%',
backgroundColor: '%%COLOR%%'
});
jb.onInitComplete = function() {
$('.jb-bb-btn-fotomoto').off('click');
$('.jb-bb-btn-fotomoto').click(function() {
var windowObjectReference = window.open('about:blank', strWindowName, strWindowFeatures);
$.get('config.xml', function(data) {
var index = jb.getImageIndex();
purchaseURL = $(data).find('image').eq(index - 1).attr('purchaseURL');
}).done(function() {
windowObjectReference.location.replace(purchaseURL);
}).fail(function() {
windowObjectReference.close();
});
});
};
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->
</body>
</html>I am running Rosa theme if that also helps.
Try temporarily reverting to a default WordPress theme (such as Twenty Seventeen) just in case this makes a difference.
I am happy to help further but I would really need access to both your web server and WordPress site (to upload some test files are try things out) in order to determine the cause of your problem.
If you are agreeable to this, then please let me know and I will send you an email address where you can forward me your FTP and WordPress login details.
Thanks you.
A spinning logo usually indicates that an image cannot be found (perhaps due to an incorrect path in the gallery's XML file or a missing image on the web server).
If your gallery was working fine but now is not (and you have made no changes), then this suggests that something might have happened on your web server to cause the problem.
First of all, check that the paths to the images in your gallery's XML file are correct and that your images are present in their correct locations on your web server.
You might like to also contact your web host to ask if they have changed anything or have been experiencing any issues lately which might be contributing to your problem (maybe they have had some reason to reinstate your website from an incomplete backup).
If you continue to experience difficulties, please post back with the URL to your gallery's web page so that I can see the problem for myself and hopefully help further.
Thank you.
Mainly I am trying to control the following aspects of the UI in mobile only"
Juicebox-Pro uses one set of configuration options for both Large Screen Mode and Small Screen Mode so, unfortunately, it is not possible to configure each screen mode differently. Additionally, certain configuration options are Large Screen Mode only (such as captionPosition and imageTransitionType) and these cannot easily be changed at all for Small Screen Mode.
There's more information about Screen Modes and how Juicebox adapts to different devices and screen sizes here.
What you might like to try, however, is force the gallery to always be displayed in Large Screen Mode (no matter what device or browser is being used to view the gallery) by setting screenMode="LARGE" (in the 'General' configuration options section).
If I could see these things in-browser on desktop I could use Inspector.
If you want to see the Small Screen Mode version of your gallery in your desktop browser, temporarily set screenMode="SMALL".
Alternatively, if you use Firefox, you could perhaps try using 'Tools -> Web Developer -> Responsive Design Mode'.
Another suggestion would be to use an extension such as User Agent Overrider which, as the name suggests, overrides the user agent string for your browser (to identify your browser as something that it's not). You could select 'iOS / Safari 10', for example, and your gallery should be displayed in Small Screen Mode (as if on an iOS device). This is not an emulator but it should be suitable for examining the Small Screen Mode version of your gallery in your browser's developer tools.
There should be similar options and extensions for other browsers.
I hope this points you in the right direction.
It sounds like your problem might be due to incorrect or missing MIME types (for the font files) on your web server.
If this is the case, then you may have to contact your web host to ask if they can add the font file types (.eot, .svg, .ttf, .woff) to the list of MIME types (so that browsers know what to do with them).
Also, try viewing your gallery in different browser to see if the problem occurs in them all or just in certain browsers.
For example, if you see the problem in just Internet Explorer, then make sure that Compatibility View is not enabled.
I hope these notes help.
However, if you continue to experience difficulties, please post the URL to your gallery's web page so that I can take a look at the problem and hopefully help further. Thank you.
You're welcome! I'm glad you've got it working.
Thank you for letting me know.
If your link looks like www."website"/NewMexico2017/index#27, then there could be 2 problems.
(1) If you want to use an absolute path, start the link with http:// (or https://), otherwise, the link will be seen as a relative path (relative to the web page containing the link).
(2) If 'index' is actually a web page named 'index.html' then use 'index.html#27' instead of 'index#27'.
Also, make sure that your gallery sets enableDirectLinks="TRUE" (in JuiceboxBuilder-Pro's 'Customize -> General' section).
If these notes do not help, then I would really need to see the problem live on your web server in order to help further so, if possible, please post back with the URLs for the page with the link and the gallery itself. Thank you.
If you are not already using the latest version of WP-Juicebox (v1.5.0.1), then please try upgrading.
You can download the latest version from the plugin's support page here.
After upgrading, please clear your browser's cache (to ensure that no older cached files are being used) and try again.
If you are already using the latest version, then this error message is most often associated with the use of a third-party editor (rather than the default CKEditor which comes bundled with WordPress). If you are using a third-party editor, try temporarily disabling it to see if this helps.
The next most likely cause might be whitespace being introduced by a core WordPress file.
If you have manually edited any core WordPress files (such as 'wp-config.php'), make sure that you have not introduced any whitespace (e.g. line feeds or carriage returns at the end of the file outside the PHP section) that would be output when the file is parsed.
I hope these suggestions help.
However, if you continue to experience difficulties, please let me know and I'll try to help further.
Thank you.
Your fix works a treat anyway!
I'm glad it worked for you. Thank you for letting me know.
When do you expect the new version's release?
We are actively working on the next version just now but, unfortunately, I do not know when it will be released. There is no set release schedule and it'll be released only when we feel it's ready. Any estimate I give you could turn out to be wholly inaccurate. I hope you understand.
However, if you'd like to be notified when new versions are released, you can join our mailing list at the foot of our homepage, keep an eye on our Facebook page, follow us on Twitter @JuiceboxGallery or subscribe to our blog RSS feed.
Thank you for reporting this issue.
Unfortunately, the problem looks to be caused by a bug whereby the embedding page's <body> tag is not returned to its original state on closing an expanded gallery.
I have notified the developers of this issue and it should hopefully be fixed in the next version.
Until the bug is fixed, it might help to always expand the gallery on a new page of its own (instead of on top of the embedding page) by setting expandInNewPage="TRUE" (in JuiceboxBuilder-Pro's 'Customize -> General' section).
I hope this works for you and is a suitable workaround in the meantime.
Juicebox was not designed to initially display the expanded version of a gallery.
If a web page is loaded and a gallery on the page is initially expanded, then the other content on the web page alongside the gallery would not be visible (and the user would have no knowledge that it was even there).
If you really want to expand a gallery on load, please see this forum post for a couple of suggestions.
If you just want your gallery to fill a browser window without the need to expand it, then perhaps the best solution would be to embed your gallery in a web page with dimensions of 100% x 100% and make sure that there is no other content on the web page. (The Splash Page is not displayed by default if a gallery has dimensions of 100% x 100% and is the only content on the web page.)
Alternatively, if your gallery is embedded in a web page alongside other content and you still want the other content to be visible, then you can choose to not use the Splash Page (and just have the gallery displayed where the Splash Page would normally be) by setting showSplashPage="NEVER" (in JuiceboxBuilder-Pro's 'Customize -> Splash Page' section).
Alternatively, you could force your gallery to always be displayed in Large Screen Mode (which does not use the Splash Page by default) on all devices and in all browsers by setting screenMode="LARGE" (in JuiceboxBuilder-Pro's 'Customize -> General' section).
Whatever you choose to do, you can disable the Expand Button if you like by setting showExpandButton="FALSE" (in JuiceboxBuilder-Pro's 'Customize -> Lite' section).
I hope this gives you a few ideas to try.
I updated FZ and now it will only over write items in the top-tier of the directory when I bring a folder over.
I'm not aware of a setting in Filezilla that uploads (and overwrites if required) only the top level folder contents.
Try changing the 'Uploads' option in Filezilla -> Edit -> Settings -> Transfers -> File exists action' to 'Overwrite file' (at least while you upload the Juicebox-Pro v1.5.0 'jbcore' folder). This should force all existing files to be overwritten. You can change this value back in the Filezilla interface afterwards.
The plugin dash board says that I am updated to 1.51.
Just to clarify, the 'Plugins' page displays the version number of WP-Juicebox (the plugin itself). The 'Plugins' page does not know what version of the 'jbcore' folder you are using.
Placing the code from the FAQ at the end of your .htaccess file (as you have done) is fine. (Anywhere outside the existing <IfModule mod_rewrite.c> ... </IfModule> section is fine.)
The layout of your web page is controlled via CSS and I expect there are likely going to be media queries and screen width breakpoints (and perhaps even some JavaScript code to determine whether or not the mobile layout will be used). Being that I am not familiar with the code or internal workings of your current theme, troubleshooting is quite difficult.
If it were my own site, I'd probably try using a different theme (at least for testing purposes) to see how things look on mobile versus desktop. Maybe try one of the default themes (such as Twenty Sixteen or Twenty Seventeen) to see how you get on.
I'm pretty sure that the answer lies somewhere within your current theme's code but without knowledge of exactly how your theme works (and decides to lay out your web page), I cannot answer the question of why the presence of a Juicebox gallery on your web page changes your web page's layout on mobile devices.
Knowing that CSS is probably somehow involved, you might also like to try changing your gallery's width from 100% to a fixed pixel value (such as 800px). I realise that this is not a long term solution to the problem (it'll mean that your gallery is no longer responsive in the horizontal dimension) but it might give you some insight into the nature of the problem. Giving a gallery a width of 100% means that it will fill the width of its parent container. However, its actual width (in pixels) might somehow be calculated incorrectly and seen by your theme as being large enough to warrant using the desktop layout. Using a fixed pixel value for your gallery's width might make a difference. It's a long shot but something I'd try for myself just out of curiosity. (I'm really just thinking out loud at this stage.)
Unfortunately, without knowing exactly what is causing the problem, trial and error seems to be the way forward.
I would certainly try a few different themes (to see if the answer lies somewhere within your current theme's code) and some fixed width galleries (maybe try a few different fixed widths) so see what happens.
I hope this at least points you in the right direction.
Edit:
I've just taken a look at the headers for your websites.
The 'no-transform' Cache-Control header is correctly set up and active on your http://dev.mulhollandgates.com/ website but not currently on your http://gateslosangeles.com/ website.
Also, I notice that WP-Juicebox in both of your websites still uses Juicebox-Pro v1.4.0.
I would strongly encourage you to upgrade your galleries to v1.5.0 (see details in my first post above).
I still think that this might help with your problem.
At the moment, your gallery's embedding code is looking for the 'juicebox.js' file to be in this location: http://bellacasamarketing.com/jbcore/juicebox.js
... but it is not there.
You gallery should display fine if you upload the contents of your gallery folder (not the gallery folder itself) to your web root directory (which is the location of the web page containing your gallery's embedding code).
Alternatively, if you have already uploaded the complete gallery folder (not just its contents) to your web server, then you can leave all the gallery files exactly where they are and adjust your gallery's embedding code to use the baseUrl method of embedding documented here.
If you get stuck, just let me know where on your web server you have uploaded your gallery files (e.g. let me know the URL to your gallery's 'config.xml' file or 'jbcore' folder) and I'll post back with the correct embedding code that you can use in your web page.
Please note that the 2 bugs above are unique to JuiceboxBuilder (and not Juicebox itself).
The problems occur during the creation of the gallery by JuiceboxBuilder and not during the display of the gallery by Juicebox.
As such, you might find that you get better results with WP-Juicebox (although this will depend on the image source and how the images are handled before they are fed to Juicebox).
Incidentally, if you want to embed a gallery created by JuiceboxBuilder into a WordPress page or post (without using WP-Juicebox), then I'd recommend using the baseUrl method of embedding documented here.
Essentially, once you have created a gallery with JuiceboxBuilder, you would upload the complete gallery folder to your web server and 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 the two paths in the embedding code (the path to the 'juicebox.js' file and the baseUrl itself, pointing towards the gallery folder) are correct.
Of course, if you change the transparency of the images (to match the gallery's background color), this should avoid the problem completely, no matter how your gallery is being created. I realise that it is not ideal but I'm glad you've found a suitable workaround until the bugs are fixed.
Please try implementing the solution noted in this FAQ:
Why can't I view my gallery on a 3G mobile connection?
It's the first thing I thought of when you mentioned "Request desktop site". I hope it helps.
As I mentioned in my last post, the only thing that looks a little out of place to me when I view your gallery's web page on my own iOS device (using Wi-Fi) is the large text above the header. Everything else looks OK.
If this still does not help, then please let me know if you see the same problem in both Chrome and Mobile Safari (and possibly Firefox if you have it installed, too).
Also, it might help if you could provide a couple of screenshots (you can attach them to a post here or upload them elsewhere and provide links) to let me see what you see on a gallery page compared with what you expect to see (on a non-gallery page). Thank you.
Hopefully the solution in the FAQ above (to prevent content modification over 3G/4G) will work, though.
It certainly sounds like it might.
Juicebox Support Forum → Posts by Steven @ Juicebox
Powered by PunBB, supported by Informer Technologies, Inc.