• Registered: 2012-06-27
  • Posts: 4

Topic: Caption and HTML code

Hello.

Can i put html code into caption? I want the "like button" and "google + buttom" for every picture of the gallery

Another option to help me?

Im sorry about my English. I speak Spanish

Thank you, greetings, Jose.

  • Registered: 2012-04-24
  • Posts: 5,924

Re: Caption and HTML code

Yes. You can use <html> code within your captions.
If using JuiceboxBuilder-Pro to create or edit your gallery, you can enter the code directly into the caption text fields on the 'Images' tab, such as:

<a href="http://www.example.com/">Link</a><br><img src="images/image.jpg">

If editing your gallery's XML file manually in a plain text editor, you will need to enclose your caption within CDATA tags so it will look like this:

<caption><![CDATA[<a href="http://www.example.com/">Link</a><br><img src="images/image.jpg">]]></caption>

I do not know exactly what or how much code you intend to use so the best thing to do would be to simply try it and see if it works.

  • Registered: 2012-06-27
  • Posts: 4

Re: Caption and HTML code

Thanks Steve for your quickly answer.

I want use "facebook like button", and this is the code: 

<div class="fb-like" data-send="false" data-width="450" data-show-faces="false"></div>

If i use that code in caption section doesn't work.

Can you help me?

Thank you! Greetings from Uruguay

  • Registered: 2012-04-24
  • Posts: 5,924

Re: Caption and HTML code

If i use that code in caption section doesn't work.

This is probably due to the fact that your code relies on JavaScript which is stored in a different document.

One possible way to feature a Facebook Like button for individual images would be to:
(1) Use the <iframe> implementation of the Facebook Like button.
(2) Place the button on your gallery's HTML index page (not in the captions for each image).
(3) Set enableDirectLinks="TRUE" so that each image has a unique URL.
(4) Use the Juicebox-Pro API (specifically the onImageChange() event) to change the 'src' attribure of the <iframe> (which is essentially the URL for the Facebook Like button) each time the user selects a different image.
Try using the following as your gallery's 'index.html' file:

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Juicebox-Pro Gallery</title>
        <meta charset="utf-8" />
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name="description" content="This is a Juicebox-Pro Gallery. Get yours at www.juicebox.net" />
        <style type="text/css">
            body {
                margin: 0px;
            }
       </style>
        <script type="text/javascript" src="jbcore/juicebox.js"></script>
        <script type="text/javascript">
            var jb;
            $(document).ready(function () {
                jb = new juicebox({
                    containerId : 'juicebox-container',
                    enableDirectLinks : 'TRUE'
                });
                jb.onImageChange = function(e) {
                    var original=document.getElementById("fb").src;
                    var modified=original.replace(/\?href=(.*?)&/, "?href=" + encodeURIComponent(document.location) +"&");
                    document.getElementById("fb").src=modified;
                }
            });
        </script>
        </head>
    <body>
        <div id="juicebox-container"></div>
        <div id="overlay" style="position: absolute; top: 50px; left: 10px; z-index: 999;">
            <iframe id="fb" src="//www.facebook.com/plugins/like.php?href=#&amp;send=false&amp;layout=standard&amp;width=450&amp;show_faces=false&amp;action=like&amp;colorscheme=light&amp;font&amp;height=35" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:35px;" allowTransparency="true"></iframe>
        </div>
    </body>
</html>

Please note that use of the Juicebox-Pro API requires Juicebox-Pro and will not work with Juicbeox-Lite.

  • Registered: 2012-06-27
  • Posts: 4

Re: Caption and HTML code

I have Juicbeox-Lite right now.

What's the different about "pro single site" and "pro multi site"?

I have 20 web pages.

  • Registered: 2012-04-24
  • Posts: 5,924

Re: Caption and HTML code

The Juicebox-Pro Single Licence allows you to have an unlimited number of galleries on a single domain (and subdomains).
For example, if you own the domain example.com, then you can upload your galleries to example.com, www.example.com, sub1.example.com, sub2.example.com, etc.

The Juicebox-Pro Multi Licence would be required if you wish to upload Juicebox-Pro galleries to up to 5 different domains, such as example1.com, example2.com, etc.

If all of your 20 web pages are on the same domain, then a Juicebox-Pro Single Licence will be fine for you.

  • Registered: 2012-06-27
  • Posts: 4

Re: Caption and HTML code

i have 20 web pages in differents domains, example:

web1.com
web2.net
web3.org
.
.
.
web18.net
web19.com
web20.com

have i buy 4 Juicebox-Pro multi licence??

  • Registered: 2012-04-24
  • Posts: 5,924

Re: Caption and HTML code

Yes. If you want to upload Juicebox-Pro galleries to all 20 of your domains, then you would need to purchase 4 Multi Licences.