How to add a caption to featured images

Featured images are awesome and if you’ve ever wanted to add an image above the title of your post, using a feature images is the way to go.

When adding images in your posts or pages, adding a caption is easy, but if you’ve tried to do the same with featured images, then you’re out of luck. This is problematic if you want to use images from the Creative Commons where a photo credit is requested.

Faced with this problem this morning I did a quick google search and found the following answer on Stack Overflow.

Easy peasy once this snippet of code is added to your functions.php

function the_post_thumbnail_caption() {
  global $post;

  $thumbnail_id    = get_post_thumbnail_id($post->ID);
  $thumbnail_image = get_posts(array('p' => $thumbnail_id, 'post_type' => 'attachment'));

  if ($thumbnail_image && isset($thumbnail_image[0])) {
    echo '<p class="caption">'.$thumbnail_image[0]->post_excerpt.'</p>';

Then use the following in your single.php.

<?php if ( has_post_thumbnail() ) : 
  the_post_thumbnail( 'feature' );
endif; ?>

And Voila!

WTFPL Photos to use for Free

Theme developers and web designers often need photos to work with as placeholder. Place Kitten is a fantastic resource, but sometimes you may want something other than a kitten. Finding the right photo can be tricky, since there are so many licences, rules and regulations. Of course the easiest way to get photos is to just go out and shoot your own… I’ve been snapping pics for a few years now and I’ve amassed a large set of them on Flickr.

Today, I created a new set and decided to share them under the WTFPL. This license is pretty permissive and allows you to take any of these and just do whatever you want with them. So go ahead, help yourself.

Giving back by providing support

One of the ways to learn more about your craft is to help others. For this reason, I’ve been teaching WordPress theming for a number of years and I’ve contributed on the WordPress support forums a bit. Everyone involved on the support forums is a volunteer and although I haven’t asked all of them why they do it, I’m guessing the reason they do it is like mine, I love it.

cyberchimpsI got addicted to the forums 6 years ago and I’ve contributed in spurts. Some weeks are super active, while other weeks simply leave me no time. Some of you may have noticed that, as of late, I’ve been absent from the forums. The reason for that, is that I was recruited to work on the Cyberchimps forums. I’ve been working with the other “chimps” for a few weeks now and even got my first pay check. I felt a wee bit guilty when the money landed in my Paypal account. Here I was getting paid for doing something I used to do for free!

The purpose of helping on forums is to help others, but also you learn a great deal from troubleshooting. With the wage that I got from Cyberchimps, I thought how I could help even more? I always find looking through the loan requests on Kiva humbling. It’s amazing how such small amounts (for me) can change lives. Last month I lent money to Nalini, allowing her to buy a sewing machine. It’s a small gesture, but if I can provide some CSS guidance to someone on one side of the globe and help someone financially on the other, I feel better about our future.

I plan on continuing this process every month and look forward to seeing who else I get to help out.

Design research done simply with

Ever visited a site and wondered what font is being use or what shade of green that is?

In the old days (i.e. last year) I would make a screenshot of the web page and then inspected the colours in Photoshop. But that was only good for colours and didn’t give any info about the typeface.

A few months ago I discovered the what font bookmarklet and I’ve used it countless of times. It works really well and even gives me info about the font foundry should I wish to purchase the font.

I mark a lot of tweets as favorites as a way to read them later and today discovered a tool which I think may become my favourite resource of all time. is a fantastic resource for designer.

Simply type in the url of the website you like and you can find all the hex values, typeface used as well as size and line-height as well as image dimension. This tool is so simple, yet allows designers to get a rough style guide without having to dig around the source code. Fantastic.

Easier conditionals with mobble

A few weeks ago, I was working on a site that had the busiest footer. The footer design made sense on a large screen, but I couldn’t wrap my head around how to make it look great on tablets and phones. I was looking for a way to extend beyond media queries and apply a different design per platform, not just breakpoints. That’s when I discovered mobble.

Mobble is a handy WordPress plugin that provides conditional functions for detecting a variety of mobile devices and tablets.

Once installed, mobble allows you to add conditional statement to your theme templates such as:

if ( is_mobile() ) {
  get_template_part( 'foot-mobile' );
} elseif ( is_tablet() ) {
  get_template_part( 'foot-tablet' );
} else {
  get_template_part( 'foot-desktop' );

Now all I had to do was create different templates for each type of footer. This is so much better than having to fight with media queries.

Some of you will undoubtedly say, that you don’t need a plugin for that. But if your PHP knowledge is limited like mine, this plugin is fantastic!

UPDATE: As noted below in Alex’s comment, if you are using Jetpack, you can also use it’s built in function and target specific devices.

WordCamp Vancouver: Put some shine in your back-end

Coming up with titles for WordCamp talks is always tricky. I’m not proud of this latest one, but it did garnered a few fans and thus was stuck with it.

My WordCamp Vancouver talk this year is about looking at ways pages can be designed slightly differently. During the presentation we’ll be looking at using shortcodes, widgets, include pages, looping through pages and advanced custom fields.

Here is the link to my slides:

Happy Summer

raised eyebrowWith the arrival of the sun in Vancouver, and another speaking engagement under my belt, it’s time to for a quick update on what’s happening at Bluelime Media.

My big news is that I have taken a three month full-time contract at Raised Eyebrow Web Studio. They are a great bunch of people and I look forward to learning a lot from them. What this means, of course, is that I’ll have less time available for maintenance of existing sites and for new clients. If there is work needing done, I’ll be able to help but my response times will be slower than you might be used to.

This will be an excellent new challenge for me and help to hone my WordPress skills while adding additional depth in Drupal. If you have any questions or if I can suggest another developer to help you out, feel free to drop me a line. You may also want to bookmark the list of developers I currently recommend.

Get your tickets to WordCamp Vancouver

wc-vancouver-2013-logoWordCamp organizers, Joey, Jill and Flynn are super excited to announce that WordCamp Vancouver is back for another edition and that tickets are now on sale. WordCamp Vancouver 2013 will be on Saturday August 17th, at the BCIT Downtown Campus.

Tickets are only $20 and the venue is fabulous, so there’s no excuse. If you’ve ever wanted to attend WordCamp, this is it. The final list of speakers will be announced next week. This conference is the perfect opportunity for developers to come and mingle with others as well as brand new bloggers/website manager/marketers/website owners and non developers who want to ask questions and learn something new.

Hope to see you there!

Become a Better Developer by Contributing to WordPress

I owe much of my career to WordPress and it’s use of use. However, none of it would have been possible without the community. Contributing to WordPress is a great way to become better with WordPress as a developer, designer, teacher, writer… there are contributing opportunities for everyone.

During my talk at WordCamp Ottawa I’ll be sharing info on how you can get started.

In the meantime, here are my slides for the presentation: