Juicebox v1.5.1 Released!

2013-02-05 21:17:48

The exteriors gallery shows with the thumbnails but won't display the large images even though the larger images are in the folder.

Going to the first image in your Exteriors gallery (http://www.finecustombuilding.com/galle … erior1.jpg) directly in a browser does not display the image as expected.
Things to check:
(1) Double-check that the file actually exists in the correct location.
(2) Make sure that the file extension of the imageURL entry in your gallery's XML file matches that of the image itself. Your web server is likely to be case-sensitive and .jpg is not the same as .JPG.
(3) Check the permissions on the 'images' folder (and the images themselves) to ensure that they can be read.

The projects (gallery3) doesn't display at all.

It looks like the 'jbcore' folder is missing from your 'gallery3' directory on your web server.

2013-02-05 21:09:26

I have been looking for a page that lists the keyboard controls for Juicebox, can't find it.

Please see the description for the enableKeyboardControls configuration option in the General section of the Config Options page.

2013-02-05 07:35:16

i have placed the gallery folder in my dreamweaver file is this what you mean ?
or do i need to upload it to my host which is fatcow?

Whether you upload the files via Dreamweaver or a separate FTP program, you would need to ensure that the contents of the gallery folder (not the folder itself) are in the root of your web space so that, for example, your gallery's XML file (named 'config.xml') is located at www.cdstiling.co.uk/config.xml

is there a step by step guide ?

The Juicebox embedding guide can be found here.
There is also a note for Dreamweaver users here.
However, as I mentioned before, if you plan to embed multiple galleries, I would recommend using the baseUrl method of embedding as documented here.

Essentially:
(1) Upload your complete gallery folder (in this example, named 'mygallery') to the root of your web space (depending on your web server this is likely to be a folder named 'public_html' or 'htdocs').
(2) Change your current embedding code to the following:

<!--START JUICEBOX EMBED-->
<script src="http://www.cdstiling.co.uk/mygallery/jbcore/juicebox.js"></script>
<script>
new juicebox({
baseUrl: "http://www.cdstiling.co.uk/mygallery/",
containerId: "juicebox-container",
galleryWidth: "100%",
galleryHeight: "600",
backgroundColor: "#222222"
});
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

2013-02-05 06:30:57

Try giving your navigation container a high z-index value via CSS so that it is stacked on top of the gallery.

2013-02-05 06:28:10

I'm looking forward to it

Just to clarify, I do not know if the developers will implement your suggestion but you have posted your feature request in the correct place and it will not be overlooked.
Hopefully you will be able to implement one of the suggestions in my previous post to achieve the functionality you require.

2013-02-05 06:24:39

1/change 'AutoPlay ON' to 'autoplay on' and its off state too
My site is all lower case andca ps stand out rather glaringly. I would also prefer to change font size if that is possible
2/To change the pop up button notes similarly - i.e. 'Show Thumbnails' to 'show thumbnails'

It is not possible to change the onscreen tooltip text and messages or their font sizes.
However, the ability to change the text (though not the font size) is on the roadmap and should be included in a future version of Juicebox-Pro (although I do not know exactly when this may be).

3/ I did not set out to use captions and titles on my images and have thus not familiarized myself with the entire workings but so far I have not found how to achieve the following:
By default all titles and captions are not seen but when one clicks the info button one has the chance to read either or both of them.
Can this be done ?

Yes. Set captionPosition="OVERLAY" or captionPosition="OVERLAY_IMAGE" ('Caption' section of JuiceboxBuilder-Pro), showImageOverlay="NEVER" ('Main Image' section) and showInfoButton="TRUE" ('Button Bar' section). The captions will be initially hidden but displayed when the user clicks on the Info Button on the Button Bar.

2013-02-05 06:14:29

Thank you for providing the URL to your web site.
As you are embedding only one gallery per web page, there is no need to name your container ids differently (although it will do no harm) as there will be only one gallery container per page and there will be no conflict with any others.

Currently, the problem with your 'Interiors' gallery is that your http://www.finecustombuilding.com/interiors.html page contains the line:

<script src="http://www.finecustombuilding.com/gallery1/jbcore/juicebox.js"></script>

... but the 'juicebox.js' file does not seem to have been uploaded to that location.

I would start by embedding the galleries first and only then, once everything is working as required, would I recommend having your galleries share a 'jbcore' folder.

Essentially, just follow the baseUrl embedding instructions here for one gallery and, once you have got one working, move onto the next.

Upload a complete gallery folder, named 'gallery1' to the root of your web space and that gallery should be displayed on your 'Interiors' page (as the embedding code itself on the http://www.finecustombuilding.com/interiors.html page looks OK).

2013-02-04 23:37:40

From the documentation of jQuery I have seen, the use of jQuery requires the invocation of an external file called jquery.js. Yet that does not appear in the source code here.

jQuery is incorporated within the 'juicebox.js' file.

Can somebody please give me a step-by-step to doing this from the ground up?

Try this:
(1) Paste the code below into a file named, for example, 'main.html'.
(2) Include a complete gallery folder (in this example, named 'mygallery') in the same directory as the 'main.html' file.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <style type="text/css">
        html, body { height: 100%; overflow: hidden; }
        body {            
          margin: 0;
          padding: 0;
          background-color: #222;
          color: #666;
          font-family: sans-serif;
          font-size: 20px;        
        }
        a {    
          color: #ccc;
        }
        #header {
          text-align: center;
          background-color: #333;
          width: 100%;
          height: 20px;
          padding: 10px 0;
        }
        #footer {
          text-align: center;
          background-color: #333;
          color: #fff;
          width: 100%;
          height: 20px;
          padding: 10px 0;
          position: relative;
          bottom: 0;
          left: 0;
        }
        #juicebox-content {
          width: 100%;
          height: 600px;
        }    
    </style>
    <title>Juicebox Gallery</title>
    <script type="text/javascript" src="mygallery/jbcore/juicebox.js"></script>
    <script type="text/javascript">
    function doLayout() {
        var winHeight, headerHeight, footerHeight;
        winHeight = window.innerHeight ? window.innerHeight : $(window).height();
        headerHeight = $('#header').outerHeight();
        footerHeight = $('#footer').outerHeight();
        var newH = parseInt(winHeight) - parseInt(headerHeight) - parseInt(footerHeight);
        $('#juicebox-content').height(newH);
    }
    $(document).ready(function () {
        doLayout();
        $(window).bind('resize', doLayout);
        new juicebox({
            baseUrl: 'mygallery/',
            containerid : 'juicebox-container'
        });
    });
    </script>
