Juicebox v1.5.1 Released!

2017-06-30 18:21:11

Juicebox was not designed with the ability to add unique tooltip text to individual thumbnails.
However, if you wanted to add the same tooltip text to all thumbnails, then you could use something like the following code:

<!--START JUICEBOX EMBED-->
<script src="jbcore/juicebox.js"></script>
<script>
    var jb = new juicebox({
        containerId: "juicebox-container",
        galleryWidth: "100%",
        galleryHeight: "100%",
        backgroundColor: "222222"
    });
    jb.onInitComplete = function() {
        $('.jb-idx-thumb').attr('title', 'Tooltip Text Goes Here');
    };
    jb.onThumbPageChange = function(e) {
        $('.jb-idx-thumb').attr('title', 'Tooltip Text Goes Here');
    };
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

Just change the two instances of Tooltip Text Goes Here to whatever text you'd like to use.

2017-06-30 11:54:50

If you need to display your gallery on demand (when a button is clicked), then I would recommend one of the following.

(1) To display the gallery on a page of its own, use a regular HTML link (an <a> tag) to open the gallery's 'index.html' page. You can incorporate a Back Button in your gallery to allow users to return to the original web page.

or...

(2) To display the gallery within your web page alongside other content, wrap the gallery's embedding code inside a JavaScript function and call the function when required.
To see this in action, create a sample gallery with JuiceboxBuilder-Pro and use the following code as the gallery's 'index.html' page.
Load the 'index.html' page in your browser and you'll see that the gallery is displayed when the 'Load Gallery' button is clicked.

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" id="jb-viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0" />
        <style type="text/css">
            body {
                margin: 0px;
            }
        </style>
        <title>Test</title>
    </head>
    <body>
        <div id="link">
            <input id="load" type="button" value="Load Gallery" />
        </div>
        <script type="text/javascript" src="jbcore/juicebox.js"></script>
        <script type="text/javascript">
            function loadGallery() {
                new juicebox({
                    containerId: "juicebox-container",
                    galleryHeight: "400",
                    galleryWidth: "600"
                });
            }
            $(document).ready(function() {
                $('#load').click(function() {
                    loadGallery();
                });
            });
        </script>
        <div id="juicebox-container"></div>
    </body>
</html>

2017-06-22 17:37:48

As far as I am aware, 'option_id' is not something that is used by the current version of WP-Juicebox.
At the moment, I cannot remember if 'option_id' was perhaps something that was used by an older version (and is no longer required) but I've searched through the files for several previous versions and cannot find any instance of 'option_id'.
Please let me know what version of WP-Juicebox you are currently using and I'll look into it further to see if I can figure out what 'option_id' is or was.
Also, in case it helps, please let me now what your 'option_id' and 'last_id' are currently set to and how many WP-Juicebox galleries you currently have.
Thank you.

Edit:
It sounds like you've got it sorted out. Thank you for letting me know.
Also, thanks for sharing your steps which might help others who are migrating their own WordPress sites.

2017-06-21 21:05:53

Sorry, my mistake. Try searching for 'juicebox_options' with an underscore instead of a dash.
Apologies for the typo. I've corrected my post above.

2017-06-21 16:19:28

All the WP-Juicebox data files for the galleries are stored in the 'wp-content/uploads/juicebox/' directory so be sure to copy the content of this folder over to your new WordPress site.

The only other WP-Juicebox info that would need to be transferred is the last-used gallery id number.
This is stored as a WordPress Option in the 'wp_options' table named 'juicebox_options['last_id']'.

Copying all of the above (as well as the gallery shortcodes in your pages and posts) should be all that is required to reinstate your galleries in your new WordPress site.

I hope this helps.

2017-06-15 16:25:26

Thank you for posting your query with additional information over in the Showkase forum.
https://showkase.net/forum/viewtopic.php?id=344

2017-06-15 11:45:56

@ehsan_Roots

I'm glad you've been able to resolve your problem. Thank you for letting me know.
Feel free to share your problem and solution here in the forum as it might help other users facing similar issues.
Thank you.

2017-06-15 11:42:11

I'm not sure what you mean.
Can you explain in a bit more detail what information you're looking for? Thanks.

If you're looking to install a pro viewer into Showkase (across all themes), instructions are here.

2017-06-14 22:34:54

Thank you for marking this thread as solved.
I hope that you've been able to resolve your problem.

