Already Available Plugins

XP Uploader

Historically the first available third-party extension to YAPB: Developed by Joost, it allows you to upload images directly over the Windows XP File Explorer.

Download the plugin from
the WordPress Plugin repository

YAPB Sidebar Widget

Previously included in the default YAPB installation, the YAPB sidebar widget was outsourced since version 1.9 and has become a plugin of it’s own. Of course, it evolved a little bit and now offers you the following functionality: Either show a list of your prevously posted images or just output some random images. Additionally you now may display a link to your mosiac page below the widget.

Download the plugin from
the WordPress Plugin repository

YAPB XMLRPC Server

Originally provided by Mac, the YAPB XMLRPC Server Plugin allows remote access to your photoblog. You define an API key and voila: Your images are accessible via XML RPC. If you don’t know how to do that: Just have a look at the YAPB XMLRPC Sidebar Widget

Download the plugin from
the WordPress Plugin repository

Developing your own YAPB Plugin

Ah, finally - The interesting part for us developers Read this little introduction and have a look at the code of the yapb-sidebar-widget for example, and you should know how to develop YAPB plugins. It’s no rocket science.

Why YAPB Plugins?

First of all: Why splitting YAPB into a main part + plugins? Imho, separating blocks of functionality helps YAPB stay clean, “small” (whatever that means) and helps YAPB keeping focused on its primary target: Extend WordPress to become a cool photoblog platform.

Secondly, separate plugins may be developed and evolved separately without any coupling to the main YAPB release cycle. Developers may now create additional features without “asking me for permission” or whatever - just go and do it

It’s simple

Writing a YAPB-Plugin is basically the same thing as writing a WordPress Plugin - It’s just a matter of view: We develop additional functionality built onto the YAPB foundation:

YAPB basicly offers you the “yapb_register_plugin” action-hook, which gets called right after YAPB initialization. Additionally, your function gets called with the current YAPB Class Instance as parameter: It’s a simple as that:

function my_cool_plugin_initialization($yapb) {
  // hook into WordPress,
  // add some options to YAPB and
  // finally do what you want
}

add_action('yapb_register_plugin', 'my_cool_plugin_initialization');

Have a look at the YAPB Sidebar Widget Plugin for more handy sample code.

The ultimate YAPB Hook Reference

YAPB offers some hooks out of the box. If you’re interested in developing your own YAPB Extension you should have a look at this list:

yapb_register_plugin

Source: Yapb.class.php
Since: 1.9

yapb_register_thumbnail gets fired from YAPB after all plugins were loaded. That means you can execute code right after YAPB was initialized - And you get the YAPB Instance as Parameter. This hook is an action which means that it primarily acts as an event trigger, instead of a content filter.

yapb_get_thumbnail

Source: YapbTemplateFunctions.php

yapb_get_thumbnail gets fired just before the image tag gets returned from the yapb_get_thumbnail() template function. This hook is a filter which means that information is passed through it, and then used by WordPress.

yapb_get_exif

Source: YapbTemplateFunctions.php

yapb_get_exif gets fired just before the EXIF tags array gets returned from the yapb_get_exif() template function. This hook is a filter which means that information is passed through it, and then used by WordPress.

yapb_alternative_image_formats

Source: YapbTemplateFunctions.php

yapb_alternative_image_formats gets fired just before the list of alternative image formats get returned by the according template function. This hook is a filter which means that information is passed through it, and then used by WordPress.

damn_i_need_a_new_hook

If you need a hook in YAPB to develop something new: Leave me a note in the forum so we can discuss it. But hey: I’m the last one blocking new features. As long as it’s not disturbing the way YAPB works, i’m with you.

yapb_is_photoblog_post

Function returns wheter this post is a photoblog post or not.

Parameters

No Parameters

Returns

boolean (true|false) if this post is a YAPB post with attached image.

Sample usage:

<?php if (yapb_is_photoblog_post()): ?>HOHOHO<?php endif ?>

yapb_get_image

Function returns an image tag according to the given parameters

Parameters:

