Juicebox v1.5.1 Released!

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

2013-02-02 21:06:04

All the gallery files must be on the same domain (or subdomain) due to the same-origin policy security restriction.
Please see this web page for further details.

An <iframe> will work as all the gallery files reside on a single domain (or subdomain) and the <iframe> simply loads the gallery's 'index.html' page.

2013-02-01 21:34:47

Are these commands tied to the left and right arrow keys in a browser?

No. They are commands that can be called using JavaScript to navigate through the main images in the gallery.
If enableKeyboardControls="TRUE", the left and right arrow keys enable users to do the same but they are not directly linked to the API controls. They are an alternative way to navigate through the images.
Perhaps whatever software comes with the remote control can be configured to simulate specific key presses (to use the Juicebox-Pro keyboard shortcuts) or to run custom JavaScript code (to use the Juicebox-Pro API methods).

2013-02-01 21:28:00

but if I don't 'Insert into page' then there are no photos in the gallery

If you do not click 'Insert into page', the images are still attached to the page (and can be viewed in the 'Add Media' window by selecting 'Uploaded to this post' from the drop-down menu) and will be displayed in the gallery.

and if I do insert into page, then the gallery is empty and all the images are just inserted into the page one after another.

If you do click 'Insert into page', then the images should be displayed in the gallery and also displayed individually by WordPress.
If you have an empty gallery with images attached to the post, please post the URL so that I can take a look and investigate further. Thank you.

2013-02-01 21:19:50

I'm glad you have solved your problem.
Thank you for posting back to let me know.

2013-02-01 08:28:06

The layout of the thumbnails on the thumbnail page in Small Screen Mode is partly determined by the code within the 'juicebox.js' file which is obfuscated and cannot be modified. It is not possible to change this functionality via CSS alone, although the tips I provided above (using Thumbnail configuration options) may help a little.

2013-02-01 08:00:49

Is there any way to get a browser to respond to the next slide and previous slide commands of the usual powerpoint remote controls?

I am not familiar with powerpoint remote controls but it is possible to change images in a Juicebox-Pro gallery programmatically by using the showNextImage() and showPreviousImage() methods from the Juicebox-Pro API.

Juicebox v1.5.1 Released!

Search options (Page 203 of 235)

Posts found: 5,051 to 5,075 of 5,851

5,051 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,052 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,053 Reply by Steven @ Juicebox 2013-02-04 23:24:46

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

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

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

5,055 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,056 Reply by Steven @ Juicebox 2013-02-04 22:47:50

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

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

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

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

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

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

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

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

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

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

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

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

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

5,063 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,064 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,065 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,066 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,067 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,068 Reply by Steven @ Juicebox 2013-02-03 07:50:58

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

5,069 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)

5,070 Reply by Steven @ Juicebox 2013-02-02 21:06:04

Re: Externally hosted gallery folder (3 replies, posted in Juicebox-Pro Support)

5,071 Reply by Steven @ Juicebox 2013-02-01 21:34:47

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

5,072 Reply by Steven @ Juicebox 2013-02-01 21:28:00

Re: Compatibility with WordPress 3.5 (7 replies, posted in Juicebox-Lite Support)

5,073 Reply by Steven @ Juicebox 2013-02-01 21:19:50

Re: Adding Photos (5 replies, posted in Juicebox-Pro Support)

5,074 Reply by Steven @ Juicebox 2013-02-01 08:28:06

Re: Background-color screenmode =small (8 replies, posted in Juicebox-Pro Support)

5,075 Reply by Steven @ Juicebox 2013-02-01 08:00:49

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

Posts found: 5,051 to 5,075 of 5,851