</head>
<body>
    <div id="header">This is the header.</div>
    <div id="juicebox-content">
        <div id="juicebox-container"></div>
    </div>
    <div id="footer">This is the footer.</div>
</body>
</html>

All you would then need to do is:
(1) Set the height for the header and/or footer in the CSS section of the 'main.html' page as appropriate for your own code.
(2) Swap the content of the 'header' and/or 'footer' <div>s with your own code.
(3) Make sure that the two instances of 'mygallery' in the 'main.html' file match the actual name of your own gallery folder.

2013-02-04 23:24:46

This 'splash' screen appears that requires the user to click "View Gallery". (I prefer the user go straight to see the first image with thumbnails instead of this interstitial page.)

With Juicebox-Pro (though not with Juicebox-Lite), you would be able to set showSplashPage="NEVER" to skip the Splash Page and initially display the first image in the gallery. Alternatively, you could also set screenMode="LARGE" to force Juicebox-Pro to use Large Screen Mode on all devices and in all browsers. For more information on Screen Modes, please see here.

But the juicebox code is still trying to reference config.xml

I have viewed your gallery on my iPod Touch and your gallery displays OK. I do not see the 'Config XML not found.' error message.
Try clearing your browser's cache before reloading the gallery to make sure that your browser does is not hanging onto and using older versions of your gallery files.

2013-02-04 23:02:32

Where might I find this xml file? I've only seen "default.xml" so far, and I have a Juicebox gallery set up.

By default, a Juicebox gallery's XML file will be named 'config.xml' and will be inside the gallery folder alongside the 'jbcore' folder.
However, if using WP-Juicebox, the gallery's XML file is generated dynamically using PHP at the time the gallery is displayed so it cannot easily be modified manually.

YES. This is exactly what I want. Can I accomplish this while using Wordpress, like with a 12-column layout or something?

This sample gallery uses Juicebox-Pro configuration options so you would need to first upgrade WP-Juicebox from Juicebox-Lite (which it comes bundled with) to Juicebox-Pro by following the instructions here. You would then need to enter the following configuration options into the 'Pro Options' text area:

thumbsPosition="LEFT",
maxThumbColumns="3"
maxThumbRows="3"

2013-02-04 22:53:42

Thank you for posting your suggestion in the Feature Requests thread.