1. string $before HTML to be rendered before the image
2. array $parameters Additional IMG Attributes except src, width and height
3. string $after HTML to be rendered after the image

Returns

a string containing the image tag

Sample Usage:

<?php echo yapb_get_image('<div>', array('alt' => 'This is an image'), '</div>'); ?>

yapb_image

Same as yapb_get_image (See above) - It just prints out the result instead of returning it

Parameters:

Same as yapb_get_image

Sample Usage:

<?php yapb_image('<div>', array('alt' => 'This is an image'), '</div>'); ?>

yapb_get_thumbnail

Function returns an thumbnail image tag according to the given parameters

Parameters:

1. string $before HTML to be rendered before the thumbnail
2. array $parameters Additional IMG Attributes except src, width and height
3. string $after HTML to be rendered after the thumbnail
4. array $phpThumbConfiguration The phpThumb configuration
5. string $class Additional CSS Class of the image

Returns

a string containing the image tag

Sample Usage:

 <?php echo yapb_get_thumbnail('<div>', array('alt' => 'This is a thumbnail', 'rel' => 'lightbox'), '</div>', array('w=200', 'q=90'), 'thumbnail'); ?>

As you can see above, this code sample is also an example on how to include the lightbox.js script.

yapb_thumbnail

Same as yapb_get_thumbnail (See above) - It just prints out the result instead of returning it

Parameters:

Same as yapb_get_thumbnail

Sample Usage:

<?php yapb_thumbnail('<div>', array('alt' => 'This is a thumbnail'), '</div>', array('w=200', 'q=90'), 'thumbnail'); ?>

yapb_get_exif

functions returns a list of the exif tokens if available

Parameters:

1. boolean $flagUnfiltered No EXIF-tag filtering if true - Return all EXIF tokens

Returns

assoziative array containing all (filtered) EXIF tokens

Sample Usage:

<?php $theWonderfulExif = yapb_get_exif() ?>

yapb_exif

literally the same as the function above - It just prints out the exif tags and gives you some parameters so you can customize the output.

Parameters:

1. string $liClass CSS class of the li tags
2. string $keyValueSeparator HTML between EXIF key and EXIF value
3. string $htmlBeforeKey HTML to be rendered before the EXIF key
4. string $htmlAfterKey HTML to be rendered after the EXIF key
5. string $htmlBeforeValue HTML to be rendered before the EXIF value
6. string $htmlAfterValue HTML to be rendered after the EXIF value
7. boolean $flagUnfiltered No EXIF-tag filtering if true - Return all EXIF tokens

Sample Usage:

<h3>EXIF</h3><ul><?php yapb_exif('exiftag', ':', '<strong>', '</strong>', '<i>', '</i>') ?></ul>

yapb_get_alternative_image_formats

Returns a listitems with links to alternatively provided image sizes. It will only return image sizes lower or equal that the original uploaded file. The array availableSizes contains should contain a list of all sizes to be provided: The number gets mapped to the longer side of the image.

Parameters:

1. array $availableSizes An array containing all max. sizes to be made available

Returns

string containing some li’s

Sample Usage:

<h3>Alternative Image Formats</h3><ul><?php echo yapb_get_alternative_image_formats(array(1600, 1024, 800, 640, 320)) ?></ul>

yapb_alternative_image_formats

Basicly the same as above - Just prints out the result

Parameters:

Same as above

Sample Usage:

 <h3>Alternative Image Formats</h3><ul><?php yapb_alternative_image_formats(array(1600, 1024, 800, 640, 320)) ?></ul>

Does adapting a theme sounds like rocket science to you? Maybe one of the Ready-to-use-templates meets your taste.

The Basics

YAPB gives the possibility to attach photos/images to your posts and to display them in various formats and styles. This section describes the first essential things you can do in your blogs template. If you decide to adapt your theme manually, don’t forget to turn off the automatic-image-insertion feature on the YAPB Options page.

Do it in the loop

First of all: All those code samples described underneath have to be used in the loop.

Checking for image existance

