There are a lot of fine Javascript files (libraries/frameworks) - both for plain Javascript and for jquery on the market, both free and commercials, but they all need to be loaded (installed) into Your Confluence to utilize:
First, All of the stuff below is quite generic and samples only, refer to the documentation.
Second, all the files are considered "foreign" (including symbolic links) during an upgrade and must be reimplemented.
Some lightboxes:
prettyPhoto (Best, and actually free - does not support slide on iOS )
FloatBox (Best, not free for commercial sites)
Flare (Not free)
Slimbox2 (Free, not good on mobile devices)
OrangeBox (Free)
LightView (Free)
See more at http://www.tripwiremagazine.com/2013/06/jquery-lightbox-plugins.html
Install below Confluence
Download the Javascript files/Framework zip, upload it to the server and place the files under the install:
cd /opt/confluence/confluence mkdir mylightbox cd mylightbox mv ~/mylightbox.zip . unzip mylightbox.zip
Somewhere else in the filesystem with symbolic linking
Along the way, I have given up having individual symbolic links pr. library/framework, so now I place all under "confluence-ext-libs"
Download the Javascript files/Framework zip, upload it to the server and place the files under the install:
This requires support for Linking in Tomcat. the server.xml file has to be changed adding the allowedLinked parameter:
<Context path= "" docBase= "../confluence" debug= "0" reloadable= "false" useHttpOnly= "true" allowLinking= "true" > |
Create the filestructure:
cd /data mkdir confluence-ext-libs mkdir mylightbox cd mylightbox mv ~/mylightbox.zip . unzip mylightbox.zip
Link under Confluence (only needed once)
ln -s /data/confluence-ext-libs /opt/confluence/confluence/confluence-ext-libs
The Common Part
Now these can be referenced as /opt/confluence/confluence in the server root, so in Custom HTML (header part) add:
<!-- MyLightbox --> <link rel="stylesheet" href="/confluence-ext-libs/mylightbox/css/mylightbox.css" type="text/css" media="screen" charset="utf-8" /> <script src="/confluence-ext-libs/mylightbox/js/jquery.mylightbox.js" type="text/javascript" charset="utf-8"></script>
Some lighboxes requires to be initiated (the Jquery reference $ is AJS.$ for Confluence):
<script type="text/javascript" charset="utf-8"> AJS.$(document).ready(function(){ AjS.$("a[rel^='mylightbox']").mylightbox(); }); </script>