Juicebox-Pro is very flexible (with well over 100 configuration options, an API so that the embedding page can interact with the gallery and the ability to use custom icons, themes, fonts and preloader) but it is not possible to add a custom button to the gallery's own Button Bar.
One possible workaround would be to create a custom button on your web page (alongside your gallery) and use the API to fetch information about the currently displayed image (for example to be sent to a social media platform via a share URL).

Please check your email. I have sent you a message. Thank you.

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

The ideal solution would be to have a custom field within the interface where you could enter a directory name to be prepended to the image names in the imageURL entries.
What you could perhaps do is enter a value in the Pro Options text area that Juicebox itself does not use such as:

directory="http://cdn.ryansmithphotography.com/juicebox/weddings"

You could then modify the Lightroom plugin's 'config.xml' template file to use this value as the start of each imageURL.
You could also instruct the plugin to not write this value to the configuration options in the opening <juiceboxgallery> tag (although this would not actually make any difference to the gallery as Juicebox would just ignore the custom attribute).

Try the following, which will accept a key named 'directory' in the Pro Options text area.
If you entered:

directory="http://cdn.ryansmithphotography.com/juicebox/weddings"

... into the Pro Options text area, then it would result in an imageURL such as:

imageURL="http://cdn.ryansmithphotography.com/juicebox/weddings/images/image.jpg"

Open the 'juicebox.lrwebengine/config.xml' file in a plain text editor and change lines 89-120 to the following:

local dir = ""

for index, value in ipairs(pro_options) do
    if value ~= "" then
        local attrs = explode("=", trim(value), 2)
        if table_length(attrs) == 2 then
            local key = escape(attrs[1]:gsub("%s+", ""))
            local value = escape(trim(attrs[2]):gsub("^([`'\"])(.-)%1$", "%2"))
            if key:lower() == "directory" then
                dir = value
            elseif not lite_options[key:lower()] then
                write("\n" .. key .. "=\"" .. value .. "\"")
            end
        end
    end
end %>
>

<% for index = 1, numImages do %>
    <image imageURL="<%= dir %>/images/<%= getImage(index).exportFilename %>.jpg" thumbURL="thumbs/<%= getImage(index).exportFilename %>.jpg" linkURL="<%= getImage(index).metadata.linkURL %>" linkTarget="_blank">
        <title><![CDATA[<%= strip_control_characters(getImage(index).metadata.title) %>]]></title>
        <caption><![CDATA[<%= strip_control_characters(getImage(index).metadata.caption) %>]]></caption>
    </image>
<% end %>

</juiceboxgallery>

Juicebox was not designed to allow users to add custom buttons to the Button Bar.
Juicebox will expect the Button Bar to be a certain size and in a certain position (determined by the Button Bar configuration options set in the gallery).
If you change the size or position of the Button Bar (using CSS and JavaScrtipt), Juicebox will not know of such modifications and you will encounter problems (such as the one you have reported when resizing the browser window).

Unfortunately, there is no easy solution to your problem as the code controlling what you are looking to change is within the 'juicebox.js' file which is obfuscated and modifying the source code is not supported.
Please see this FAQ: Does Juicebox-Pro include the source code?

Your baseUrl entry is in the wrong place. It needs to be inside the new juicebox({ ... }); section.
Change:

<!--START JUICEBOX EMBED-->
<script src="http://ciproweb.com/sadlerconstructionnc/gallery/jbcore/juicebox.js"></script>
<script>
new juicebox({
containerId: "juicebox-container",
galleryWidth: "100%",
galleryHeight: "100%",
backgroundColor: "rgba(93,93,93,1)"
});
</script>
<div id="juicebox-container"></div>
baseUrl : 'http://ciproweb.com/sadlerconstructionnc/gallery/',
<!--END JUICEBOX EMBED-->

... to:

<!--START JUICEBOX EMBED-->
<script src="http://ciproweb.com/sadlerconstructionnc/gallery/jbcore/juicebox.js"></script>
<script>
    new juicebox({
        baseUrl : 'http://ciproweb.com/sadlerconstructionnc/gallery/',
        containerId: "juicebox-container",
        galleryWidth: "100%",
        galleryHeight: "100%",
        backgroundColor: "rgba(93,93,93,1)"
    });
</script>
<div id="juicebox-container"></div>
<!--END JUICEBOX EMBED-->

If you wanted to start each imageURL with a certain string (to denote the start of an absolute path), then you could modify the template file that the Lightroom plugin uses to generate the gallery's 'config.xml' file.
Open the 'juicebox.lrwebengine/config.xml' file in a plain text editor and change the imageURL entry line 114 from:

imageURL="images/<%= getImage(index).exportFilename %>.jpg"

... to something like:

imageURL="http://cdn.ryansmithphotography.com/images/<%= getImage(index).exportFilename %>.jpg"

Thank you for clarifying the problem.
Please try this version of the plugin. [Link removed.] Hopefully it will resolve the issue.

Thank you for reporting this problem. I will ensure that it is fixed in the next version of the Lightroom plugin.

The code you posted will give the gallery (the 'juicebox-container' div) a z-index value of 9999 (via the 'menu_devant' class) which will force the gallery in front of all elements with a lower z-index value.

Remove the following code from your style-menu2.css file:

 .menu_devant {
 position:absolute;
 z-index:9999;
 }

... and change line 49 (in the 'menu' class section) from:

  z-index : 1;

... to:

  z-index : 9999;

My own tests with your gallery files show that this should work fine.

I'm glad you've been able to resolve your problem.
Thanks for posting back to let me know.

I'm glad that you have found a solution to your problem.
However, please be aware that shifting gallery elements via CSS can sometimes have unexpected results.
Juicebox will not be aware of such modifications and will expect the gallery elements to be elsewhere. This can sometimes cause problems when resizing a gallery window or when an animation or transition is carried out of the elements which have been shifted.

When using thumbsPosition="TOP", the thumbnail area will be above the main image area. Because your column of thumbnails extends beyond the height of the browser window, the main image will be outside the browser window (the top of the main image will be below the last thumbnail in your column) and will never be visible.
Using thumbsPosition="LEFT" instead (or reducing maxThumbRows from 100 to something much smaller) should hopefully be a suitable solution.

Juicebox determines the actual number of thumbnails displayed on the page depending on the size of the thumbnails and the amount of space available within the gallery. You can set only the maximum number of columns and rows using the maxThumbColumns and maxThumbRows configuration options respectively

This certainly sounds like a bug but I have been unable to replicate it in a test gallery of my own (using Juicebox-Pro v1.4.2).
First of all, please ensure that you are using the current version of Juicebox-Pro (v1.4.2) to ensure that any bugs which were present in previous versions but which have since been fixed are not contributing to your problem.
If necessary, instructions to download the current version and upgrade existing galleries can be found on the Upgrading Juicebox support page.
Also, please try using the stock 'jbcore' folder (with no modifications) and display the gallery on a page of its own to see if any custom CSS code is conflicting with the gallery and causing the problem.
If the problem persists, then please post the URL to your gallery so that I can take a look and investigate further. Thank you.