Will it be possible to add "AUTOPLAY", or there is a mode to trigger it writing in the code? If so where?

As well as the AutoPlay button on the Button Bar (which can be displayed by setting showAutoPlayButton="TRUE" in your gallery's XML file), you can also toggle the AutoPlay status on and off programmatically using the toggleAutoPlay() Juicebox-Pro API method.

2013-02-04 22:47:50

1. Once the watermark is applied and the image gallery Published/Saved, is there any way of removing ot applying a new watermarks to the images in a gallery?

One a watermark has been added to an image, it becomes part of that image and cannot be removed.
If you wanted to 'remove' a watermark from an image, you would need to remove the watermarked image from your gallery and re-add your original image without adding a watermark.

2. When a new image is added to a gallery, the watermark should be automatically applied. This does not always happen. Any ideas?

I am unable to replicate this issue. Can you run me through a series of steps that will reproduce this bug so that I can try to see it for myself? Thank you.

3. Does the watermark file get stored between closings of the program?

No.

4. Does the program save the info that a watermark has been applied to an image so that it does not try and add it the second time?

No. When adding a watermark, all images will be watermarked.

2013-02-04 22:24:53

@alelia

Thank you for the suggestion.

Will it be possible to add "AUTOPLAY", or there is a mode to trigger it writing in the code? If so where?

As well as the AutoPlay button on the Button Bar (which can be displayed by setting showAutoPlayButton="TRUE" in your gallery's XML file), you can also toggle the AutoPlay status on and off programmatically using the toggleAutoPlay() Juicebox-Pro API method.

2013-02-04 22:19:16

WP-Juicebox will display all images attached to a page or post, so if your page or post has a featured image, this will also be included in the Juicebox gallery. Therefore, I would recommend selecting an image which is already included in the gallery as the featured image.
However, if you would like to exclude a featured image from your WP-Juicebox gallery, open the 'wp-juicebox/config.php' file in a plain text editor and change line 52 from:

$attachments = get_children(array('post_parent'=>$post_id, 'post_type'=>'attachment', 'orderby'=>'menu_order ASC, ID', 'order'=>'DESC'));

... to:

$attachments = get_children(array('post_parent'=>$post_id, 'post_type'=>'attachment', 'orderby'=>'menu_order ASC, ID', 'order'=>'DESC',  'exclude'=>get_post_thumbnail_id($post_id)));

(The line number above refers to WP-Juicebox v1.2.0.)

2013-02-04 05:50:41

Please take a look at this forum thread for a Juicebox adaptaption of the SEO Script I linked to in my previous post above.

With regard to your latest query, you could set enableDirectLinks="TRUE" in your gallery's XML file (which will give each image a unique URL using the '#' character) and you could then use the onImageChange() Juicebox API event to add SEO code to a container (which would be hidden via CSS) using JavaScript. However, I do not know how Google would treat this. There would essentially be only one page and Google would not know how many dynamic versions of the page could be created by appending image numbers to the URL.

2013-02-03 23:15:01

As you are using percentages for both the width and height of your gallery, make sure that all parent containers of your gallery have widths and heights specified via CSS.
Otherwise, try changing your gallery's dimensions from percentages to absolute pixel values.

Also, you could check your web page's code with the W3C Markup Validation Service and fix the HTML errors reported. This may also help.

Your web page also loads two different (and old) versions of jQuery.
Try including only a single instance of the most recent version of jQuery (v1.9.0) to see is this makes a difference.

2013-02-03 22:50:27

@ZabParis

If you were to load the gallery into an iframe, display the page containing the iframe in a browser and view the source of the iframe, then the SEO code will be displayed.
However, if you would like the SEO code to be inserted into the page which contains the iframe, then you would need to create a container on the page with the iframe, such as:

<div id="seo"><?php include("juicebox-seo.php"); ?></div>

... and hide it with CSS such as:

<style type="text/css">
    #seo {
        display: none;
    }
</style>

2013-02-03 22:28:03

Thank you for providing the URL to your web site.
Your gallery's embedding code has been inserted ito your web page OK but your gallery files have not been uploaded to the correct location on your web server.
For your gallery to function correctly, you would need to copy the contents of your gallery folder into the same directory as the HTML page which contains your gallery's embedding code (in your case, this is the root of your web space).

If you plan to embed multiple galleries, I would recommend using the baseUrl method of embedding as documented here.
This would allow you keep each gallery as a self-contained entity in its own folder and upload the complete gallery folders (not just the contents) to anywhere on your web server (as long as you know where they are).

2013-02-03 22:19:32

If you would like your gallery's height to be 600px, then, rather than using:

#juicebox-container {
    width: 100%;
    height: 600px;
}

