3,926 Reply by Steven @ Juicebox

(5 replies, posted in Juicebox-Lite Support)

What you are looking to achieve could probably be achieved quite easily without the need to pass any image ids as parameters or use iframes (although it would need to be set up manually and could not be done with the existing WP-Juicebox plugin which is designed to embed Juicebox galleries directly into WordPress pages or posts).

You could create your galleries using JuiceboxBuilder-Pro (on your computer).
Upload the complete gallery folders (not just the contents) to your web server. It does not matter where you upload them to as long as you know where they are.
Just insert image links in your WordPress pages or posts to point to each gallery's 'index.html' file.

For example, if you uploaded a complete gallery folder named 'gallery1' to the root directory of your web server, then you could use an image link such as the following.

<a href="/gallery1/index.html"><img src="/images/thumbnail.jpg" width="80" height="60" alt="thumbnail" /></a>

(You would need to provide a suitable thumbnail image to use as a link.)
When the user clicks on a link, the browser would be redirected to the gallery's 'index.html' page which would display the gallery on a page of its own.
Your gallery could incorporate a Back Button to allow the user to return to the original WordPress page or post containing the link.

... there seem to be some issues loading Juicebox into an iFrame. There seems to be some flickering during animations, at least here with my Chrome brower.

This is a known issue which has already been addressed and will be fixed in the next version of Juicebox. However, just fior the record, there are other limitations of using an iframe which are documented in the 'Using an iframe' support section here.

I hope this helps.

Go to forum: Juicebox-Lite Support

3,927 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Pro Support)

It would not be possible to implement a solution within WP-Juicebox (without re-writing the plugin) but you could do the following with a standalone gallery.

(1) Listen for a change in the user's browser window size using JavaScript.
(2) Determine the new width of the user's browser window.
(3) If a specified width threshold has been crossed, then reload the gallery setting the new configuration options in the embedding code.

For example, create a sample gallery with JuiceboxBuilder-Pro and replace the gallery's 'index.html' page with the following code:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <style type="text/css">
            body {
                margin: 0px;
            }
        </style>
        <script type="text/javascript" src="jbcore/juicebox.js"></script>
        <script type="text/javascript">
            var a = '3', b = '3', c = 'LEFT', thresholdWidth = 600;
            function loadGallery(a, b, c) {
                new juicebox({
                    containerId: 'juicebox-container',
                    maxThumbColumns: a,
                    maxThumbRows: b,
                    thumbsPosition: c
                });
            }
            function thumbsStatus() {
                var windowWidth = window.innerWidth ? window.innerWidth : $(window).width();
                if (windowWidth < thresholdWidth && c === 'LEFT' ) {
                    a = '10';
                    b = '1';
                    c = 'BOTTOM';
                    loadGallery(a, b, c);
                }
                if (windowWidth >= thresholdWidth && c === 'BOTTOM') {
                    a = '3';
                    b = '3';
                    c = 'LEFT';
                    loadGallery(a, b, c);
                }
            }
            $(document).ready(function() {
                thumbsStatus();
                $(window).on('resize', thumbsStatus);
                loadGallery(a, b, c);
            });
        </script>
        <title>Test</title>
    </head>
    <body>
        <div id="juicebox-container"></div>
    </body>
</html>

Go to forum: Juicebox-Pro Support

3,928 Reply by Steven @ Juicebox

(10 replies, posted in Juicebox-Pro Support)

What can i do to scale just to fill the browsers size?

If you want a gallery to completely fill a users browser window, make sure that it is the only element on your web page and set its dimensions to 100% x 100%.

may i use the caption for navigation bar? and how?

You can insert links into image captions by using HTML formatting as documented in this FAQ:
How do I add HTML formatting to image captions and titles?

For example, you could enter a caption such as the following into JuiceboxBuilder-Pro.

<a href="http://www.example.com/index.html">Link text goes here</a>

It may not be ideal to use image captions as navigation for your site (it depends on your site).
You may have better luck following one of the resizable templates here (placing your navigation menu in the header).