2017-06-14 12:36:52

I think your problem is due to your site having 3 levels in its navigation menu (gallery index pages grouped under other gallery index pages). Showkase natively supports only 2 levels in its navigation menu and it is not possible to group a gallery index page under another gallery index page in the interface. A gallery index page can be only a top-level menu item.

Normally, when viewing a top-level page, the navigation menu displays all top-level links and also links to pages grouped under the current page. When you select a second-level page, the navigation menu remains the same.
Your problem seems to occur when you select a third-level page (a gallery grouped under a gallery index page grouped under another gallery index page). Everything in the navigation menu displays and works as expected until a third-level page is selected when the navigation menu displays only top-level links.
I'm not sure how you achieved a third level but Showkase was not designed to support or handle this. (It sounds like you would need a third row of links in the navigation menu and this is not something that Showkase has ever been able to do.)

As far as I am aware, there were no changes between v1.6.1 and v1.7.0 with regard to the navigation menu.
Perhaps you had made some manual modifications to the v1.6.1 source files (or maybe to your theme's 'custom.css' or 'custom.js' files) which were overwritten when you upgraded to v1.7.0.

If you are sure that v1.6.1 displayed the links in a way that v1.7.0 does not, then I would not ordinarily recommend using an older version of any software but maybe reverting to v1.6.1 might be the easiest remedy for your problem (as long as your site does not suffer from any of the bugs fixed in v1.7.0).

Incidentally, we have a dedicated Showkase forum here.

2017-06-14 10:44:56

You're welcome.
Hopefully creating and merging SEO code for several galleries shouldn't be too big of a task.
If you still have local copies of your galleries on your computer, you can open the galleries in JuicbeoxBuilder-Pro to have the application generate the SEO code for you (one less thing for you to do manually).
Knowing the baseUrl that you will use for each gallery, you can then change the <img> tag 'src' attributes in the SEO code so that the relative paths from the embedding page to the images in their respective gallery folders are correct. (For each gallery, this can be done with just a single global search and replace action in a text editor such as Notepad++.)
Then all that is left to do is merge the SEO code for all galleries and copy and paste it inside the 'juicebox-container' <div>.

2017-06-14 10:36:42

You're welcome!
I hope you're able to move your gallery's Button Bar to where you'd like it to be. (I thing using the CSS classes I suggested with negative margins and adding '!important' is perhaps the best solution. It seems to work well in my own test gallery so I hope it works for you, too.)

2017-06-14 00:09:19

I'd really recommend that you position the Button Bar using the available Button Bar configuration options (buttonBarPosition and buttonBarHAlign).
If you try to reposition the Button Bar manually using CSS, Juicebox will not know of this modification and will expect the Button Bar to be in a different position. This might have unforeseen knock-on effects, for example if the browser window is narrowed and the Button Bar needs to wrap onto multiple lines. (This might not apply to your own gallery with only one button on the Button Bar but it could be a concern for anyone else reading this thread with a larger Button Bar.)

Having said that, you are certainly free to try repositioning the Button Bar using CSS (but please be aware that such modifications are not officially supported).
You should be able to find out which classes and/or ids you might need to apply your custom CSS rules to (and what rules are currently being applied to specific elements) using your browser's developer tools (F12).

Try something like the following:

.jb-classifier-link-wrapper.jb-classifier-detail-area.jb-classifier-layer {
    margin-top: -10px !important;
    margin-right: -24px !important;
}

2017-06-13 23:44:35

For reference, the Search Engine Optimization support section can be found here.

When you create a gallery with JuiceboxBuilder-Pro, select the 'Add SEO Content' checkbox in the 'Customize -> Sharing' section and SEO code will be generated. The SEO code will be included in the gallery's 'index.html' file (which can be used to view the gallery on a page of its own) but it will also be presented in the 'Get Embed Code' window on JuiceboxBuilder-Pro's 'Publish' tab. As long as you follow the regular embedding instructions here you can just copy and paste the entire embedding code into your web page and all should be fine.

However, things are complicated slightly with your own setup. Not only do you use a baseUrl (which would mean that you would need to modify the paths to the images in the SEO code as JuiceboxBuilder-Pro has no knowledge of your custom gallery structure when generating the SEO code) but you also switch between multiple galleries on the same page. You would probably need to merge the SEO code from your multiple galleries (making sure that the paths to the images are correct for each gallery) and manually insert it into your web page (inside the 'juicebox-container' <div> within <noscript> ... </noscript> tags, which is how JuiceboxBuilder-Pro presents the SEO code).

Try creating a sample gallery with JuiceboxBuilder-Pro (with the 'Add SEO Content' checkbox selected) and check the 'Get Embed Code' window on the 'Publish' tab to see the format that JuiceboxBuilder-Pro uses for the SEO code if you plan to implement it manually for your own web page.

Placing the SEO code (<img> tags) inside <noscript> ... </noscript> tags is not hiding the images (so Google should not penalize your site for this). It is simply telling the browser that this is what should be displayed if JavaScript is disabled. Not only is this a method of adding the SEO code to your web page, it also ensures that your gallery images will still be seen even if JavaScript is disabled in the browser.

2017-06-13 10:45:05

You're welcome!

2017-06-13 10:44:59

You're welcome!

2017-06-13 10:44:01

(1) Upload all your images (the gallery images and the image you'd like to use as the representing image on the gallery index page) on the gallery page's 'Upload' tab.
(2) On the 'Images' tab, select the image you'd like to use on the gallery index page (via the corresponding radio button in the 'Index' column).
(3) On the ''Customize' tab, scroll down to the 'Override Site Options' section and deselect the 'Show index image' checkbox.
(4) Now click 'Save' and 'Publish'.

2017-06-12 11:20:44

Drag and drop the gallery page name onto the gallery index page name.
For example, click and hold the text 'Land', drag it onto the text 'Galleries' (make sure the small arrow is directly to the left of the text 'Galleries', not above or below it) and release the mouse click. (Then click 'Save' and 'Publish'.)

2017-06-12 10:18:36

From your screenshot, it looks like you are referring to the Kosel theme in Showkase.

You can hide individual pages from the navigation menu by dragging and dropping the page name onto 'Hidden pages' on the 'Pages' tab (and then clicking 'Save' and 'Publish'). The page's URL will remain the same but there will no longer be an entry for it in the navigation menu.

There is no way to disable the navigation menu completely from within the Showkase interface (other than dragging and dropping all page named onto 'Hidden pages') but you could hide the navigation menu using CSS if you like.
Try adding something like the following to your '/showkase/_themes/kosel/css/custom.css' file:

#nav {
    display: none;
}

If you want to hide the navigation menu only on a certain page, then you can check the page's id (from the 'class' attribute in the page's <body> tag) and use something like the following in your '/showkase/_themes/kosel/css/custom.css' file:

