Part Four - Colorboxification
I feel like the last part was fairly lax on subtitles, so let me take this opportunity to subtitle like crazy, yo!
What are we doing tonight, B
In this part, we'll add some Colorbox to our gallery. Colorboxing is a lot like regular boxing, but with colours. Go ahead and download the latest version of colorbox using the colorbox link two sentences ago. I'll give you a minute. While it's downloading, feel free to peruse the Colorbox website to learn you some Colorboxin' syntax and whatnot.
Okay, done? Good. Open that zip file up like a boss and extract these files like so:
Move : /example1/colorbox.css
Adding colorbox to your template
Open up your templates
header.php and look for the following line:
Create a new line after that and paste this code in:
Now open up your
footer.php and in-between
<?php wp_footer(); ?> and
</body> add the following line:
The first line there includes jQuery. Some would say jQuery is fairly essential to actually using jQuery. Personally I would agree. The second line there includes the .js file we downloaded and extracted earlier. Lines 3-7 creates a the standard "I'm firin' my jqueries" function that waits for the page to load before executing your code. All the code you create goes inside this function, where that comment is.
Writing some jQuery
See that snappy comment in there? Delete that. Or leave it in if you like. You know. Whatever.
Inside that function write in the following code. Or just paste it in if you're not feeling up to some manual typing.
So now the whole code inside the script tag should look like this:
Try it out! Did it work? Ooh yeah.
Now that's looking good!
That was easy wasn't it? Let's try something a little harder. Let's create a custom homepage with a slider feature that shows your latest images! Hit the links below, you monster.
I think I said colorbox so much in that post I now have no comprehension of the word.