Wordpress get_post_meta image width for lazy load

Question

I'm trying to lazy load a page of images in Wordpress - I've tried the plugins but none of them seem to work(I only want to lazy load image on some pages.)

So I'm now trying to do it with a plugin - http://www.appelsiini.net/projects/lazyload

This plugin requires the image width and height in the img tag.

    <img data-original=“img/example.jpg” src=“img/grey.gif” width=“640” height=“480”>

I'm attaching the images from custom fields like

    <img src="<?php echo get_post_meta($post->ID, 'img1', true); ?>">

Is it possible get the images width and height from the get_post_meta

I've looked at wp_get_attachment_image_src but I can't see how to use it get_post_meta

======

UPDATE

======

    <?php
        $attachments = get_children( 
        array(
                    'post_parent' => $post->ID, 
            'post_status' => 'inherit', 
            'post_type' => 'attachment', 
            'post_mime_type' => 'image', 
            'order' => ASC, 
            'orderby' => 'menu_order ID'
            )
        );

    ?>

    <?php
        foreach ( $attachments as $attachment_id => $attachment ) {

            $image_attributes = wp_get_attachment_image_src( $attachment );

    ?>      
            <img src="<?php echo $image_attributes[0];?>" width="<?php echo $image_attributes[1];?>" height="<?php echo $image_attributes[2];?>">

    <?php       

        }
    ?>

Marcin Bobowski Marcin Bobowski · Accepted Answer · 2013-04-24T07:32:31

Its better to use Wordpress Media Gallery support. You can get all images attached to post with:

<?php $attachments = get_children( 
    array('post_parent' => $id, 
        'post_status' => 'inherit', 
        'post_type' => 'attachment', 
        'post_mime_type' => 'image', 
        'order' => ASC, 
        'orderby' => 
        'menu_order ID') ); ?>

where $id is a current post ID. Then with the ID's of attached images, You can simply use:

<?php foreach ( $attachments as $attachment_id => $attachment ) {
    (...)
}?>

to iterate throught image Id's, and

<?php wp_get_attachment_image_src($attachment_id, $size, $icon);>

which is described: http://codex.wordpress.org/Function_Reference/wp_get_attachment_image_src, that allows You not only get url of image, but also its width and height.

The whole code can be wrapped in a shortcode function for ease of use ;).

Wordpress get_post_meta image width for lazy load

1 Answers