You are not logged in. Please login or register.
Active topics Unanswered topics
Juicebox v1.5.1 Released!
Search options (Page 165 of 235)
As Squarespace is not a regular web host (which gives you FTP access to regular web space), you can embed a Juicebox gallery in a Squarespace web page by following the Web Template Site instructions here.
When it comes to inserting the <iframe> code into your Squarespace page, the following Squarespace articles should help:
http://help.squarespace.com/customer/po … les/438262
http://help.squarespace.com/customer/po … to-a-page-
The only oddity I see on your web page at the moment is that your embedding code (for your November gallery) is enclosed in CDATA tags and that the closing tag has its final > character escaped as > in the following line:
It may (or may not) make a difference but try either replacing the line above with:
... or completely remove the CDATA tags around the JavaScript code.
The issue is for all mobile devices (iPhones, Sony, etc...) and all web browsers. To make it weirder, it seems OK on iPad...
Is it OK in both Chrome and Mobile Safari on the iPad? What iOS does your iPad run? Perhaps you can upgrade the version of iOS on your iPhone (if it is not already up-to-date) to see if this makes a difference. (By checking both Chrome and Mobile Safari in both an iPhone and an iPad and checking which version of iOS each device is running, you may at least be able to find a pattern within iOS devices.)
As you seem to be embedding your galleries manually (rather than using WP-Juicebox), then perhaps a workaround would be to upload your gallery folders to your web server and include links to them within your posts (rather than embed them directly in your posts).
Juicebox does have CORS support and does use browser detection but, as far as I am aware, does not use XDomainRequest which may well be the key to having CORS support for IE8 and IE9.
Thank you for your post. I have notified the developers.
My suggestion was not to replace the line:
winWidth = window.innerWidth ? window.innerWidth : $(window).width();
... but to make the adjustment after it, e.g.:
winWidth = window.innerWidth ? window.innerWidth : $(window).width();
winWidth = winWidth - 20;
The code which determines the window width will return the result in pixels so you should stick to using a pixel value for this right-hand border so you can subtract the border (px) from the window width (also px).
Also, when making the adjustment to the winWidth value, the code will be purely arithmetic so you should not use a suffix, such as px. (I used a suffix in my original code above but I have corrected the error. Sorry for any inconvenience.)
Use a CSS border such as:
body {
margin-right: 20px;
}
... and then use either:
winWidth = window.innerWidth ? window.innerWidth : $(window).width();
winWidth = winWidth - 20;
... or:
winWidth = window.innerWidth ? window.innerWidth - 20 : $(window).width() - 20;
I have tested this myself and it seems to work fine.
You can use the CSS margin-right property on the body tag of your web page to add space between the right edges of the gallery and the browser window, e.g.:
body {
margin-right: 20px;
}
Whatever margin you choose to use, you will need to compensate for it in your gallery resizing doLayout() function.
After defining winWidth, use the following (changing the value to whatever margin you use):
winWidth = winWidth - 20;
But, it's not possible with Showkase-Standard, isn't it? For the demo Acqua Photo only with Showkase-Pro?
The Showkase Acqua Photo demo uses Juicebox-Pro. (The Juicebox galleries within the demo use Pro options such as AutoPlay and hiding thumbnails.)
To achieve this, you would need to either:
(1) Purchase Showkase-Pro (which comes with Juicebox-Pro)
... or:
(2) Purchase Showkase-Standard and Juicebox-Pro separately
It looks like IcoMoon have changed their app.
The instructions on our Theming support page refer to their old app which can still be used and can be found here.
Alternatively, if using their new app, try the following.
Make sure that the IcoMoon App is up and running and displaying both the 'juicebox.dev' and 'IcoMoon - Free' sets
Click the pointer icon in the IcoMoon toolbar to select 'Select' mode.
Select all the 'juicebox.dev' icons except the one you want to replace and select the icon from the 'IcoMoon - Free' set that you would like to use.
Click the 'Font' button at the bottom, find the new icon and change its code (by double-clicking the existing code and typing over it) to that of the icon from the 'juicebox.dev' set that you are replacing (in your case 'e004').
Click the 'Preferences' button at the top and change the name of the set from 'icomoon' to 'juicebox'.
Click the 'Download' button at the bottom and save the font file to your hard drive.
Unzip the font file and use the files in the 'fonts' folder to replace the files in your gallery's 'jbcore/classic/fonts'.
I will ensure that the instructions on the web page are corrected in the next site update.
However, if I mouseover the email button after uploading, the text "Go Back" appears, and I cannot find where to change it.
You can change the rollover tooltip text using the languageList configuration option. Please see here for details.
Change the default 'Go Back' text to whatever you like and add the languageList configuration option as an attribute to the opening <juiceboxgallery> tag in your gallery's XML file.
For example:
<juiceboxgallery
galleryTitle="Juicebox-Pro Gallery"
languageList="Show Thumbnails|Hide Thumbnails|Expand Gallery|Close Gallery|Open Image in New Window|Next Image|Previous Image|Play Audio|Pause Audio|Show Information|Hide Information|Start AutoPlay|Stop AutoPlay|AutoPlay ON|AutoPlay OFF|Email|Buy this Image|Share on Facebook|Share on Twitter|Share on Google+|Share on Pinterest|Share on Tumblr|of"
>
I wrote "email" in the back button text box too.
The backButtonText configuration option is only for use when using text for the Back Button instead of an icon (not for the rollover text which is handled by the languageList configuration option).
The second issue is that nothing happens when I click the link in chrome
Please post the URL to your gallery so that I can take a look for myself and help further.
It looks like your Drupal page uses the CSS border box model which currently breaks the Juicebox layout.
This issue has already been addressed and will be fixed in the next version of Juicebox.
In the meantime, you can apply the fix manually by opening the 'jbcore/classic/theme.css' file in a plain text editor and adding the following code to the file:
.juicebox-gallery a, .juicebox-gallery div, .juicebox-gallery h1, .juicebox-gallery h2, .juicebox-gallery h3, .juicebox-gallery h4, .juicebox-gallery p, .juicebox-gallery span, .juicebox-gallery u {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
Do I understand I just copy
languageList="Show Thumbnails|Hide Thumbnails|Expand Gallery|Close Gallery|Open Image in New Window|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|of"
and make my language change.
Yes.
Q: if so, where do I copy this languageList=
do I put it in the config file? Or is there a file I go to and update that language.
Open your gallery's 'config.xml' file in a plain text editor and add the languageList configuration option as an attribute to the opening <juiceboxgallery> tag.
For example:
<juiceboxgallery
galleryTitle="Juicebox-Pro Gallery"
languageList="Show Thumbnails|Hide Thumbnails|Expand Gallery|Close Gallery|Open Image in New Window|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|of"
>
Juicebox-Pro already includes a shopping cart icon (for Fotomoto support). You can use this icon instead of the default 'Open Image in New Window' icon by opening the 'jbcore/classic/theme.css' file in a plain text editor and changing line 721 from:
... to:
Im just used to writing in "back-up" fonts in case the user dont have the first font installed.
You can enter a number of different fonts separated by commas, for example:
galleryFontFace="Century+Gothic,Helvetica,Arial,sans-serif"
The preset issue suddenly worked itself out
That's good to hear.
You currently have Showkase-Standard.
To be able to create Juicebox-Pro galleries (with no branding or image limit) with Showkase you could either:
(1) Purchase Juicebox-Pro from here and upgrade your Showkase installation by following the instructions here.
... or:
(2) Purchase Showkase-Pro (which comes bundled with Juicebox-Pro and SimpleViewer-Pro) and we can refund you for your Showkase-Standard purchase. (If you decide to do this, please let me know and I will send you an email so that you can forward me your transaction details for a refund.)
Please note that the only difference between Showkase-Standard and Showkase-Pro is that Showkase-Standard comes bundled with Juicebox-Lite and SimpleViewer-Standard (the free versions of the image viewers) whereas Showkase-Pro comes bundled with Juicebox-Pro and SimpleVIewer-Pro.
If you purchase Showkase-Standard and upgrade it manually with Juicebox-Pro and SimpleViewer-Pro, then you will end up with exactly the same files as if you had purchased Showkase-Pro.
I would like to know if there is a way to make the "click" action when hovered over the main image go to a hyperlink.
Set imageClickMode="OPEN_URL" (in JuiceboxBuilder-Pro's 'Customize -> Main Image' section). and when the user clicks a main image, the corresponding linkURL (from the gallery's XML file) will be opened in the linkTarget tab/window.
Now I just need to figure out how to change the "open image in new window" icon in the nav bar?
Instructions on how to change the icons in a gallery can be found in the Using Custom Icons section of the Theming Guide.
You can change the rollover tooltip text using the languageList configuration option. Please see here for details.
For instructions on how to set configuration options manually, please see here.
Use the following (changing the text in bold to whatever you like).
languageList="Show Thumbnails|Hide Thumbnails|Expand Gallery|Close Gallery|Open Image in New Window|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|of"
You can set only a single font for gallery text using the galleryFontFace configuration option (in JuiceboxBuilder-Pro's 'Customize -> General' section).
If you want to use multiple fonts throughout your gallery, you can override the galleryFontFace by using HTML formatting (for elements such as the Gallery Title, Back Button and image titles and captions) as documented in these FAQs:
How do I add HTML formatting to image captions and titles?
How do I add HTML formatting to the Gallery Title or Back Button?
I would recommend saving preset XML files in a folder dedicated to preset XML files and then save each gallery into a separate folder. This should keep your preset XML files separate from your gallery files.
If you like, you can keep each gallery in its own individual folder, upload your complete gallery folders (not just the contents) to your web server and embed the galleries into your web pages using the baseUrl method of embedding.
Keeping each gallery in its own folder may help to keeps things organized on your web server.
I am glad that you have found a solution to your problem.
Thank you for reporting the fix that you have found.
I have been able to replicate the problem in a test gallery of my own and I have logged a bug report with the developers.
Hopefully, it will be fixed in the next version of Juicebox-Pro.
Why should I replace the folder when they are the same?...The showkase version I downloaded from the received link already is a Pro Version, isn't it? If not, where could I found the 'Pro jbcore folder' so I can replace the folder pointed in the path above?
You have purchased and are using Showkase-Standard (not Showkase-Pro).
You can check by looking at the text below the login panel on your Showkase admin login page. (Showkase-Standard displays only 'Showkase 1.2.0' whereas Showkase-Pro displays 'Showkase-Pro 1.2.0'.
Showkase-Standard comes bundled with Juicebox-Lite and SimpleViewer-Standard (the free versions of the image viewers) and Showkase-Pro comes bundled with Juicebox-Pro and SimpleViewer-Pro. (The only difference between Showkase-Standard and Showkase-Pro is the bundled viewers.)
But, in the step #3 says:
"To upgrade Juicebox upload the Pro jbcore folder, replacing:
admin/plugins/juicebox/master/jbcore"
Could you please explain it better?
You need to swap the entire Lite 'jbcore' folder in your 'showkase/admin/plugins/juicebox/master/' directory with the Pro 'jbcore' folder from the Juicebox-Pro download zip package ('juicebox_pro_1.3.3/web/jbcore/').
Both of your current problems may be related.
It looks like your web page may use the border-box model and this is known to break the layout of Juicebox.
Try opening your gallery's 'jbcore/classic/theme.css' file in a plain text editor and add the following code to the file.
.juicebox-gallery a, .juicebox-gallery div, .juicebox-gallery h1, .juicebox-gallery h2, .juicebox-gallery h3, .juicebox-gallery h4, .juicebox-gallery p, .juicebox-gallery span, .juicebox-gallery u {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
Hopefully this will solve your problems.
This issue has been addressed and will be fixed in the next version of Juicebox.
If you would like to be notified when a new version is released, please join our mailing list at the foot of our homepage, follow us on Twitter @JuiceboxGallery or subscribe to our blog RSS feed.
[Post split to new thread.]
If your galleries are limited to 50 images and you see the Juicebox badge/link at the bottom-right corners, then your galleries are Juicebox-Lite galleries, not Juicebox-Pro. (Juicebox-Pro does not contain an image limit or branding.)
Instructions for upgrading Showkase to use a Pro viewer can be found here.
Be sure to rebuild your existing galleries after upgrading ('Pages (tab) -> Edit (gallery page)-> Advanced (tab) -> Rebuild this Juicebox gallery').
In order for your gallery to expand fullscreen (covering the entire screen rather than just expanding within the user's browser window), you should set useFullscreenExpand="TRUE" (in JuiceboxBuilder's 'Customize -> Lite' section).
Please note that this feature is not supported by all browsers. (For browsers which do not support this feature, the gallery will still expand within the browser window, just not covering the entire screen.)
For a list of browsers which currently support the Full Screen API, please see this web page.
The page you linked to is a Drupal page.
Drupal is a Content Management System whose pages are not designed to fit completely within a user's browser window.
Vertical scrolling is normal and (on most Drupal pages) necessary to view all content on the page.
It would not be possible to constrict all content on a Drupal page to fit within a user's browser window (no matter what its size) without any scrolling.
You would have to manually construct your web page using the View Resizable Gallery with Top Menu Example sample gallery as a template. You can view the source of the web page in a browser, copy it and swap the header, gallery and footer for your own content.
Alternatively, you could try just reducing the height of your gallery (in your Drupal page) so that less vertical scrolling is necessary for most users.
[Post split to new thread.]
You can load images from a different domain or subdomain (by using absolute URLs for the imageURL and thumbURL entries in the gallery's XML file) but the 'juicebox.js' file must be on the same domain or subdomain as the web page containing the gallery's JavaScript embedding code due to the same-origin policy.
With Juicebox-Lite (the free version), it is not possible to add padding to a gallery from within the plugin's interface.
However, if you purchased Juicebox-Pro (and upgraded the plugin following the 'Upgrading to Juicebox-Pro' instructions on this web page), you would have access to the imagePadding and stagePadding configuration options which you could enter into the plugin's 'Pro Options' text area.
Please note that both imagePadding and stagePadding add padding to all four sides of the image and stage respectively (not just the top).
For reference, a list of all available configuration options can be found here.
Otherwise, you could edit the gallery's 'index.html' page after the gallery has been created and add padding above the gallery using CSS.
Thank you for reporting this issue.
I have logged a bug report with the developers and this should hopefully be fixed in the next version.
If you would like to be notified of new releases, please subscribe to our newsletter at the foot of our homepage or follow us on Twitter @JuiceboxGallery
Should I presume a work-around is possible by the JB folks in the near or far term?
Unfortunately, the security restrictions in IE11, Chrome and Opera which prevent the loading of local XML files cannot be circumvented and so there is no possibility of previewing Juicebox galleries locally in these browsers (without using emulation).
As such, there is nothing we can do to allow users to preview Juicebox galleries locally in IE11 (or Chrome or Opera) in the future.
As arachnid says, you can use 'F12 -> Emulation -> Document Mode -> 10' (to emulate IE10) within IE11 (or use Firefox or Safari).
Certain browsers (IE11, Chrome and Opera) have security restrictions which prevent the loading of XML files (like the one used by Juicebox to store the configuration options and image data) locally from your own computer's hard drive. Unfortunately, there is nothing that can be done to circumvent this behavior.
Please note that this happens only when trying to load galleries locally (from your own computer's hard drive) and does not happen once galleries have been uploaded to a web server.
We already have FAQs for Chrome and Opera and will add one for IE11 in the next site update. (It was previously possible to preview galleries locally in IE10 but not now in IE11.)
If you want to view your gallery on your own computer before uploading it to your website, please preview it in either Firefox or Safari.
If you see the 'Config XML Not Found' message for a gallery which has been uploaded to a web server, please see this FAQ:
When I view my gallery I see the message 'Config XML file not found'. How do I fix this?
Posts found: 4,101 to 4,125 of 5,851