<script>
    new juicebox({
    containerId : 'juicebox-container',
    galleryWidth: '100%',
    galleryHeight: '100%',
    backgroundColor: '#222222'
    });
</script>
<div id="juicebox-container"></div>

... just set the gallery's height in the embedding code:

<script>
    new juicebox({
    containerId : 'juicebox-container',
    galleryWidth: '100%',
    galleryHeight: '600',
    backgroundColor: '#222222'
    });
</script>
<div id="juicebox-container"></div>

Also, if you would like to have a header on your web page and then have your Juicebox-Pro gallery fill the remainder of the user's browser window (with no vertical scroll bars), please see the Using a Resizable Gallery with a Header example in the Juicebox Embedding Guide.

2013-02-03 22:11:42

First of all, please make sure that you are using the current version of Juicebox-Pro (v1.2.0).
Instructions for Upgrading Juicebox can be found here.

Ordinarily, the caption text should be vertically centered in the caption area so make sure that your web page contains no generalized CSS rules which the gallery elements may inherit. Apply CSS rules to only those elements on your web page which require them through use of ids and classes.

Adding a couple of line breaks (<br><br>) to the end of your caption text may also help push it up the caption area.

2013-02-03 22:03:01

If you are trying to embed multiple galleries into a web site, I would recommend using the baseUrl method of embedding as documented here.
This would allow you to upload complete gallery folders (not just the contents) to anywhere on your web server (as long as you know where they are) without the need to rename or move any files within the gallery folders.
For example, if you had two complete gallery folders named 'gallery1' and 'gallery2' and you uploaded them to the root of your web space (in this example, a domain named 'www.example.com'), then the embedding code for the two galleries would be:

<script src="http://www.example.com/gallery1/jbcore/juicebox.js"></script>

<script>
  new juicebox({
    baseUrl : 'http://www.example.com/gallery1/',
    containerId : 'juicebox-container1',
    galleryWidth : '800',
    galleryHeight : '600',
    backgroundColor: '#222222'
  });
  </script>
<div id="juicebox-container1"></div>

<script>
  new juicebox({
    baseUrl : 'http://www.example.com/gallery2/',
    containerId : 'juicebox-container2',
    galleryWidth : '800',
    galleryHeight : '600',
    backgroundColor: '#222222'
  });
  </script>
<div id="juicebox-container2"></div>

(When embedding galleries as above, you can still have all your galleries share a single 'jbcore' folder.)

2013-02-03 08:10:55

there is no "Add Juicebox Gallery" option, only "Manage Galleries" and "Help"

The only two options under the WP-Juicebox heading in the Dashboard are 'Manage Galleries' and 'Help'.
The 'Add Juicebox Gallery' option can be found when creating or editing a post in the toolbar above the text area.
When in 'Visual' mode, you should see the Juicebox icon and when in 'Text' mode, you should see the 'Add Juicebox Gallery' text button.
If you do not see either button, try temporarily reverting to the default WordPress theme, deactivating all other plugins and then reactivating the plugins one by one until you find the source of the conflict. If you do find a conflict, please post back to let me know so that I can investigate further.

2013-02-03 07:54:11

Check that your gallery's 'images' and 'thumbs' folders have been uploaded to the correct locations on your web server.
According to your gallery's XML file, the first image in your gallery should be located here: http://www.loomzine.org/images/LOOM-web.jpg
... but going directly to this location in a browser results in an error 404 (file not found).

2013-02-03 07:50:58