Since you’re free to post normal Wordpress articles or photoblog entries, there must be a possibility to check wheter the current displayed post is a photoblog post or not - Nothing easier than that:

<?php if (yapb_is_photoblog_post()): ?>
  <!-- This definitly is a YAPB Photoblog post -->
<?php else: ?>
  <!-- No image attached: This is a normal WordPress post -->
<?php endif ?>

Displaying the image

Now we know that we have an image, we want to display it:

<?php if (yapb_is_photoblog_post()): ?>
  <?php yapb_image('', array('alt' => 'My marvelous image'), '') ?>
<?php else: ?>
  ...
<?php endif ?>

For more information on yapb_image() and yapb_get_image() refer to the template functions documentation

Displaying a thumbnail

To one of the interesting parts: thumbnailing. YAPB uses phpThumb, a very stable and mature PHP library, for it’s thumbnailing. YAPB tries to hide all those nasty details and offers you a simple and refreshing template function which does all that resizing, caching and displaying-stuff for you:

<?php if (yapb_is_photoblog_post()): ?>

  <?php

    echo yapb_get_thumbnail(
      '<div>', // HTML before image tag
      array(
        'alt' => 'My marvelous first thumbnail', // image tag alt attribute
        'rel' => 'lightbox'                      // image tag rel attribute
      ),
      '</div>',               // HTML after image tag
      array('w=200', 'q=90'), // phpThumb configuration parameters
      'thumbnail'             // image tag custom css class
    );

  ?>

<?php else: ?>
  ...
<?php endif ?>

Nearly the same as yapb_image() - But with additional phpThumb configuration parameters that define the desired size and css class of your thumbnail image.

Displaying EXIF data

The next cool thing to do is displaying the EXIF data of your image. YAPB does use the easy-to-use library phpExifRW and tries to hide it’s complexity from you as always:

<?php if (yapb_is_photoblog_post()): ?>

  <h3>EXIF</h3>
  <ul>

  <?php

    yapb_exif(
      'li-exif',   // CSS Class for the LIs
      ': ',        // Separator between EXIF token name and value
      '<strong>',  // HTML before EXIF token name
      '</strong>', // HTML after EXIF token name
      '<i>',       // HTML before EXIF token value
      '</i>'       // HTML after EXIF token value
    )

  ?>

  </ul>

<?php else: ?>
  ...
<?php endif ?>

Have a look into the according documentation to see what can be done with this template function.

More advanced stuff

This section won’t only highlight the more complex templating possibilites, but also some general WordPress functionality that may spice up your theme:

Attaining the YAPB-Imageobject directly

Templating functions are cool - Until you need to, let’s say… display the thumbnail of a post not included in the current loop. So there should be a way to get grip on the YAPB Image Object directly to attain full control.

Example: You’re fetching one post out of the DB by using get_next_post() and want to know if it’s a photoblog article:

<?php

  // Use the WP Infrastructure to get the next post

  $theNextPost = get_next_post(); 

  // Check if we've gotten something

  if (!empty($nextPost)) {

    // Yes, we have a next post
    // Let's check if it has an image attached:

    if (!is_null($image = YapbImage::getInstanceFromDb($theNextPost->ID))) {

      // Yes, we have an image
      echo 'Heureka! The next post is a photoblog article.';

    } else {

      // no image ahead
      echo 'Alas! Just a normal WordPress article ahead.';

    }

  }

?>

Thumbnail navigation (previous and next image)

Since we know how to get the image object by hand, we could now use this know-how to create a little “next image, previous image” navigation with thumbnails as links.

I only show the code for the “next post” part - The “previous post” part is basically the same thing with usage of the get_previous_post() function:

