Friendly (blog)

Add post/page name + page parent name to body class

Michelle McGinnis — Mon, 11 Jul 2011 16:17:22 +0000

This will add a page-slug class and a page-parent-slug class to your body tag, along with all the other defaults. Put this in your functions.php file:

function wpprogrammer_post_name_in_body_class( $classes ){
if( is_singular() ) {
     global $post;
     $parent = get_page($post->post_parent);
     array_push( $classes, "{$post->post_type}-{$post->post_name}" );
     array_push( $classes, "{$post->post_type}-parent-{$parent->post_name}" );
     }
return $classes;
}
add_filter( 'body_class', 'wpprogrammer_post_name_in_body_class' );

Also make sure your open body tag looks like this (you can probably find it in header.php):

Many thanks to Utkarsh Kuketri for the original function!

Display WordPress featured image, thumbnail, or YouTube thumb

Michelle McGinnis — Thu, 30 Jun 2011 18:24:22 +0000

Huge thanks to Vladimir Prelovac, who wrote the original function. I use it a ton and have adapted it a bit to check for:

Featured image; then
First image attached to the post; then
The first image inserted in the post; then
The thumbnail of the first YouTube video inserted in the post

All I added was the featured image bit.

Here’s the full function, which should be inserted in your theme’s functions.php file: [UPDATED 2011.08.26 to scan for youtu.be URLs as well as the traditional youtube.com URL]

// Note that your theme must support post thumbnails for this function to work.
// If you are getting an error try adding add_theme_support('post-thumbnails'); to your functions. php file
function vp_get_thumb_url($text, $size){
    global $post;
    $imageurl="";

    // Check to see which image is set as "Featured Image"
    $featuredimg = get_post_thumbnail_id($post->ID);
    // Get source for featured image
    $img_src = wp_get_attachment_image_src($featuredimg, $size);
    // Set $imageurl to Featured Image
    $imageurl=$img_src[0];

    // If there is no "Featured Image" set, move on and get the first image attached to the post
    if (!$imageurl) {
        // Extract the thumbnail from the first attached imaged
        $allimages =&get_children('post_type=attachment&post_mime_type=image&post_parent=' . $post->ID );

        foreach ($allimages as $img){
            $img_src = wp_get_attachment_image_src($img->ID, $size);
            break;
        }
        // Set $imageurl to first attached image
        $imageurl=$img_src[0];
    }

    // If there is no image attached to the post, look for anything that looks like an image and get that
    if (!$imageurl) {
        preg_match('/<\s*img [^\>]*src\s*=\s*[\""\']?([^\""\'>]*)/i' ,  $text, $matches);
        $imageurl=$matches[1];
    }

    // If there's no image attached or inserted in the post, look for a YouTube video
    if (!$imageurl){
        // look for traditional youtube.com url from address bar
        preg_match("/([a-zA-Z0-9\-\_]+\.|)youtube\.com\/watch(\?v\=|\/v\/)([a-zA-Z0-9\-\_]{11})([^<\s]*)/", $text, $matches2);
        $youtubeurl = $matches2[0];
        $videokey = $matches2[3];
    if (!$youtubeurl) {
        // look for youtu.be 'embed' url
        preg_match("/([a-zA-Z0-9\-\_]+\.|)youtu\.be\/([a-zA-Z0-9\-\_]{11})([^<\s]*)/", $text, $matches2);
        $youtubeurl = $matches2[0];
        $videokey = $matches2[2];
    }
    if ($youtubeurl)
        // Get the thumbnail YouTube automatically generates
        // '0' is the biggest version, use 1 2 or 3 for smaller versions
        $imageurl = "http://i.ytimg.com/vi/{$videokey}/0.jpg";
    }

    // Spit out the image path
    return $imageurl;
}

Put the following in the Loop wherever you’d like the image to display (wrapped in open/close php tags).

// Show featured image, or first image if no featured, or YouTube thumbnail
if (function_exists('vp_get_thumb_url')) {

// Set the desired image size. Swap out 'thumbnail' for 'medium', 'large', or custom size
$thumb=vp_get_thumb_url($post->post_content, 'thumbnail');

if ($thumb!='') { ?>

" alt="" />

Talk about handy! One Page Apps | CSS-Tricks

Michelle McGinnis — Thu, 30 Jun 2011 03:34:40 +0000

I’ve used CSS3Please a tone, but many of the others are new to me – and so handy! I love CSS-Tricks.com.

http://css-tricks.com/12389-one-page-apps-i-actually-use/

10 Techniques for Customizing the WordPress Admin Panel

Michelle McGinnis — Fri, 01 Apr 2011 20:31:22 +0000

Great article from Six Revisions with lots of tips to customize both the dashboard and entire WordPress control panel.

Stack Exchange-like voting for WordPress

Michelle McGinnis — Wed, 23 Mar 2011 20:03:18 +0000

Finally, a StackExchange-like plugin for WordPress! I haven’t used it yet but CubePoints looks very promising.

Validation as you type

Michelle McGinnis — Thu, 03 Mar 2011 18:48:11 +0000

An interesting article from UXExchange on validating forms as a user fills them out.

TwentyTen Five – The HTML5 WordPress theme

Michelle McGinnis — Wed, 23 Feb 2011 22:21:42 +0000

A very good Smashing Magazine article came out the other day explaining how to convert the WordPress TwentyTen theme to HTML5. Here’s that theme for download:

http://www.twentytenfive.com/

Daily Tip: Add More Automatic Image Sizes to the WordPress Media Library

Michelle McGinnis — Tue, 22 Feb 2011 21:30:26 +0000

Great tip from the WPMU blog, and one I’d been seeking for a while. This gives you the ability to not only add new image sizes, but to have them show up in the Media popover so that users can “Insert (the new image size) into Post”. http://networkedblogs.com/eCP0w

CSS Variables with PHP | CSS-Tricks

Michelle McGinnis — Tue, 22 Feb 2011 19:01:04 +0000

Awesome trick enabling you to use variables in CSS files. Would be great for themes with user-selectable style elements.

http://css-tricks.com/css-variables-with-php/

JQuery Sliders

Michelle McGinnis — Fri, 11 Feb 2011 05:17:27 +0000

Some good sliders, including the WOW slider I’d like to try out when I next have the chance: http://plugins.jquery.com/projects/plugins?type=48