Add image size in wordpress

To add an custom image size for your wordpress template you need to add the following code to your functions.php file.

add_image_size( 'slideshow-background', 930, 300, true ); // Hard Crop Mode, the true at the end, forces the image to the dimentions you have set

This line of code will tell Wordpres that there is a new custom size for images, the little hiccup that always gets me is... these new sizes aren't created until the image is uploaded. So if you want to use it on an image that has already been uploaded (like i always have to) you will need to regenerate your thumbnail images. there is an awesome plugin that does this for you. Belive it or not it is called Regenerate Thumbnails  just install this plugin, regenerate your images and you're sitting pretty.

To use your custom image size in your template you just have to insert the following code in the loop.

 if ( has_post_thumbnail() ) { the_post_thumbnail( 'slideshow-background' ); }

Not in the loop? That ok, just use this code

echo wp_get_attachment_image( 42, 'slideshow-background' ) // where 42 is the image id you want to display

Don't know you image id and not in the loop? Gets a bit trickier, I needed this the other day, I had the image url but nothing else, in your functions.php file insert the following code (which was kindly provided by Phillip Newcomer)

function pn_get_attachment_id_from_url( $attachment_url = '' ) {
 
    global $wpdb;
    $attachment_id = false;
 
    // If there is no url, return.
    if ( '' == $attachment_url )
        return;
 
    // Get the upload directory paths
    $upload_dir_paths = wp_upload_dir();
 
    // Make sure the upload path base directory exists in the attachment URL, to verify that we're working with a media library image
    if ( false !== strpos( $attachment_url, $upload_dir_paths['baseurl'] ) ) {
 
        // If this is the URL of an auto-generated thumbnail, get the URL of the original image
        $attachment_url = preg_replace( '/-\d+x\d+(?=\.(jpg|jpeg|png|gif)$)/i', '', $attachment_url );
 
        // Remove the upload path base directory from the attachment URL
        $attachment_url = str_replace( $upload_dir_paths['baseurl'] . '/', '', $attachment_url );
 
        // Finally, run a custom database query to get the attachment ID from the modified attachment URL
        $attachment_id = $wpdb->get_var( $wpdb->prepare( "SELECT wposts.ID FROM $wpdb->posts wposts, $wpdb->postmeta wpostmeta WHERE wposts.ID = wpostmeta.post_id AND wpostmeta.meta_key = '_wp_attached_file' AND wpostmeta.meta_value = '%s' AND wposts.post_type = 'attachment'", $attachment_url ) );
 
    }
 
    return $attachment_id;
}

Then in your template files where you want the image to be displayed use this code

$imageID = pn_get_attachment_id_from_url( $imgurl ); //gets image from url
$sizedImage = wp_get_attachment_image_src( $imageID, 'slideshow-background' ); //returns the image src for our custom size
echo $sizedImage[0];