.page-2 #nav {
    display: none;
}

More information about using custom CSS within Showkase can be found in the Adding Custom Styles and Fonts support section.

2017-06-08 23:11:35

No problem! I'm glad my suggestion worked. Thanks for letting me know.

2017-06-08 12:11:22

I'm glad you've been able to find a suitable workaround. Thank you for letting me know.
With regard to you Button Bar issue, this looks like it might be caused by a known bug where the Button Bar does not always wrap correctly when there is insufficient space for all the buttons. The developers are aware of this issue and it should hopefully be fixed in the next version. In the meantime, it might help to change the size of the Button Bar icons via buttonBarIconSize (in JuiceboxBuilder-Pro's 'Customize -> Button Bar' section). The default value is 20 so you could try using a slightly smaller or larger value. Hopefully this will help.

2017-06-08 11:40:23

I've glad that you've been able to resolve your problem.
Thank you very much for letting me know.

Paths in WordPress pages are often absolute but they are usually generated dynamically when the page is displayed.
As you are aware, any hard-coded absolute paths will certainly cause problems if a WordPress site is moved.

2017-06-08 01:07:01

I'm pretty sure this is a Cross-Origin issue. I've been able to replicate the problem myself in a test scenario but, unfortunately, I've been unable to find a good solution.

Normally, your gallery is hosted on gallery.charleychau.com but is displayed on charleychau.com.
However, when the gallery is expanded from the Splash Page, it is displayed via the 'full.html' page within the 'jbcore' folder on gallery.charleychau.com (swapping the domain on which the gallery is being displayed). To complicate matters, Juicebox passes configuration options to the 'full.html' page via a session cookie.

I've tried adding the following line to the .htaccess in my test scenario file to add cookie support to the CORS solution.

Header set Access-Control-Allow-Credentials true

... and I've tried adding the full .htaccess file:

Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Credentials true

... to both domains (in theory to allow access in both directions) but it does not work.

The only thing I've been able to think of would be to set expandInNewPage="FALSE" to prevent the gallery from being displayed via the 'full.html' page when it is expanded from the Splash Page. The gallery will then be expanded on top of the embedding page (still on the charleychau.com domain) which may cause a scaling problem on iOS devices. (Expanding the gallery on a page of its own is designed to avoid this potential scaling issue.) It's certainly worth a try, though.
Alternatively, you could keep expandInNewPage="AUTO" and lock the viewport of your gallery's web page.
Please see the Expand Gallery Behavior support section for details.

I hope this is a suitable workaround for your problem (as it seems to work well in my test scenario).

2017-06-07 23:30:47

It's a Wordpress site but I can find no plugin that looks like Juicebox.

The Juicebox plugin for WordPress is called WP-Juicebox and, if installed, it will be listed on the 'Plugins' page in the WordPress admin section.

There is a Portfolio section for the theme so perhaps the juicebox is somehow built into the theme?

As far as I am aware, there are no official themes which contain Juicebox so if Juicebox is somehow built into a theme, someone has been very creative!

This leads me to think perhaps there is a hard-coded "www" somewhere in a setup file. However I can find no setup file. I see talk on this forum of an "embed" file but at this point I have no idea where to find that file.

If WP-Juicebox is not installed, then it is likely that individual Juicebox galleries have been embedded manually into pages or posts.
Each gallery consists of a 'jbcore' folder (containing the Juicebox core files), a 'config.xml' file (containing the gallery's image data and configuration options) and 'images' and 'thumbs' folders. This should give you something to search for on your server.
In addition to the files required for a Juicebox gallery, there will be some embedding code (in the body of the page or post containing the gallery) which will look something like this:

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

If you find a Juicebox gallery that does not work, then it is certainly possible that the paths in the embedding code are pointing to the wrong places.
For each web page containing a gallery (or galleries), there will always be a path pointing towards the 'juicebox.js' file (inside the 'jbcore' folder).
Depending on the structure of the gallery, there may (or may not) be additional paths in the embedding code as follows:
(1) A configUrl path pointing towards a specific configuration file.
(2) A baseUrl path, pointing towards a specific gallery folder (please see here for details).

If there is any way for you to let me see the site (or at least a dysfunctional Juicebox gallery page), I should hopefully be able to help you further. Thank you.

2017-06-07 22:55:59

Thank you for providing the screenshot.

Regarding point 3 that you made - we are using an Adobe script on the site that applies a specific font family on the site. Is this an example of a global CSS rule?

It could be, depending on how the CSS rule is applied. If it applied to only certain ids or classes, then things should be OK but if it is applied to all elements on the web page (being applied to * or the html or body tags), then you might run into problems with the gallery inheriting the font, although I can't actually override the Juicebox font myself by doing something similar (see below).

Also, we are testing the gallery on a staging server and not one that is public. Could this be affecting the gallery?

This is likely to be a factor only if there is a problem with the font MIME types on your staging server.

I am not sure if these are part of the font files that are uploaded with the juicebox module or not.

The icons in the screenshot are not part of the Juicebox font and I do not know where they are coming from. I've never seen the Juicebox font get hijacked like this before.
I can't even override the font myself by adding CSS code such as the following to a gallery's web page:

*, html, body, #juicebox-container {
    font-family: Courier !important;
}

The icons still display fine in my own test gallery, even with the code above in place.

In order to troubleshoot the problem further, please try the following.
(1) Create a sample gallery with JuiceboxBuilder-Pro (the desktop application which comes with Juicebox-Pro).
(2) Upload the complete gallery folder to your web server.
(3) Open the gallery's 'index.html' file (inside the gallery folder) to view the gallery on a web page of its own.

If the icons all display fine when you view the test gallery on its own 'index.html' page, then there is no problem with your server and the problem lies somewhere within the code on your other gallery's web page.
If the icons do not display fine in the test gallery, then there is likely to be a problem with the font MIME types on your server.

This should at least point you in the right direction and be one step closer to reaching a solution.

You could also use your browser's developer tools (F12) to try to figure out what custom CSS code on your web page might be overriding the gallery's own font.

Juicebox v1.5.1 Released!

Search options (Page 64 of 235)

Posts found: 1,576 to 1,600 of 5,863

1,576 Reply by Steven @ Juicebox 2017-06-30 18:21:11

Re: thumbnail tooltips (1 replies, posted in Juicebox-Pro Support)

1,577 Reply by Steven @ Juicebox 2017-06-30 11:54:50

Re: Need help with my gallery (1 replies, posted in Juicebox-Pro Support)

1,578 Reply by Steven @ Juicebox 2017-06-22 17:37:48

Re: Export Juicebox Galleries [SOLVED] (7 replies, posted in Juicebox-Pro Support)

1,579 Reply by Steven @ Juicebox 2017-06-21 21:05:53

Re: Export Juicebox Galleries [SOLVED] (7 replies, posted in Juicebox-Pro Support)

1,580 Reply by Steven @ Juicebox 2017-06-21 16:19:28

Re: Export Juicebox Galleries [SOLVED] (7 replies, posted in Juicebox-Pro Support)

1,581 Reply by Steven @ Juicebox 2017-06-15 16:25:26

Re: About Customize Viewers (3 replies, posted in Juicebox-Pro Support)

1,582 Reply by Steven @ Juicebox 2017-06-15 11:45:56

Re: Including videos in the photo album. Is it possible? (2 replies, posted in Juicebox-Pro Support)

1,583 Reply by Steven @ Juicebox 2017-06-15 11:42:11

Re: About Customize Viewers (3 replies, posted in Juicebox-Pro Support)

1,584 Reply by Steven @ Juicebox 2017-06-14 22:34:54

Re: Showkase - navigation menu links [SOLVED] (3 replies, posted in Juicebox-Pro Support)

1,585 Reply by Steven @ Juicebox 2017-06-14 12:36:52

Re: Showkase - navigation menu links [SOLVED] (3 replies, posted in Juicebox-Pro Support)

1,586 Reply by Steven @ Juicebox 2017-06-14 10:44:56

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

1,587 Reply by Steven @ Juicebox 2017-06-14 10:36:42

Re: Button bar (3 replies, posted in Juicebox-Pro Support)

1,588 Reply by Steven @ Juicebox 2017-06-14 00:09:19

Re: Button bar (3 replies, posted in Juicebox-Pro Support)

1,589 Reply by Steven @ Juicebox 2017-06-13 23:44:35

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

1,590 Reply by Steven @ Juicebox 2017-06-13 10:45:05

Re: How to disable Juicebox page navigator url ? (3 replies, posted in Juicebox-Pro Support)

1,591 Reply by Steven @ Juicebox 2017-06-13 10:44:59

Re: Showkase pro 1.70 issue [SOLVED] (3 replies, posted in Juicebox-Pro Support)

1,592 Reply by Steven @ Juicebox 2017-06-13 10:44:01

Re: Hide image in the gallery itself (1 replies, posted in Juicebox-Pro Support)

1,593 Reply by Steven @ Juicebox 2017-06-12 11:20:44

Re: Showkase pro 1.70 issue [SOLVED] (3 replies, posted in Juicebox-Pro Support)

1,594 Reply by Steven @ Juicebox 2017-06-12 10:18:36

Re: How to disable Juicebox page navigator url ? (3 replies, posted in Juicebox-Pro Support)

1,595 Reply by Steven @ Juicebox 2017-06-08 23:11:35

Re: Embedding a responsive gallery into a Shopify web page [SOLVED] (11 replies, posted in Juicebox-Pro Support)

1,596 Reply by Steven @ Juicebox 2017-06-08 12:11:22

Re: Embedding a responsive gallery into a Shopify web page [SOLVED] (11 replies, posted in Juicebox-Pro Support)

1,597 Reply by Steven @ Juicebox 2017-06-08 11:40:23

Re: Newbie - HELP! [SOLVED] (3 replies, posted in Juicebox-Lite Support)

1,598 Reply by Steven @ Juicebox 2017-06-08 01:07:01

Re: Embedding a responsive gallery into a Shopify web page [SOLVED] (11 replies, posted in Juicebox-Pro Support)

1,599 Reply by Steven @ Juicebox 2017-06-07 23:30:47

Re: Newbie - HELP! [SOLVED] (3 replies, posted in Juicebox-Lite Support)

1,600 Reply by Steven @ Juicebox 2017-06-07 22:55:59

Re: Button Bar icons appear as broken links (4 replies, posted in Juicebox-Pro Support)

Posts found: 1,576 to 1,600 of 5,863