Flickr Photo Album Review, Solved Major Web 2.0 Theme Issues with Plug-In

Warning: Illegal string offset 'wp_pinterest_pin_it_button_layout' in /home/jingles/public_html/wp-content/plugins/wp-pinterest/includes/functions.php on line 186

Warning: Illegal string offset 'wp_pinterest_pin_it_button_single_display' in /home/jingles/public_html/wp-content/plugins/wp-pinterest/includes/functions.php on line 187

Warning: Illegal string offset 'wp_pinterest_pin_it_button_page_display' in /home/jingles/public_html/wp-content/plugins/wp-pinterest/includes/functions.php on line 188

Warning: Illegal string offset 'wp_pinterest_pin_it_button_excerpt_display' in /home/jingles/public_html/wp-content/plugins/wp-pinterest/includes/functions.php on line 189

Warning: Illegal string offset 'wp_pinterest_username' in /home/jingles/public_html/wp-content/plugins/wp-pinterest/includes/functions.php on line 206

Warning: Illegal string offset 'wp_pinterest_follow_button_layout' in /home/jingles/public_html/wp-content/plugins/wp-pinterest/includes/functions.php on line 207

Warning: Illegal string offset 'wp_pinterest_follow_button_single_display' in /home/jingles/public_html/wp-content/plugins/wp-pinterest/includes/functions.php on line 208

Warning: Illegal string offset 'wp_pinterest_follow_button_page_display' in /home/jingles/public_html/wp-content/plugins/wp-pinterest/includes/functions.php on line 209

Warning: Illegal string offset 'wp_pinterest_follow_button_excerpt_display' in /home/jingles/public_html/wp-content/plugins/wp-pinterest/includes/functions.php on line 210

As you know, I use Word Press for my blog. As many developers do, I also feel it among the best blog suites out in the market – especially as open source freeware. One of the major pluses to it or any software is its plug-ins. Word Press developers love to make them and there are literally millions of them. One major project of my blog was to make a photo album section, so as always I spent about 2 or 3 days doing some major research on the topic and I have found what I think is a home run for your Word Press Blog. However as always I ran into some issues with customizing it with my theme, a problem I have scene with numerous other Word Press blogs who use the Web 2.0 Theme. Rest assured though I fixed those problems too.

The Flickr Photo Album Plug-In ( Tan Tan Noodles ), is a great plug-in for Word Press. However before I even talk about the plug-in, I have to talk about the step before it. I needed to decide if using my own server or a third party service to host my pictures. Doing my research I feel in love with the Web 2.0 phenomenon of Flickr. With this suite you can not only manage your photos, but the Web 2.0 technologies are endless. You can comment on pictures, join picture discussion groups, map your photos on maps, add tags to your photos (a web 2.0 staple) and so on. This is a great site and I highly recommend it for your online photo album. It is a great and easy way to organize your photos into albums and share with your friends/ family. So with that said it came time to decide what plug-in to use to integrate my albums into Word Press. I quickly went through the list getting very disappointed not to find anyone that would work. Finally I found two great possibilities FAlbum and Flickr Photo Album. After working with both though, I really liked and felt comfortable and decided to go with the latter. It offered easy integration of your Flickr photos right into your blog post and a great looking photo page that included your photo albums and tags associated with them.

So I setup the plug-in and followed the instructions in how to move the required files from the plug-in into your theme in order to customize the album into your theme:

  1. Copy preview.php and rename it to photos.php and place it into your current theme directory.
  2. Copy all html files starting with photoalbum- into this same directory. These are the template files you will be working with.
  3. Modify the HTML and CSS in the template files to fit your own site. All the CSS is located in photoalbum-header.html.

Then I crossed my fingers and took a look with disappointment. Everything worked great except it did not like my theme at all. Anytime I used the php call to get the side bar the background would not drop down to the bottom and the side bar would be pushed to the bottom. So then took my three day commitment to fix it and boy what a time it was. So if you use the Web 2.0 WP Theme with the Flickr Photo Album here is your answers….

The first thing I knew was it had to do with something in the side bar since it rendered fine without it. So I picked the entire side bar apart with no avail, great I knew it would be one of those small hidden issues. So I decided to actually paste in the entire side bar code into the photos page to see if I can find the issue by deleting sections of it at a time to find the problem. A home run because I did indeed find the primary issue with the side bar. Of course the problem had to be something as simple as a misplaced close tag for the wrapper div of the theme. This explained to me why the background would not drop to the bottom and why the side bar would fall below the albums.

The issue was that I organized the div close tags improperly causing the plug-in to fail in the web 2.0 theme. So here is what I did by mistake:

// Get the universal header of the photo album.
<?php get_header();?>
// I inserted these two div from my theme to integrate the plug in into the theme.
<div id="wp-content">
<div id="wp-content-pri">
// The following is the photo album coding.
<div id="content" class="narrowcolumn">
*** Photo Album PHP Calls ***
// Closes the content div that surrounds the photo album.
// I inserted in order to close the wp-content-pri div which is the main column containing the photo album.
// HERE IS THE ERROR. I inserted in order to close the wp-content div which is suppose to be the wrapper for the entire main area which includes both the sidebar and photo album. SO REMOVE THIS div close tag.
// This call for the side bar already has the end tag for the wp-content. PROBLEM SOLVED!

So thats it, you pretty much have to make sure you dont close the wp-content div, because it is already closed in the side bar. A pretty simple fix for a common issue with the web 2.0 theme and this plug-in. So other than that, she works like a charm! Enjoy the photos…