<?php

  // Use the WP Infrastructure to get the next post

  $theNextPost = get_next_post(); 

  // Check if we've gotten something

  if (!empty($nextPost)) {

    // Yes, we have a next post
    // Let's check if it has an image attached:

    if (!is_null($image = YapbImage::getInstanceFromDb($theNextPost->ID))) {

      // Yes, we have an image
      // Let's define the thumbnail configuration

      $thumbnailConfiguration = array(
        'w=75', // 75 pixels width
        'h=75', // 75 pixels height
        'zc=1'  // crop the image
      );

      // And output the image tag

      echo '<a href="' . get_permalink($theNextPost->ID) . '">';
      echo '<img ' .
        'border="0" ' .
        'src="' . $image->getThumbnailHref($thumbnailConfiguration) . '" ' .
        'alt="To the next post" ' .
        'width="' . $image->getThumbnailWidth($thumbnailConfiguration) . '" ' .
        'height="' . $image->getThumbnailHeight($thumbnailConfiguration) . '" ' .
        '/>';
      echo '</a>';

    } else {

      // no image - we display a text link
      echo '<a href="' . get_permalink($theNextPost->ID) . '">To the next post</a>';

    }
  }

?>

For more information on the YAPB Image Object, just have a look into the lib/YapbImage.class.php - It should be documented sufficiently.

More to follow

So much for now - If you have ideas and code samples for this page - Leave a comment or post something in the forum - I’ll take a look.

Current version

Yet-Another-Photoblog on WP-Plugins.org for WordPress 2.5 and greater, ZIP-File, hosted on WP-Plugins.org

Older versions

If you’re using an older version of WordPress (please be adviced to update soon) you may download one of the following versions. Please mention that those version are deprecated.

• Yet-Another-Photoblog-beta-1.7.4.zip for WordPress 2.3.2 discontinued, ZIP-File, 714 KB
• Yet-Another-Photoblog-beta-1.5.2.zip for WordPress 2.1.x and 2.2.x discontinued, ZIP-File, 480 KB
• Yet-Another-Photoblog-beta-1.3.1.zip for WordPress 2.0.x discontinued, ZIP-File, 314 KB

Installation

The installation consists of three parts: Upload, setting a directory permission (on unix/linux systems) and activation of the plugin.

Upload the files

1. Unzip the content of the zip-file into an empty directory
2. Upload the yapb-directory directly into the wp-content/plugins folder of your wp-installation

Set a directory permission

Notice: You don’t need this on windows systems (or you have to wrestle with the windows directory permissions).

1. The used open source thumbnailing engine phpThumb needs one directory access for storing its cache files. Set the permission of the directory wp-content/plugins/yet-another-photoblog/cache/ to 777.

Activate the plugin

1. Go to admin panel / plugins and activate it
2. Enjoy!

Contribute

Support YAPB

Do you like YAPB? Do you use it regulary to show your photos or images? Did YAPB save you time? Or you just want to give something back for the time spent to create, maintain and support YAPB? Just Donate a little ammount so i may buy a good book, DVD, etc. or just pay some server traffic. Bigger ammounts (if any) will be invested in my photo equipment of course

Thanks alot from Salzburg!

Set a backlink

Yes - This plugin was released under the GPL and you’re nearly free to do all you want to do.

But i’d be pleased very much to see some backlinks to this site.

This plugin needs a lot of my spare time - So it would be a great sign of respect if you use one of these buttons (or just place a normal href) on your site:

To set a backlink, just download the button of your desire (Or have a look into the included linkback/yapb-buttons.zip) and include a link something like that in your footer.php (Or wherever you want):

[code]
<a href="http://johannes.jarolim.com/yapb" target="_blank"><img src="01a.gif" border="0" /></a>
[/code]

Feedback

Please be so kind to provide positive and/or negative feedback so i can improve this piece of code if necessary.

Since there is definitly some feedback and the pages grow and grow - I suggest you use the yapb-forum to ask questions, maybe help each other, etc.

Beside of creating some themes on my own (just need some time for that), my intention is to publish links to all available YAPB-ready-themes on this page.

YAPB Ready WordPress Themes

Grain

The first released YAPB theme: Grain. A very nice classical photoblog theme with a homepage presenting the latest image. Does have an image-mosaic feature (like my one ). Very straight layout accenting the image and not distracting the visitors eye through graphical tinsel. I do highly recommend it.