Go to forum: Juicebox-Pro Support

3,929 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Pro Support)

Thank you for providing the URL to your gallery.

It look like the problem happens when captionPosition="BELOW_IMAGE" and the image is displayed fullsize (ie. when the browser window is large enough that the image does not need to be dynamically rescaled by Juicebox).
If you shrink your browser window so that the image is dynamically rescaled by Juicebox, then you should see the link become active.

I have logged a bug report with the developers and this should hopefully be fixed in the next version.
In the meantime, possible workarounds would be to try one of the following:
(1) Change the captionPosition.
(2) Change the imageScaleMode.
(3) Ensure that your images are large enough that they would need to be scaled down by Juicebox to fit within your gallery's image area.

Go to forum: Juicebox-Pro Support

3,930 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Lite Support)

Unfortunately, there is no easy way to use images uploaded for NextGEN galleries in a WP-Juicebox gallery (other than to activate the NextGEN plugin and use the NextGEN Gallery Id in your gallery settings window).
WP-Juicebox is not designed to accept a folder of images as a source of images for a Juicebox gallery.
The plugin would need to be re-written to handle a new image source (which would also need to take into consideration thumbnails and captions).

You would need to either create new WP-Juicebox galleries by re-uploading the images to your Media Library or download all your images to your computer, create Juicebox galleries there and then upload them to your web server and embed them in your WordPress pages and posts manually.

Go to forum: Juicebox-Lite Support

3,931 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Lite Support)

If you set your gallery's height to a fixed pixel value (such as 600px), then it will be 600px in all devices and browsers.

You can change a Juicebox gallery's height in the gallery settings window.
By default, it is set to a fixed pixel value (600px) because setting a gallery's height to be a percentage (such as 100%) can cause problems if the gallery's parent container does not have a height set via CSS. Juicebox may then not be able to determine what its own height should be (100% of what?).

In a WordPress environment, you may have little control over the gallery's parent container which is generated by your theme. It is unlikely that a height will be set for the gallery's parent container as the theme has no way of knowing what content will be placed in the page or post and WordPress pages are designed to scroll vertically if necessary. (They are not intended to dynamically rescale vertically to fit within a user's browser window height).

You could try changing your gallery's height to a percentage but whether this works OK or not may be dependent on your theme.

Go to forum: Juicebox-Lite Support

3,932 Reply by Steven @ Juicebox

(10 replies, posted in Juicebox-Pro Support)

Hopefully the following notes will help.

- Picture in Fullframe

If you want the images in your gallery to be displayed in full (without cropping), set imageScaleMode to either SCALE_DOWN or SCALE (in JuiceboxBuilder-Pro's 'Customize -> Main Image' section).

- in the upper 1/3 a transparent Navbar wich generel Titel and Navigate to 3 other Sides (Home / Architecture / Nature / ... / imprint)

Please take a look at the Using a Resizable Gallery with a Header support section. The View Resizable Gallery with Top Menu Example has a header of fixed height and the gallery takes up the remainder of the user's browser window. You can view the source of the web page in a browser and copy/modify the code to suit your own needs (by swapping the sample header content for your own navigation menu).
It might not be exactly what you want but if you want to overlay a transparent navigation menu on top of a Juicebox gallery, then knowledge of HTML, CSS (and perhaps JavaScript) would be required. It would not be something that could be implemented within Juicebox itself.
You could, however, embed links into the Gallery Title or Back Button as noted in these FAQs:
How do I add HTML formatting to the Gallery Title or Back Button?

- main page (as home) should play the automatic

If you want a Juicebox gallery to start an automated slideshow as soon as it loads, set enableAutoPlay="TRUE" and autoPlayOnLoad="TRUE" ('Customize -> AutoPlay'). You may also want to set enableLooping="TRUE" ('Customize -> General').

- no Buttons

Use the following settings:

buttonBarPosition="NONE"
galleryTitlePosition="NONE"
backButtonPosition="NONE"
showImageNav="FALSE"
captionPosition="NONE"

- no thumbnails

Use the following settings:

showThumbsOnLoad="FALSE"
showSmallThumbsOnLoad="FALSE"
showThumbsButton="FALSE"
showSmallThumbsButton="FALSE"

- just the full picture ;)

Make sure that your gallery's dimensions match the aspect ratio of your images (so that there is no wasted space around your images within the gallery).

- special --- it is possible to link to the imprint so it come as overlay transparent layer at the side, so you can read it over the images?

I'm not entirely sure what you mean by this. You can set captionPosition="OVERAY_IMAGE" so that the image titles and captions appear on the image overlay (on top the the main image). However, the text will appear towards the bottom of the image, not the side.

Go to forum: Juicebox-Pro Support

3,933 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Pro Support)

