Create a page template file

So let’s start with our new page template: Create a file named tpl.yapb.mosaic.php in your current theme folder.

Throw in some WP Metadata

As a first step we define a standard PHP comment at top with meta data so WordPress can identify this file as template:

<?php /* Template Name: YAPB Photo Mosaic Page (Prototype) */ ?>

Create some infrastructure

Now some default infrastructure for WP templates like calling the header, starting the WP loop, displaying the page title and content:

<?php
  get_header(); ?>
  <!-- Let's start the WordPress loop -->
  <?php if (have_posts()): while (have_posts()): the_post(); ?>
    <?php global $post; ?>
    <div class="post">
      <h1><a href="<?php echo get_permalink() ?>"><?php the_title(); ?></a></h1>
      <?php the_content('read more...'); ?>

Define what you want

To display the thumbnails of all our photos, we need to know what we want to fetch exactly. In my case, i assign each photoblog post to a special category “photoblog”. That category is configured in YAPB – so i can ask for it’s id and get all (or at least the last 1000) posts of that category with a simple WordPress function. Additionally i use this php part to define the format of the thumbnails i want to display on this page:

<?php
  // Let's get the last 1000 photoblog entries
  $photoblog_posts = get_posts( 'category=' . get_option('yapb_default_post_category') . '&numberposts=1000' );
  // Let's define the needed thumbnail format
  $thumbConfig = array( 'h=80', 'q=100', 'fltr[]=usm|60|0.5|3' );
?>

Loop through the fetched posts

Since we should have all needed posts now, we simply cycle through all of them, get the image and display the thumbnails. In this sample i use a unordered list as structure for the images:

<ul>
  <?php foreach($photoblog_posts as $photoblog_post): ?>
    <?php if (!is_null($image = YapbImage::getInstanceFromDb($photoblog_post->ID))): ?>
      <li><a title="<?php echo $photoblog_post->post_title ?>" href="<?php echo get_permalink($photoblog_post->ID) ?>"><img src="<?php echo $image->getThumbnailHref($thumbConfig) ?>" width="<?php echo $image->getThumbnailWidth($thumbConfig) ?>" height="<?php echo $image->getThumbnailHeight($thumbConfig) ?>" alt="<?php echo $photoblog_post->post_title ?>" /></a></li>
    <?php endif ?>
  <?php endforeach ?>
</ul>

Close the previously created infrastructure

To cleanly finalize the page template we now close the previously opened WordPress loop and call the footer.

<?php endwhile; endif; ?><!-- end of the WP loop -->
<?php get_footer(); ?>

The complete file may be found in this .zip file (275 KB).

Finally just use the new page template

To use the page template, just go to your admin panel, write a new page and choose your newly created page template – Voila: You have your first YAPB mosaic page!

“nothing is stopping you from hacking WordPress to function as a photoblog”

What’s wrong with this sentence?

I just don’t like the word “hacking” in that context (arg!)

Hacking is the way of the spaghetti code ninja to extend a cms via manipulating the base code of the cms to achieve what he wants in a more or less small ammount of time. But if the cms gets updated, he has to apply all those changes a second time. Since cms’s get updated regulary (security updates), that can bunch up to a serious pile of work over time. Since the cms owner is stuck to the hacking codeninja he is also stuck to the last known hacked cms version even if it has serious security flaws.

Extending via a plugin on the other side is the way of the brave software developer (If the cms supports this). He examins the system to be extended in a very carefully way, sees all those provided hooks and programs the plugin. This way the cms user may update his cms installation whenever he wants/has to and has a pretty high chance the plugin will work afterwards. Until the cms internal hooks and dependecies stay compatible the owner may apply several updates until the plugin developer has to react on cms changes.

YAPB is a plugin and not a hack – So it’s extending WordPress ;-)

Harrhh – I’m so relaxed and relieved now. I’m such a monk.

Happy blogging and don’t forget: It’s still BETA and i’d appreciate positive and/or negative feedback very much!

What is Yapb? What can you expect?

• A non invasive WP-plugin that converts wp into a easy useable photoblog system
• Easy image upload – All wordpress post-features can be used
• On the fly thumbnail generation – You can use multiple thumbnail sizes as you need them: Thumbnail generation is now part of the template
• Exif data processing and output

The idea
There aren’t many open source photoblog systems out there in the wild. I searched a long time and found only few. Evaluated all of them and decided to program one on myself, since none of them meet my demands. I did that about three times – Every version was build up from the scratch. Every version was better and more flexible. More cool and finally more proprietary.

Every time i saw a feature in another blog system that i wanted to have – i had to spend much of my rare spare time to design, program and integrate it into my own photoblog system. After impelenting some features i decided that this was a waste of time.

There already was a system having lot’s of features and a huge community: WordPress. Yapb is my try to build on a wide spread platform – And to get what i want – As a photographer and programmer.

Technical spoken
Yapb integrates tightly into wordpress. Via Javascript DOM manipulation it injects several form additions into the standard wordpress post form. It provides additional data and fnctions to themes so that nearly every theme can be converted to a photoblog in virtually no time. Yapb doesn’t touch original wordpress code. You can decide if you want to write a normal WordPress Text-Post or if you want to post an image. etc. etc.

What’s next? Nearly all pics you see on this blog are posted over Yapb. Now it’s only a matter of time that a installable version get’s released.