On my front page I want to display a grid with different images. To make it easy to change these images, I’m using Advanced Custom Fields. However it doesn’t work to really crop these images. I have put the following code in my template file:
<?php
$image = get_field('bild7');
if( !empty($image) ):
// vars
$url = $image['url'];
$title = $image['title'];
$alt = $image['alt'];
$caption = $image['caption'];
// thumbnail
$size = 'bones-thumb-260';
$thumb = $image['sizes'][ $size ];
$width = $image['sizes'][ $size . '-width' ];
$height = $image['sizes'][ $size . '-height' ];
if( $caption ): ?>
In my functions.php:
// Thumbnail sizes
add_image_size( 'bones-thumb-1040', 1040, 350, true );
add_image_size( 'bones-thumb-520', 520, 350, true );
add_image_size( 'bones-thumb-260', 260, 350, true );
add_filter( 'image_size_names_choose', 'bones_custom_image_sizes' );
function bones_custom_image_sizes( $sizes ) {
return array_merge( $sizes, array(
'bones-thumb-1040' => __('1040px by 350px'),
'bones-thumb-520' => __('520px by 350px'),
'bones-thumb-260' => __('260px by 263px'),
) );
}
My custom field is created as image, with the bones-thumb-260 size. You can see the result here: http://irene-hofer.ch/fortress/
