0

I am using a function to display related posts in my wordpress theme with their thumbnail. I am using uikit to make my theme responsive. Uikit offers a grid feature similar to the bootstrap one, and it also automatically resizes the images according to the available space. What I want to do is to get thumbnails of the same width and height even if the thumbnail needs to be stretched/cropped. Is it possible to edit it so that I get images of same size for each thumbnail? At the moment I'm getting this result:

http://i.imgur.com/XU7rUWU.png

I am using the following code and I've already tried the solution suggested here:

<?php
function getthe_related_posts(){
    $html='<h3>Related posts:</h3><div class="uk-grid uk-container-center" >';   
    $orig_post = $post;  
    global $post;  
    $tags = wp_get_post_tags($post->ID);  

    if ($tags) {  
        $tag_ids = array();  
        foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;  
        $args=array(  
            'tag__in' => $tag_ids,  
            'post__not_in' => array($post->ID),  
            'posts_per_page'=>4, // Number of related posts to display.  
            'caller_get_posts'=>1  
        );  

        $my_query = new wp_query( $args );  
        $width=$args['posts_per_page'];
        $count = 0;
        while( $my_query->have_posts() ) {  
            $my_query->the_post();    

            $html.='<div class="uk-panel uk-panel-space uk-width-medium-1-4 uk-width-small-1-1 uk-text-center"><a class="" href="'.get_the_permalink($post->ID).'">';  
            $html.=get_the_post_thumbnail($post->ID); 
            $html.='<br/><span>'.get_the_title($post->ID).'</span>';
            $html.='</a>';
            $html.='</div>'; 
            $count = $count+1;
        }  
    }  
    $post = $orig_post;  
    wp_reset_query();  
    $html.='</div>';
    return str_replace('uk-width-medium-1-4','uk-width-medium-1-'.$count,$html);
}
?>
1

Install plugin: https://wordpress.org/plugins/force-regenerate-thumbnails/

and regenerate all thumbnails.

Or steps:

  1. Create new dimension for images: add_image_size ('thumb-cropped', 227, 133, true); // Set necessary sizes (true = cropped)

  2. Get images with the sizes in you function.

    get_the_post_thumbnail($post->ID);

    fix to:

    get_the_post_thumbnail($post->ID, 'thumb-cropped');

  3. Install plugin: https://wordpress.org/plugins/force-regenerate-thumbnails/

  4. Inter in admin area and regenerate all thumbnails

  5. The end. Use all new images with fixed dimension

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.