3,401

(496 replies, posted in Juicebox-Pro Support)

@ps76

If you ever need to edit multiple XML files again, you might like to take a look at Notepad++.
It is a free text editor which is capable of editing multiple files at once and it supports regular expressions so you could open all your gallery XML files and surround your existing captions with the <span></span> tags in a single search and replace action across all files.
Regular expressions take a bit of getting used to but they are a powerful tool when it comes to searching and replacing.

That's great!
Thank you for posting back to let me know.

3,403

(4 replies, posted in Juicebox-Pro Support)

Juicebox-Pro introduced the imageHAlign and imageVAlign configuration options (to horizontally and vertically align the main images within the gallery's image area) in v1.3.0 (released on 16 April 2013).
Please see the Version History for a full list of changes between versions.
For reference, a complete list of configuration options can be found here.

If you need to upgrade you version of Juicebox-Pro to access these configuration options, please see the Upgrading Juicebox support page here.
Once you have the latest version of JuiceboxBuilder-Pro installed, imageHAlign and imageVAlign can be found in the 'Customize -> Main Image' section.

Thank you for the additional information in the email you sent me.
It certainly sounds like the problem is due to viewing the galleries over a 3G connection rather than wi-fi.

Please see this FAQ:
Why can't I view my gallery on a 3G mobile connection?

If the problem is, indeed, content modification over a 3G connection, then the solution contained within the FAQ should work fine.
If your web server is Microsoft Internet Information Server (IIS) rather than Apache, then please see this web page for details on how to set the Cache-Control header to 'no-transform'.

I hope this resolves your problem.

3,405

(496 replies, posted in Juicebox-Pro Support)

@ps76

As I am sure you are aware, when showImageNumber="TRUE", the caption wraps before it reaches the image number (so that caption will never overlap the image number) and when using captionHAlign="CENTER", the caption will be centered in the available space (which does not count the space taken up by the image number).

I understand your request (and thank you for the suggestion) but I thought that I should point out (just in case you are not aware) that it is possible to tweak the position of the images titles and captions using inline CSS via HTML formatting as documented in this FAQ. (You could perhaps use CSS margin and padding properties to shift the titles and captions slightly.)
You could maybe use a caption such as:

<caption><![CDATA[<span style="margin-left: 20px;">Caption text goes here.</span>]]></caption>

Otherwise, you could maybe just bump your caption along a bit by adding a few spaces (&nbsp;) to its beginning:

<caption><![CDATA[&nbsp;&nbsp;&nbsp;Caption text goes here.]]></caption>

3,406

(15 replies, posted in Juicebox-Pro Support)

AudioOnload is not functional.

Unfortunately, it looks like the latest versions of Android no longer support automatic audio playback on loading a web page. The audio track must be initiated by the user (for example by clicking the Audio Button in a Juicebox gallery).
I cannot find the exact version of Android which introduced this restriction but a web search with terms such as "android auto play audio" returns many web pages which seem to confirm this.
It will not be possible to circumvent this behavior but I have notified the developers in order to update our online support pages with this information.

Is this also available for a hosting on Windows Server?

Please see this web page for details on how to set the Cache-Control header to 'no-transform' on IIS. (Your web host may be able to help you with this.)

3,407

(11 replies, posted in Juicebox-Pro Support)

It worked as you said i added www to the code line and now i can see my gallery :)

I'm glad you've got it working but adding 'www' to the paths in your embedding code will mean that the gallery will now display only on www.steinjanssen.nl and not steinjanssen.nl.
Use the code from my post above (using paths with a leading slash) and your gallery will display on both www.steinjanssen.nl and steinjanssen.nl.

3,408

(5 replies, posted in Juicebox-Pro Support)

The problem you report may be due to a bug whereby elements which have explicitly been assigned a CSS position are not covered by the fullscreen gallery (they should be). The developers are aware of this bug and it should hopefully be fixed in a future version of Juicebox.