I have been unable to replicate the problem you report in a test gallery of my own.
Please post the URL to your gallery so that I can take a look for myself. (There may be a combination of configuration options which is causing the problem.)

Go to forum: Juicebox-Pro Support

3,934 Reply by Steven @ Juicebox

(2 replies, posted in Juicebox-Pro Support)

You'll need to set backButtonPosition to either TOP or OVERLAY.
If you do not set backButtonPosition, then Juicebox will use its default value of NONE and the Back Button will not be displayed (regardless of any of the other Back Button options which may have been set).
For reference, a list of all Back Button configuration options can be found here.

Go to forum: Juicebox-Pro Support

3,935 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Lite Support)

As you have not explicitly set a configUrl or baseUrl in your gallery's embedding code, Juicebox will, by default, look for your gallery's XML file to be named 'config.xml' and to be located in the same directory as the HTML page which contains the embedding code.
Therefore, your gallery's XML file should be located here: http://www.website-design.ca/exhibition/config.xml
... but it does not seem to be there. Going directly to this location in a browser results in an error 404 (file not found).

Upload your 'config.xml' file to your 'exhibition' directory and your gallery should display fine (as long as the paths within the XML file are correct).

If you want to rename or relocate your gallery's XML file, you can do so using the configUrl configuration option.
For example:

<!--START JUICEBOX EMBED-->
<script src="jbcore/juicebox.js"></script>
<script>
new juicebox({
configUrl: "/gallery/custom.xml",
containerId: "juicebox-container",
galleryWidth: "100%",
galleryHeight: "100%",
backgroundColor: "#222222"
});
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

Go to forum: Juicebox-Lite Support

3,936 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Pro Support)

Set showImageNumber="FALSE" in JuiceboxBuilder-Pro's 'Customize -> Caption' section.

Go to forum: Juicebox-Pro Support

3,937 Reply by Steven @ Juicebox

(5 replies, posted in Juicebox-Pro Support)

I'm glad you were able to get it working.
Thank you for sharing your code. Hopefully others will be able to benefit from it.

Go to forum: Juicebox-Pro Support

3,938 Reply by Steven @ Juicebox

(7 replies, posted in Juicebox-Lite Support)

I see a flash during the transitions on the embedded gallery and flikr gallery

One thing that these galleries have in common is that neither completely fills the browser window.
However, if this was somehow a contributing factor, then I would expect you to see the flickering in other galleries which do not completely fill the browser window (such as the Flat Design and Top-Left Alignment demo galleries).
The two galleries you see the flickering in have much in common with other demo galleries on the page which you do not report seeing the flickering in so, at the moment, I am unable to draw any conclusions as to what the problem might be.

I guess its a local issue to my computer.

It certainly seems to be.
Out of interest, what operating system and version of Safari do you use?
If you are not already using the latest version of Safari for your system, try updating it to see if this helps.

Go to forum: Juicebox-Lite Support

3,939 Reply by Steven @ Juicebox

(7 replies, posted in Juicebox-Lite Support)

I have just viewed your gallery in Safari 5.1.7 on my PC (and two other browsers which use the WebKit engine: Chrome 33 and Opera 20) and I see no flickering in transitions.