• Author: Mac
• Page: http://wp-grain.sourceforge.net/
• Preview: http://www.defx.de/
• Type: Classical photoblog, dark

phT

The second theme i’ve found: The phT Theme from Fran Simó. According to the author it’s a base theme that you can take to develop your own style.

• Author: Fran Simó
• Page: http://pht.inhubi.com/
• Preview: http://justpictures.es/
• Type: Base Theme, dark

Monolit

The third theme in the collection: Monolit from Kim Nørgaard. I do like light and straight themes very much - A pitty it doesn’t support exif. Nevertheless a very nice theme for photographers. Thumbs up!

• Author: Kim Nørgaard
• Page: http://blog.jasen.dk/monolit
• Preview: http://blog.jasen.dk
• Type: Classical photoblog, bright

Reflection

This one will get some attention for sure: Reflection by dave. Pro: Very nice and clear dark theme pimped up with stylish JavaScript reflections. Con: Doesn’t look exactly the same in IE as stated out on daves todo list. Maybe someone out there helping him with that small issue?

• Author: Dave
• Page: http://xyloid.org/projects/reflection/
• Preview: http://photoblog.xyloid.org/
• Type: Classical photoblog, dark

You have a YAPB-Ready-Theme?

Just drop a note to the forum or a comment to this page and i’ll include it in the list.

Happy photoblogging!

What is YAPB / What can you expect?

• A non invasive WordPress-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 - Use multiple thumbnail sizes where and when you need them: Thumbnail generation gets controlled from the template.
• EXIF data processing and output
• Self-learning EXIF filter - Your own cameras tags can be selected to be viewed.
• Full i18n-Support through gnutext mo/po files
• YAPB Plugin Infrastructure for extended functionality
• Ping additional update-service-sites when posting a photoblog entry.
• Nearly every WP-theme can become a photoblog in virtually no time.

You’ll get a photoblog system based on wordpress - Decide if you want to post a normal Wordpress article or a photoblog entry. Be free to use all available extensions / plugins of the WordPress platform

3 Steps to your WordPress Photoblog

Screenshots

The idea

Why another photoblog system?

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 met my demands. I did that about three times - Every version was build up from the scratch. Every version was better and much 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 implementing some features like captcha, ping and trackback, etc. etc. i decided that this was just a waste of time.

There already was a system out there 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.

Why not use services like Flickr, Deviantart, etc. etc. ?

Why hazzle with renting a suitable webhost, installing a photoblog software, configuring the whole stuff, eventually solve problems, searching and installing a cool theme, etc. etc. - If i can have it all (and more) with one click at Flickr, Deviantart, etc. etc. ?

I’m only able to give you a hint on my opinion why i don’t want to host my images on such a service. Fortunately, for the impatient among us, it can be told with only three (and a half) words:

It’s my image.

Post your image on a foreign server and you’ll never be exactly sure what rights you have on your own images until you’re a better laywer than the one hired by your prefered photo community. One nice example: Flickr was sold to Yahoo AFTER they had tens of thousands users and hosted millions of images. If you’re posting images to flickr right now - Do you EXACTLY know, what rights Yahoo currently owns on YOUR images?

If this is perfectly ok for you - Go on and use those communities! After givin away your personal data, you will have an account for free and no hazzle with setting up your own photoblog. There are thousands of users just waiting for you!

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 functions to themes so that nearly every theme can be converted to a photoblog in virtually no time. YAPB doesn’t touch original wordpress code - It’s using it.

Support YAPB

Do you like YAPB? Do you use it regulary to show your photos or images? Did YAPB save you time? Or you just want to give something back for the time spent to create, maintain and support YAPB? Just Donate a little ammount so i may buy a good book, DVD, etc. or just pay some server traffic. Bigger ammounts (if any) will be invested in my photo equipment of course

Thanks alot from Salzburg!

There is a forum

Since there is definitly some feedback and the pages grow and grow - I suggest you use the yapb-forum to ask questions, maybe help each other, etc.