HDR stands for ‘High Dynamic Range’. In basic terms this means taking the best exposed elements from a scene using various length exposure shots from your camera and combining them during post-processing. Your eye can cope with extremes of exposure that a camera sensor cannot, so a single photograph will often contain areas of bright light or dark shadow that show no detail. This process allows us to see those details.

For example, taking a photograph of a window from inside a building will either:-

1. Show what is inside clearly but over-expose the exterior leaving a white square where the window is or…

2. It will show the exterior clearly and the details of the room will be a black silhouette.

If we take two different exposures of the same scene, one long and one short we can gather all of the information we need:

This longer exposure show us the details on the window sill but the sky is just a white glare.

Whereas the shorter exposure gives us the view outside but leaves everything inside black.

If we place the two images over each other in Photoshop (using auto-align if necessary) and then create a mask of the second, using a black brush we can mask the unwanted areas as follows:

This mask can be created with selecting areas and filling or with a more detailed brush (with white showing everything and black showing nothing). As you become used to the process the masking can become more complicated and varied, showing different degrees of each picture using different tones of grey on the mask.

The final image can then be touched up with various adjustments or filters until the required look is achieved. In this case I combined the two layers into another single layer. I then opened it in the Topaz Adjust plugin, slightly over saturated the colour and enhanced the detail and then placed it over the original layers and took the opacity down until I liked the final levels.

This shows the layers visible before saving.

The final result was this:

Of course a lot more detail would be visible if I washed the windows more often…

HDR images can be achieved in many ways. Simple masking and editing of two images or the combination of multiple images using software such as Photomatix or Photoshop. There are some very excellent tutorials for these to be found at farbspiel and stuckincustoms.

http://www.youtube.com/watch?v=ym_-k3cf0VM;

instead of…

http://www.youtube.com/watch?v=ym_-k3cf0VM

The following code can be placed anywhere in your php to call data entered in the custom field section of your post/page editing area. For example you could place it within your ‘head’ tags to include keywords for SEO.

The function name I’ve called ‘customfunction’ (can be anything unique). In the dashboard I’ve used ‘custom_field as the ‘key’ or ‘name’…

<?php $customfunction = get_post_meta($post->ID, 'custom_field', true); ?>
<?php  if ($customfunction != "") { ?>
<?php echo $customfunction ?>
<?php } ?>

and the value is what ever you want include. For example…

<meta name="keywords" content="Penfold, wordpress, very, handsome, boffin, surfer">

This isn’t limited to the header, it can be used to call anything to any part of your site on an individual post or page. Such as sidebars or widgets…

You may want to do something slightly more drastic that involves an entirely new stylesheet. This is very simple to achieve by placing an addition to the metadata in your post in the custom field area of your editing page.

In the key field use a name for your action (in my case ‘custom_style’)

In the value field place the url of your new stylesheet ie http://yourdomain/stylesheets/custom.css

Don’t forget to place your images folder next to your new stylesheet.

Then place the following code in header.php below your existing stylesheet call.

<?php $customcss = get_post_meta($post->ID, 'custom_style', true); ?>
<?php  if ($customcss != "") { ?>
 <link href="<?php echo $customcss ?>" rel="stylesheet" type="text/css" />
<?php } ?>

Sorted. I’ve done exactly this for this post. In this case all I’ve done is change the background image and colours but you can do anything you like…

Simply place the following code into your single.php or page.php after the loop and suddenly you will be smothered with facebooky likedness all over your readers walls…

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php the_permalink();?>&amp;layout=standard&amp;show-faces=false&amp;width=249&amp;action=like&amp;colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:25px"></iframe>

If you’re not using WordPress replace the following code with the url of the page you are linking to…

<?php the_permalink();?>

Feel free to like this post. Spread the like…

Copy and paste page.php into a text editor and place the following code into the top. This will ensure that ‘yourpagename’ will appear in the list of templates in your page creation/editing form for you to choose. Then save as that name and place back in the theme directory that you are using…

<?php
/*
Template Name: yourpagename
*/
?>
~

Then place the following code wherever you want the list of excerpts to appear – normally below the loop that is already there. This will create another loop that will show 5 posts in the category ‘news’ with a title ‘my latest news’. Please edit any of these to suit your needs.
If you want all types of posts to show leave out category_name=news&

