Hi.
I'm sorry to hear that you are having difficulty with Juicebox-Pro.
I hope my notes below help.
First of all, just in case you've not yet seen it, please take a look at the Embedding Multiple Galleries support section. There are several online examples (whose source you can view in your browser) which might help.
The key to embedding multiple galleries into a single web page is to keep the galleries separate from each other and, as you have already tried, embed each gallery into a container with a unique 'id'. (Make sure that the containerId in the embedding code matches the actual 'id' of the container <div>.)
The easiest way to do this would be to use the baseUrl method of embedding documented here. This allows you to keep each gallery in its own individual folder (and prevents gallery files from getting mixed up or overwritten).
The baseUrl embedding code is essentially the same as the regular embedding code but with a baseUrl entry pointing towards a gallery folder.
Also, you'll only need to load the 'juicebox.js' file once per page (not once per gallery), so just load the file from within one of your galleries.
Here's an example.
(1) Create two galleries with JuiceboxBuilder-Pro and save them to two different folders named 'gallery1' and 'gallery2'.
(2) Upload these two complete gallery folders to the root directory of your web server.
(3) Now use the following embedding code (which will display the galleries one below the other).
<script src="/gallery1/jbcore/juicebox.js"></script>
<script>
new juicebox({
baseUrl: "/gallery1/",
containerId: "juicebox-container1",
galleryWidth: "800",
galleryHeight: "600",
backgroundColor: "#222222"
});
</script>
<div id="juicebox-container1"></div>
<script>
new juicebox({
baseUrl: "/gallery2/",
containerId: "juicebox-container2",
galleryWidth: "800",
galleryHeight: "600",
backgroundColor: "#222222"
});
</script>
<div id="juicebox-container2"></div>
The leading slashes in the paths above denote your root directory so the code above will work (without modification) in any web page throughout your site as long as your gallery folders are named 'gallery1' and 'gallery2' and are located in your root directory.
You can, of course, name your gallery folders anything you like and upload them to any location you like, as long as the paths in the embedding code (the path to the 'juicebox.js' file and the baseUrl entries) are correct.
The baseUrl entries can be relative paths (relative to the web page containing the embedding code) or absolute paths (starting with http:// or https://).
I hope this helps.
However, if you continue to experience difficulties, please let me know and I'll try to help further.
If possible, please post a link to your web page so that I can see the problem for myself and hopefully determine exactly what the problem is and propose a solution.
Thank you.