As I do not see the flickering in your gallery when I view it myself, it looks like the problem may not be with the gallery itself or due to a code conflict but it seems to be localized to your own browser/system.
Try clearing your browser's cache before reloading your gallery to see if this makes a difference.

Do you see the flickering in any of these demo galleries?
http://www.juicebox.net/demos/

Go to forum: Juicebox-Lite Support

3,940 Reply by Steven @ Juicebox

(7 replies, posted in Juicebox-Lite Support)

If you set a high enough 'z-index' value to your menu, it should be stacked on top of the gallery and function as expected.
Try adding the following code to the <head> section of your web page:

<style type="text/css">
.pure-menu ul {
    z-index: 9999 !important;
}
</style>

Go to forum: Juicebox-Lite Support

3,941 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Pro Support)

There are known issues (which are currently being investigated) whereby flickering can occur in Chrome if the gallery is either loaded into an iframe or hosted on Dropbox rather than on a regular web server.
However, your gallery is not hosted on Dropbox and is embedded directly in your web page.

I have viewed your gallery in Chrome 33 (and Firefox 28.0, IE11, Safari 5.1.7 and Opera 19.0) on my PC and do not see any flickering during image transitions at all in any browser.

Here are a few things to check and try:

(1) Try clearing your browser's cache before reloading your gallery's web page to see if this makes a difference.

(2) Try fixing the HTML errors on your web page.
You can check the code on your web page with the W3C Markup Validation Service and then fix the errors that are reported.
(There is a closing </p> tag on your web page with no matching opening <p> tag.)

(3) Try viewing your gallery on its own web page (rather than embedded in your main web page) to see if the flickering still occurs (to see if there is perhaps a conflict with some CSS or JavaScript code on your main web page): http://www.paradiseblue.com/gallery1/

If none of the above helps , then please post back and let me know what operating system and version number do you use. It might give us a clue to the source of the problem.

Go to forum: Juicebox-Pro Support

3,942 Reply by Steven @ Juicebox

(10 replies, posted in Juicebox-Pro Support)

I do not know the original reason for giving WP-Juicebox its own shortcode but I guess it would allow for additional attributes to be added at a later date (perhaps for new functionality in future versions) without hijacking WordPress's own gallery shortcode.

Go to forum: Juicebox-Pro Support

3,943 Reply by Steven @ Juicebox

(6 replies, posted in Juicebox-Lite Support)

Thank you for posting the link to your gallery. I see the problem that you report in Chrome 33.
It looks like the problem is somehow related to the gallery being hosted on Dropbox.
I created a sample gallery using imageTransitionType="CROSS_FADE" and uploaded it to a Dropbox 'Public' folder and it also flickers between image transitions. However, I uploaded the same gallery to a couple of different regular web servers and the problem does not occur.
I have notified the developers of this issue but if the problem is with Dropbox and a solution cannot be achieved within the code of Juicebox itself, then the only workarounds at the moment would be to either change the imageTransitionType or to host your gallery on a regular web server.

Go to forum: Juicebox-Lite Support

3,944 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Pro Support)

Please post suggestions for future versions of Juicebox in the Feature Request forum thread
It keeps them all together and ensures that they are not overlooked.
Thank you.

Go to forum: Juicebox-Pro Support

3,945 Reply by Steven @ Juicebox

(1 replies, posted in Juicebox-Lite Support)

Please see the answer to Question #3 in this forum thread.
Essentially, you could either:
(1) Set up a Juicebox gallery sourced by images in a Flickr account. You could then upload new image to your Flickr account and they would automatically be included in your gallery without the need to modify any gallery files.
... or:
(2) Use a server-side scripting language (such as PHP) to read the contents of a directory and dynamically generate a gallery's XML file on-the-fly when the gallery is displayed. You could then just upload new images to the designated directory as and when required.

Go to forum: Juicebox-Lite Support

3,946 Reply by Steven @ Juicebox

