1. download the plugin and the javascript NP_photolog.zip
Just download the plugin =P
2. Unpack the zip, put the plugin in the plugins directory and the javascript in the nucleus javascript directory
I just usually unzip it in my plugin directory
3. Within Nucleus Install the plugin
Nucleous has an "Install Plugin" feature, so have Nuc install it ^^
4. Edit the options. There are many, see below for an explanation
Ummm...just edit it for your custom site >>
5. On the skin-itempage where you will include the image slideshow, make the following additions:
include this in your header (change the directory to suit your installation):
<script type="text/javascript" src="/nucleus/javascript/photolog.js"></script>
include a reference to the slide item (in its special template), wherever on the skin you want the slide:
<%item(slideshow)%>
and include this javascript in the body, somewhere AFTER the call to the item call <%item(mytemplate)%>:
<SCRIPT type="text/javascript">
<!--
if (document.images) {
// Tell the slideshow which image to update
SLIDES.set_image(document.images.SLIDESIMG);
// Uncomment the following line if you want the slideshow to start automatically
// SLIDES.play();
}
//-->
</SCRIPT>
You need to put that inside your page as it explains so that the slideshow will actually appear on your page.
1. Put the plugin call in the Item Body section of a dedicated template file: <%photolog%>
Put that piece of code into the item body [CPanel file manager for this and the other coding! Edit the files directly]
2. Edit a css file to include the four DIVs used by the photolog. Ive included a sample css file, with this explanation:
NOTE: the plugin outputs DIVs for only four parts of the show:
.slide (the actual image)
.controltext (the box where the controls go)
.controlleft (the start stop prev next controls)
.controlright (the 1.2.3... numbers (or images) to select individual images
these two are optional, can be included in your skin
.phototitle (a title of the photo: actually, the 'body' text of your [[blog]]
.pleasewait (a little note to appear underneath the photos until the first loads)
You need to make files that are listed above
1. Create a directory dedicated to your photologs. each blog will be a separate subdirectory. Photos should be numbered 1.xxx, 2.xxx etc.
Create a directory for you photologs, and each blog will be able to upload their images [I think x.x;;]
2. Create your new blog. It should use the skin youve edited above. Each blog TITLE should be the name of a subdirectory in the photolog directory. You can do what you want with the body and extended body sections.
Exactly what it says
Explanation
Called from the template, the plugin decends into /photologdir/itemtitle/ (photolog is set in the plugin settings). It counts the number of files (all must be images, at this point), and outputs two things:
1. The actual image, within <div class=slide>, showing, first, image 1.xxx (where xxx is your chosen image extension).
2. A control box. The box is formatted like this. Variables correspond to the plugin option settings.
<!-- ==== the slideshow control box ==== -->
<div class="controltext">
<span class="controlleft">
<A HREF="javascript

LIDES.next();SLIDES.play()"
TITLE="$startphrase">$startword</A>$betweencontrol
<A HREF="javascript

LIDES.pause()"
TITLE="$stopphrase">
$stopword</A>$betweencontrol
<A HREF="javascript

LIDES.previous()"
TITLE="$prevphrase">
$prevword</A>$betweencontrol
<A HREF="javascript

LIDES.next()"
TITLE="$nextphrase">
$nextword</A></span>
<span class="controlright">
<a href=\"javascript

LIDES.goto_slide(1)" $prenum1$postnum </a>$betweennum </a>
<a href=\"javascript

LIDES.goto_slide(2)" $prenum2$postnum </a>$betweennum </a>
<a href=\"javascript

LIDES.goto_slide(3)" $prenum3$postnum </a>$betweennum </a>
[...and so on with the numbers]
</span>
</div>
To see an example (dated and now without a good CSS file, but you see the numbers and colons), go to Unglued-photolog. NOTE THAT on my current web pages new skin. Ive altered the script and taken out the individual slide links.
let me know at unglued if you have any problems!
I don't think I did a very good job explaining...but I hope that helped a bit v.v;;