How to display images from custom fields in a block grid

[JuliaRietveld]

Hi, many thanks to you who wants to help me solve this challenge!
So I have a row with 4 columns in a block grid. I want to display the title and an image of 4 child pages of a specific parent page. I'm using custom fields pair 'img_thumb' - 'path/to/image' to set up the image. But the image is not showing up and I get a black screen most of the times. I must be doing something wrong.
Thank you again for your help!

http://pastebin.com/gdnZbMjH

[ghost]

MrsColombo,

here's a function I've been using to list childpages of the current page. No need for custom image fields, just use WP core featured image.

See difference between $post->ID (current page) and $pageChild->ID ?

You can easily modify this function/query to work on any page just by editing post_parent.

<ul class="small-block-grid-2 medium-block-grid-3 large-block-grid-4">

<?php $pageChildren = $wpdb->get_results("SELECT * FROM $wpdb->posts WHERE post_parent = '$post->ID' AND post_type = 'page' AND post_status='publish' ORDER BY menu_order", 'OBJECT'); 
if ( $pageChildren ) : foreach ( $pageChildren as $pageChild ) : setup_postdata( $pageChild ); ?>

<li><a href="<?php echo get_permalink($pageChild->ID);?>" title="<?php echo ($pageChild->post_title); ?>"><?php $thumb = wp_get_attachment_image_src( get_post_thumbnail_id($pageChild->ID), 'post-thumbnail' );$url = $thumb['0']; ?><img class="fade" src="<?php echo esc_url($url); ?>" alt="" /></a><h3 class="pagechild-title"><a href="<?php echo get_permalink($pageChild->ID);?>" title="<?php echo ($pageChild->post_title); ?>"><?php echo ($pageChild->post_title); ?></a></h3></li>

<?php endforeach; endif; ?>

</ul>

[olefredrik]

👍