(10 replies, posted in Juicebox-Pro Support)

The previous version of the site was on WordPress using the same Juicebox gallery - I've just updated the template to use Foundation 5 to improve the site on mobiles. Scrolling wasn't a problem before.

It sounds like the problem is likely to be a JavaScript conflict between Juicebox and Foundation 5 (or a bug in the Windows Phone browser).

WordPress has its own wp_is_mobile() function so if you wanted to prevent the 'juicebox.js' JavaScript file from being loaded on your pages, then you could open the 'wp-juicebox/wp-juicebox.php' file in a plain text editor and wrap line 28 in the wp_is_mobile() function (allowing add_action() to be run only if wp_is_mobile() returns false):

if (!wp_is_mobile()) {
    add_action('wp_enqueue_scripts', array(&$this, 'add_scripts_wp'));
}

If you have a more specific function which checks for a Windows Phone, then you could use this instead of wp_is_mobile().

With regard to the Juicebox shortcode which is already in the post, you would want WordPress to replace it with nothing (an empty string). Ordinarily, if you just disabled the add_shortcode() function on line 41 of the 'wp-juicebox.php' file (using the same method as above), then WordPress would simply display the Juicebox shortcode as plain text in the post.
In order to work around this, you would need to add the following to the very beginning of the shortcode_handler() function on line 219 of the 'wp-juicebox.php' file:

if (!wp_is_mobile()) {
    return;
}

Again, replace wp_is_mobile() with your own more specific function.

Go to forum: Juicebox-Pro Support

3,947 Reply by Steven @ Juicebox

(6 replies, posted in Juicebox-Lite Support)

@mark

I can post a link to a test gallery if it helps at all.

Yes, please post the URL to your gallery so that I can take a look and investigate further.
Also, please let me know what versions of OS X and Juicebox-Pro you are using.
Thank you.

The issue above affects only galleries loaded into iframes and there is no known issue with flickering in Chrome (or Safari) when galleries are embedded directly into a web page.

Try clearing your browser's cache before reloading your gallery to see if this helps.

Also, make sure that you do not have imagePreloading set to NONE. If the next image in the gallery is not preloaded, then it is possible that the transition may not be as smooth as it could be otherwise.

Do you see the problem in this demo gallery which uses the CROSS_FADE imageTransitionType?

Go to forum: Juicebox-Lite Support

3,948 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Pro Support)

What you are currently doing is possibly the best solution.
If you want to dynamically change a configuration option, then it is certainly much easier to do so by setting the option in the embedding code (via a JavaScript variable) rather than try to set it in the gallery's XML file.
Also, it is not possible to change the value of a configuration option once the gallery has been loaded so the only option would be to reload the gallery with the new value (as you are doing).

Go to forum: Juicebox-Pro Support

3,949 Reply by Steven @ Juicebox

(10 replies, posted in Juicebox-Pro Support)

The link to WP-Juicebox (from the plugin's support web page) has now been fixed and points towards the current version (v1.3.3.1) so you could try upgrading WP-Juicebox to see if it helps.
Although there have been many changes between v1.3.3.0 and v1.3.3.1 (please see the version history for details) I do not think that there have been any code changes that will make a difference to the problem that you reported but it is certainly worth a try.

Go to forum: Juicebox-Pro Support

3,950 Reply by Steven @ Juicebox

(4 replies, posted in Juicebox-Lite Support)

As far as I am aware, there are currently no plans to change the Shopping Cart provider.

However, in a future version of Juicebox, we plan to allow users to associate a unique purchase URL to each individual image in the gallery.
If the main image being displayed has a purchase URL associated with it, then the Shopping Cart button will be displayed on the Button Bar and the user will be taken to the purchase URL when it is clicked.

This will not be a direct alternative to Fotomoto but it will certainly allow users more flexibility.

In the meantime, you could perhaps set up links to individual purchase pages (to whatever shopping cart solution you wish to use) from within your image titles or captions.

Go to forum: Juicebox-Lite Support