<h3>My latest posts</h3>
<?php $temp_query = $wp_query; ?>
<?php query_posts('category_name=news&showposts=5'); ?>
<?php while (have_posts()) : the_post(); ?>
  <div class="post" id="post-<?php the_ID(); ?>">
    <h3><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h3>
    <?php the_excerpt(); ?>
  </div>
<?php endwhile; ?>

You can add as much or as little to the loop as you like in the way of text or php calls. It can be wrapped in a styling class and have a border, background or different fonts etc But that’s a whole other story called CSS and quite frankly my day just isn’t long enough to get into that right now…

Placing an image in Facebook is, as is usual with Facebook, a somewhat convoluted process (again) – but if you follow the steps methodically it should go smoothly. Maybe…

First you need to add the application static FBML to your Facebook page. Go to their page and click ‘add to page’.
To use this app click ‘edit page’ (under main photo when signed in as admin) then ‘edit’ in the FBML application box. You can then create or edit your ‘boxes’.
The app will allow you to include html into Facebook ‘boxes’. These boxes will appear in a tab marked ‘boxes’ on your main page. This will enable you to bring images, links and text from your server and place them in that box – if you have CSS in your repertoire you can even style them from a CSS file hosted on your server. This is very useful if want to create a custom landing page for your fans.
You can then click on the mini pencil icon and then click ‘add to sidebar’ – this will place that box in your pages sidebar. Please note that an image with a width of 180px will fit best.
To add a basic graphic image to your facebook sidebar do as follows:

Create a box in FBML with the following html:

<img src="http://www.YOUR_DOMAIN.com/images/IMAGE_NAME" border="0" align="left">

where the URL is where you’ve hosted your image.

The result should look similar to the sidebar on the following page facebook.papersurfer.com.

If you like books, surfing or books about surfing then please feel free to become a fan…

First you need to add the application static FBML to your Facebook page. Go to their page and click ‘add to page’.
To use this app click ‘edit page’ (under main photo when signed in as admin) then ‘edit’ in the FBML application box. You can then create or edit your ‘boxes’.
The app will allow you to include html into Facebook ‘boxes’. These boxes will appear in a tab marked ‘boxes’ on your main page. This will enable you to bring images, links and text from your server and place them in that box – if you have CSS in your repertoire you can even style them from a CSS file hosted on your server. This is very useful if want to create a custom landing page for your fans.
You can then click on the mini pencil icon and then click ‘add to sidebar’ – this will place that box in your pages sidebar. Please note that an image of 180px will fit best.
To create an Add Photo button do as follows:

Create a box in FBML with the following html:

<a href="http://www.facebook.com/photoselect.php?oid=YOUR_FACEBOOK_PAGE_ID"><img src="http://www.YOUR_DOMAIN.com/images/IMAGE_NAME" border="0" align="left"></a>

where YOUR_FACEBOOK_PAGE_ID is the long number at the end of your page’s URL and the image source is where you’ve hosted your button’s image.

The result should look similar to this:

which you can see on the following page facebook.papersurfer.com.

Please note that this button will only work if you are signed in as a fan NOT as the administrator.

Please feel free to use the image above (preferably hosted on your server).

If you like funky house music then please feel free to become a fan…

This assumes you already have widgets enabled and multiple sidebars set up (if you don’t, then report back for a more in depth tutorial in a few weeks). It also assumes you are happy to root around in the basic php files from your blog…

There are several logical ways of setting this up but for me, the easiest is to place a php call for a specific sidebar in your page.php file as follows:

I want to create a sidebar no.2 on a page called dave (ie www.yourblog/dave)

First: create the definitions for sidebar no.2 in a file called sidebar2.php (this will also allow you to specifically style sidebar2 in your CSS later) and place it in your themes directory (ie www.yourblog/wp-content/themes/sidebar2.php).

<div id="sidebar">
   <div id="sidebar2">
     <?php if ( !function_exists('dynamic_sidebar')
      || !dynamic_sidebar(2) ) : ?>
     <?php endif; ?>
   </div>
</div>

then you can place a call for that specific sidebar from your page.php, making sure that it will only show up on the page called ‘dave’

<?php if (is_page('dave')) get_sidebar2(); ?>

Then place the required widgets in sidebar no.2 from your dashboard. If you repeat this process for specific sidebars and pages this will enable you to place dynamic content all over your site.

(You may need to adjust margins for the text depending on your font size/style and line heights)