You will not be able to merge a Juicebox gallery's 'config.xml' file with another XML file. The Juicebox gallery will require its own XML file.
If your website already has a file named 'config.xml' (which will conflict with the gallery's 'config.xml' file), then you can rename the gallery's 'config.xml' file and point to it using the configUrl configuration option in the gallery's embedding code.
For example:

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

2013-02-02 21:09:20

I wondering if someone could assist me with how to create the external folder that will allow all three galleries to pull (functionality) from the same jbcore folder yet display the individual photos contained in each gallery's folder.

Instructions for allowing multiple galleries to share a single 'jbcore' folder can be found here: Using an External jbcore Folder

Juicebox v1.5.1 Released!

Search options (Page 205 of 237)

Posts found: 5,101 to 5,125 of 5,907

5,101 Reply by Steven @ Juicebox 2013-02-05 21:17:48

Re: Trying to imbed gallery on multiple pages. (15 replies, posted in Juicebox-Lite Support)

5,102 Reply by Steven @ Juicebox 2013-02-05 21:09:26

Re: Juicebox as a powerpoint presenter (5 replies, posted in Juicebox-Pro Support)

5,103 Reply by Steven @ Juicebox 2013-02-05 07:35:16

Re: Dreamweaver and juicebox pro (5 replies, posted in Juicebox-Pro Support)

5,104 Reply by Steven @ Juicebox 2013-02-05 06:30:57

Re: Drop Down Page Navigation Entries (1 replies, posted in Juicebox-Pro Support)

5,105 Reply by Steven @ Juicebox 2013-02-05 06:28:10

Re: Setting Image click mode on "AUTOPLAY" (3 replies, posted in Juicebox-Pro Support)

5,106 Reply by Steven @ Juicebox 2013-02-05 06:24:39

Re: customizing autoplay and other messages - and captions/info (1 replies, posted in Juicebox-Pro Support)

5,107 Reply by Steven @ Juicebox 2013-02-05 06:14:29

Re: Trying to imbed gallery on multiple pages. (15 replies, posted in Juicebox-Lite Support)

5,108 Reply by Steven @ Juicebox 2013-02-04 23:37:40

Re: Top Navigation Not Displaying in Explorer 8 and 9 (5 replies, posted in Juicebox-Pro Support)

5,109 Reply by Steven @ Juicebox 2013-02-04 23:24:46

Re: merging config.xml - error (5 replies, posted in Juicebox-Lite Support)

5,110 Reply by Steven @ Juicebox 2013-02-04 23:02:32

Re: Emulate SimpleViewer? (12 replies, posted in Juicebox-Lite Support)

5,111 Reply by Steven @ Juicebox 2013-02-04 22:53:42

Re: Setting Image click mode on "AUTOPLAY" (3 replies, posted in Juicebox-Pro Support)

5,112 Reply by Steven @ Juicebox 2013-02-04 22:47:50

Re: Watermark in Juicebox-Pro; Questions (2 replies, posted in Juicebox-Pro Support)

5,113 Reply by Steven @ Juicebox 2013-02-04 22:24:53

Re: Feature Requests (498 replies, posted in Juicebox-Pro Support)

5,114 Reply by Steven @ Juicebox 2013-02-04 22:19:16

Re: wordpress and featured image (4 replies, posted in Juicebox-Pro Support)

5,115 Reply by Steven @ Juicebox 2013-02-04 05:50:41

Re: Search Engine Optimization (3 replies, posted in Juicebox-Lite Support)

5,116 Reply by Steven @ Juicebox 2013-02-03 23:15:01

Re: merging config.xml - error (5 replies, posted in Juicebox-Lite Support)

5,117 Reply by Steven @ Juicebox 2013-02-03 22:50:27

Re: SEO Compatible (23 replies, posted in Juicebox-Pro Support)

5,118 Reply by Steven @ Juicebox 2013-02-03 22:28:03

Re: Dreamweaver and juicebox pro (5 replies, posted in Juicebox-Pro Support)

5,119 Reply by Steven @ Juicebox 2013-02-03 22:19:32

Re: Top Navigation Not Displaying in Explorer 8 and 9 (5 replies, posted in Juicebox-Pro Support)

5,120 Reply by Steven @ Juicebox 2013-02-03 22:11:42

Re: Move caption text up a little (1 replies, posted in Juicebox-Pro Support)

5,121 Reply by Steven @ Juicebox 2013-02-03 22:03:01

Re: Trying to imbed gallery on multiple pages. (15 replies, posted in Juicebox-Lite Support)

5,122 Reply by Steven @ Juicebox 2013-02-03 08:10:55

Re: Don't Have "Add Gallery" option under Juicebox Icon (2 replies, posted in Juicebox-Lite Support)

5,123 Reply by Steven @ Juicebox 2013-02-03 07:54:11

Re: Loading for an indefinite amount of time (1 replies, posted in Juicebox-Lite Support)

5,124 Reply by Steven @ Juicebox 2013-02-03 07:50:58

Re: merging config.xml - error (5 replies, posted in Juicebox-Lite Support)

5,125 Reply by Steven @ Juicebox 2013-02-02 21:09:20

Re: Trying to imbed gallery on multiple pages. (15 replies, posted in Juicebox-Lite Support)

Posts found: 5,101 to 5,125 of 5,907