Known workarounds are to set either expandInNewPage="TRUE" (so that when the gallery is expanded, it will be displayed on a new page of its own rather than on top of the embedding page, avoiding any CSS conflicts) or to set useFullscreenExpand="TRUE".

If you find that setting useFullscreenExpand="TRUE" does not help and you do not want to use expandInNewPage="TRUE", then you may need to wait for the bug to be fixed. Unfortunately, I do not know how long this may be.

3,409

(1 replies, posted in Juicebox-Lite Support)

Please check the following:
(1) Make sure that the thumbnails have been uploaded to the correct location on your web server.
(2) Check the permissions of the thumbnail files (and their containing folder) on your web server (with an FTP program or within your web hosting CPanel) in case they are currently too restrictive and cannot be read by browsers. Default permissions of 755 for folders and 644 for files should be fine.
(3) Make sure that the 'thumbUrl' paths in the gallery's XML file are correct and that the filenames in the XML file exactly match the thumbnail image filenames themselves. Take care with uppercase vs lowercase characters. Your web server is likely to be case-sensitive and 'thumb.jpg' is not the same as 'thumb.JPG'.

Hopefully this will help.
If you continue to experience difficulties, please post the URL to your gallery's web page so that I can take a look and help further.

If the problem turns out to be directly related to the use of the Juicebox module for Drupal, then please note that we did not write the module ourselves and support for the module would be better directed towards the Drupal forum where the author of the module should be able to help you out further.

3,410

(3 replies, posted in Juicebox-Pro Support)

As I mentioned, it is not possible to change the share URL sent to the social media networks.

If you like, you can post suggestions for future versions in the Feature Requests forum thread. This keeps them all together and ensures that they are not overlooked. Thank you.

3,411

(11 replies, posted in Juicebox-Pro Support)

Your gallery's embedding code uses absolute paths with the steinjanssen.nl domain but the link you provided uses the www.steinjanssen.nl subdomain.
All gallery files must be on the same domain or subdomain as the HTML page containing the JavaScript embedding code due to the same-origin policy.

Use relative paths within your embedding code and your gallery should display on both steinjanssen.nl and www.steinjanssen.nl.

<script src="/gallery/jbcore/juicebox.js"></script>
<script>
    new juicebox({
        containerId: "juicebox-container",
        baseUrl: "/gallery/",
        galleryWidth: "100%",
        galleryHeight: "100%",
        backgroundColor: "#222222"
    });
</script>

The leading slash in the paths above denotes your root directory.

It looks like there may also be a problem with the sizing of the gallery on your web page.
Please check the CSS code used to define the dimensions of the gallery's parent containers on your web page.
Alternatively, you might like to try setting your gallery's own dimensions as fixed pixel values (rather than percentages).
For example:

<script src="/gallery/jbcore/juicebox.js"></script>
<script>
    new juicebox({
        containerId: "juicebox-container",
        baseUrl: "/gallery/",
        galleryWidth: "800",
        galleryHeight: "600",
        backgroundColor: "#222222"
    });
</script>

3,412

(6 replies, posted in Juicebox-Pro Support)

Just out of curiosity, does the sort.php approach slow things up noticeable for big galleries of (say, 100+) images?

No, it should not noticeably slow down the loading of a gallery.
I have just run a test using a gallery of 100 images.
I created 3 scenarios:
(1) A standard gallery with a static XML file.
(2) The same gallery but using the 'sort.php' file above (using EXIF info to sort the images).
(3) The same gallery but using the 'sort.php' file with a different sorting algorithm (using just the file name from the static XML file rather than having to extract EXIF info from the images themselves).
All three galleries loaded in pretty much the same time. There was very little difference between the three of them. (In fact, on clearing my browser's cache and reloading the galleries, there as no clear winner in terms of the fastest gallery to load the first image.)

3,413

(15 replies, posted in Juicebox-Pro Support)

So the problem appears to be that audio does not play on load in the stock browser on a Samsung S3 running Android 4.3 (but that the functionality and icon status of the Audio Button is OK).

Unfortunately, this may be unavoidable (similar to iOS devices) and that the user will have to click the Audio Button to start the audio playing.

Have you tried a different browser (such as Chrome) yet to see if this makes a difference?

3,414

(11 replies, posted in Juicebox-Pro Support)

You have a stray ' character at the beginning of your <script> tag's 'src' value which is preventing the 'juicebox.js' file from being loaded.
Change:

<script src="'http://steinjanssen.nl/gallery/jbcore/juicebox.js"></script>

.. to:

<script src="http://steinjanssen.nl/gallery/jbcore/juicebox.js"></script>

3,415

(11 replies, posted in Juicebox-Pro Support)

On your web page, you currently use the following embedding code:

<script src="http://steinjanssen.nl/gallery/jbcore/juicebox.js"></script>
<script>
new juicebox({
containerId: "juicebox-container",
baseUrl : 'http://steinjanssen.nl/Gallerij.html/',
galleryWidth: "100%",
galleryHeight: "100%",
backgroundColor: "#222222"
});
</script>

There are two problems with this.

(1) The 'juicebox.js' file is not located at the location specified in your <script> tag: http://steinjanssen.nl/gallery/jbcore/juicebox.js

(2) The baseUrl should point towards your gallery folder and there is no folder in your root directory named 'Gallerij.html'.

From your screenshot, it looks like some (but not all) of your gallery folder's contents have been uploaded to your root directory. If using the baseUrl method of embedding, you should upload the entire gallery folder (not just the contents) to your web server.

Try the following.
If your gallery folder is named 'gallery', then upload the entire gallery folder to your root directory (to your 'public_html' directory) and use the following embedding code in your web page:

<script src="'http://steinjanssen.nl/gallery/jbcore/juicebox.js"></script>
<script>
    new juicebox({
        containerId: "juicebox-container",
        baseUrl: "http://steinjanssen.nl/gallery/",
        galleryWidth: "100%",
        galleryHeight: "100%",
        backgroundColor: "#222222"
    });
</script>

3,416

(15 replies, posted in Juicebox-Pro Support)

I have now been able to take a look at your gallery and the configuration options it uses (although I do not have a Samsung S3 on which to test).

I made a test on 3G and WiFi on Android phone, I confirm that audio is playing with WiFi (but playAudioOnLoad doesn't work) I have to turn on Audio button.

Is the audio icon's status always correct, though? When you load the gallery, does the audio icon in the button bar show the 'Click to play audio' status and does a single click (rather than a double-click) play the audio? It sounds like your stock Android browser does not support playAudioOnLoad (like iOS devices) but that the Audio Button is displaying and functioning correctly.
Try a difference browser (such as Chrome) to see if this makes a difference.
Also, try setting expandInNewPage="AUTO" or expandInNewPage="TRUE" (rather than expandInNewPage="FALSE") to expand the gallery on a new page (rather than within the embedding page) to see if this makes a difference.

With 3G connection no audio at all.

Maybe this is due do with the fact that your audio tracks are approximately 7MB each and are taking longer to download over 3G. Does the gallery display OK over your 3G connection? If not, please see this FAQ for a solution.

I also notice that your gallery's Back Button icon is not visible.
The Back Button icon's color should be determined by the buttonBarIconColor but is overridden by the textColor (which in your gallery is fully transparent). Either change your gallery's textColor (so that it is not fully transparent) or remove this configuration option from your gallery's XML file and your gallery's Back Button icon should become visible.
(I have logged a bug report with the developers regarding this and it should hopefully be fixed in a future version.)

3,417

(9 replies, posted in Juicebox-Pro Support)

That's great! Thank you for posting back to let me know.

3,418

(6 replies, posted in Juicebox-Pro Support)

@wspollack

Thank you for your input. Any information which might help is appreciated.

@patrick7

With regard to my original suggestion of creating a gallery with JuiceboxBuilder-Pro and then doing the sorting dynamically via PHP when the gallery is displayed (rather than when it is created), here is an example which will display the images in the order in which they were taken (comparing the EXIF 'DateTimeOriginal' values for each image) from earliest to latest.

(1) In your gallery's embedding code, use a configUrl to point to a PHP file named 'sort.php':

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

(2) Create the PHP file named 'sort.php' with the following code:

<?php
header('Content-Type: application/xml');
$xml = simplexml_load_file('config.xml');
$arr = array();
foreach($xml->image as $img) {
    $arr[] = $img;
}
usort($arr, function($a, $b) {
    $a_exif_data = @exif_read_data($a->attributes()->imageURL);
    $b_exif_data = @exif_read_data($b->attributes()->imageURL);
    $a_exif_date = !empty($a_exif_data['DateTimeOriginal']) ? strtotime($a_exif_data['DateTimeOriginal']) : '';
    $b_exif_date = !empty($b_exif_data['DateTimeOriginal']) ? strtotime($b_exif_data['DateTimeOriginal']) : '';
    return $a_exif_date - $b_exif_date;
});
$dom_doc = new DOMDocument('1.0', 'UTF-8');
$dom_doc->formatOutput = true;
$settings_tag = $dom_doc->createElement('juiceboxgallery');
foreach ($xml->attributes() as $key=>$value) {
    $settings_tag->setAttribute($key, $value);
}
foreach($arr as $img) {
    $image_element = $dom_doc->createElement('image');
    foreach($img->attributes() as $key=>$value) {
        $image_element->setAttribute($key, $value);
    }
    $title_element = $dom_doc->createElement('title');
    $title_text = $dom_doc->createCDATASection($img->title);
    $title_element->appendChild($title_text);
    $image_element->appendChild($title_element);
    $caption_element = $dom_doc->createElement('caption');
    $caption_text = $dom_doc->createCDATASection($img->caption);
    $caption_element->appendChild($caption_text);
    $image_element->appendChild($caption_element);
    $settings_tag->appendChild($image_element);
}
$dom_doc->appendChild($settings_tag);
echo $dom_doc->saveXML();
?>

(3) Place the 'sort.php' file in your gallery folder (in the same directory as the gallery's 'config.xml' file).

This solution relies on the images in the gallery's 'images' folder having EXIF info.
Please note that JuiceboxBuilder-Pro strips EXIF info when resizing images so, if you are using JuiceboxBuilder-Pro to create your gallery, you may need to resize your images in an imaging program such as Adobe Photoshop (and ensure that the EXIF info is retained when saving them) before feeding them to JuiceboxBuilder-Pro and then deselect the 'Resize Images' checkbox (on the 'Images' tab) so that JuiceboxBuilder-Pro just copies the images (with EXIF info intact) into the gallery's 'images' folder.

I hope this helps.

Steven, the ability to sort by file creation (capture) date seems like an obvious feature to add.

Thank you for posting your suggestion in the Feature Requests thread. (It keeps all the suggestions together and ensures that they are not overlooked.)

3,419

(15 replies, posted in Juicebox-Pro Support)

here is the url to my website

At the moment, your web page is not loading for me at all. I have tried a couple of different browsers and the little icons in the browser tabs just keep spinning. I will try to view your gallery later. Once I can view your gallery, I might have a better idea as to the cause of your problem.

the gallery doesn't load on adroid phone

Please make sure that you are viewing your gallery using a wi-fi connection rather than 3G. Viewing a gallery using a 3G connection can break Juicebox if your provider uses content modification. If you are using a 3G connection, then please see this FAQ which provides a solution to the problem:
Why can't I view my gallery on a 3G mobile connection?

I made the test on Samsung S3 Adroid 4.3

Thank you for the information.

3,420

(6 replies, posted in Juicebox-Pro Support)

The only sorting options available within the JuiceboxBuilder-Pro interface are 'By File Name', 'By File Date' and 'Reverse' (from the 'Images -> Sort' drop-down menu at the top) and the ability to drag and drop a thumbnail (or a Ctrl+Click or Shift+Click selection of thumbnails) into a new position on the 'Images' tab.
There are no other automated methods of sorting images within a  gallery.

It would be possible to sort image's dynamically using a server-side scripting language such as PHP (no matter what order the images actually are in the gallery's XML file) but it would likely involve a lot of work to create such a script and knowledge of PHP would be required.
You would load the PHP script using a configUrl in your gallery's embedding code.
The script would then read the gallery's own static XML file, store the image tag data in an array, sort the array into whatever order you require (assuming that the property that the sorting relies on is available within PHP) and then output a new XML file on-the-fly.
This would be further complicated by the need to ensure that all associated thumbURL, linkURL, linkTarget, <title> and <caption> entries are still attached to their respective images.
It might also not be quite as fast as loading a gallery with a static XML file (especially in a gallery with a large number of images) but it might be an avenue you wish to pursue further.

Thank you for testing the demo galleries.
I have now notified the developers of this issue. Thank you for reporting it.

3,422

(15 replies, posted in Juicebox-Pro Support)

@aleckaram

Please post the URL to your gallery so that I can take a look.
Also, please let me know exactly which devices and browsers (and version numbers) you use.

Also, please bear in mind that playAudioOnLoad (the ability to start playing audio automatically when the gallery is loaded) is not supported on iOS devices.
(This is noted in the description of the playAudioOnLoad configuration option on the Config Options page.)

Thank you.

@mark44345

I notice that your gallery uses Juicebox-Pro v1.4.0.
Ordinarily, I would ask you to upgrade your gallery to ensure that any bugs that may have been present in previous versions but which have since been fixed are not contributing to your problem.
However, if the problem happens in our own demo galleries, then this is unlikely to help (although you could still upgrade your gallery if you like by following the instructions here).

I do not have a Galaxy S4 on which to test and would appreciate some help gathering some information.
Do all of our demo galleries which use Splash Pages on mobile devices exhibit the problem?
Lite Embedded: http://www.juicebox.net/demos/lite/embedded/
Pro Embedded: http://www.juicebox.net/demos/lite/embedded/
Splash Page: http://www.juicebox.net/demos/pro/splash/
Blog Style: http://www.juicebox.net/demos/pro/blog/
API Demo: http://www.juicebox.net/demos/support/api/
Top-Left Alignment: http://www.juicebox.net/demos/pro/top/

Also, could you please confirm that you are viewing the galleries using a wi-fi connection rather than 3G? (If your 3G provider uses content modification, then this can break Juicebox.)

Thank you for your help.

3,424

(1 replies, posted in Juicebox-Pro Support)

In the code you posted above, the showImageNumber="false" configuration option comes after the > character which closes the opening <juiceboxgallery> tag.
Change:

captionBackColor="rgba(0,0,0,0.1)">
showImageNumber="false"

... to:

captionBackColor="rgba(0,0,0,0.1)"
showImageNumber="false">

3,425

(3 replies, posted in Juicebox-Lite Support)

The Gallery Title can be positioned using the galleryTitlePosition (OVERLAY, TOP, ABOVE_THUMBS, NONE) and galleryTitleHAlign (LEFT, CENTER, RIGHT) configuration options. However, please not that these configuration options are available in Juicebox-Pro only. They are not available in Juicebox-Lite, the free version.) Both of these configuration options can be found in the General section of the Config Options page.

You can change the font used throughout the gallery using the galleryFontFace configuration option. Again, this is a Pro-only configuration option (which can also be found in the General section of the Config Options page).

With Juicebox-Lite (and Juicebox-Pro), you could change the font of the Gallery Title using HTML formatting as noted in this FAQ:
How do I add HTML formatting to the Gallery Title or Back Button?

For example, in JuiceboxBuilder-Lite, you could enter a Gallery Title such as the following:

<span style="font-family: Times; font-size: 20px; color: #ffff00;">Big times text</span>