Resizing recent post image

Support
#1

Hi.

I have a problem. I need to resize the image in the recent post. Because it gets cropped. I did old the steps in this post:
https://theme.co/apex/forum/t/recent-post-image-cropping/57396 , but it continues to cropped de image.

Can you help me?

#2

Hi @jimenagordillo,

Thank you for reaching out to us. Please follow this thread instead https://theme.co/apex/forum/t/recent-blog-post-short-code-is-cropping-featured-image/53976/6 and make sure to clear all caches including the browser’s cache after adding the code.

I tried to check the code you have but the shared login credentials doesn’t have enough privileges, please grant the admin rights so we can take a closer look.

Let us know how this goes!

#3

Hi.

I copied the code but it still doesn’t work. I have already given administrator permissions to the user.

I have used this code

function x_shortcode_recent_posts_v2( $atts ) {
extract( shortcode_atts( array(
‘id’ => ‘’,
‘class’ => ‘’,
‘style’ => ‘’,
‘type’ => ‘post’,
‘count’ => ‘’,
‘category’ => ‘’,
‘offset’ => ‘’,
‘orientation’ => ‘’,
// ‘show_excerpt’ => ‘true’,
‘no_sticky’ => ‘’,
‘no_image’ => ‘’,
‘fade’ => ‘’
), $atts, ‘x_recent_posts’ ) );

$allowed_post_types = apply_filters( ‘cs_recent_posts_post_types’, array( ‘post’ => ‘post’ ) );
$type = ( isset( $allowed_post_types[$type] ) ) ? $allowed_post_types[$type] : ‘post’;

$id = ( $id != ‘’ ) ? ‘id="’ . esc_attr( $id ) . ‘"’ : ‘’;
$class = ( $class != ‘’ ) ? ‘x-recent-posts cf ’ . esc_attr( $class ) : ‘x-recent-posts cf’;
$style = ( $style != ‘’ ) ? ‘style="’ . $style . ‘"’ : ‘’;
$count = ( $count != ‘’ ) ? $count : 3;
$category = ( $category != ‘’ ) ? $category : ‘’;
$category_type = ( $type == ‘post’ ) ? ‘category_name’ : ‘portfolio-category’;
$offset = ( $offset != ‘’ ) ? $offset : 0;
$orientation = ( $orientation != ‘’ ) ? ’ ’ . $orientation : ’ horizontal’;
// $show_excerpt = ( $show_excerpt == ‘true’ );
$no_sticky = ( $no_sticky == ‘true’ );
$no_image = ( $no_image == ‘true’ ) ? $no_image : ‘’;
$fade = ( $fade == ‘true’ ) ? $fade : ‘false’;

$js_params = array(
‘fade’ => ( $fade == ‘true’ )
);

$data = cs_generate_data_attributes( ‘recent_posts’, $js_params );

$posts = get_posts( array(
‘orderby’ => ‘date’,
‘post_type’ => “{$type}”,
‘posts_per_page’ => “{$count}”,
‘offset’ => “{$offset}”,
“{$category_type}” => “{$category}”,
‘ignore_sticky_posts’ => $no_sticky
) );

$output = “<div {$id} class=”{$class}{$orientation}" {$style} {$data} data-fade="{$fade}" >";

foreach ($posts as $post) {

  if ( $no_image == 'true' ) {
    $image_output       = '';
    $image_output_class = 'no-image';
  } else {
    $image              = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' );
    $bg_image           = ( $image[0] != '' ) ? ' style="background-image: url(' . $image[0] . ');"' : '';
    $image_output       = '<div class="x-recent-posts-img"' . $bg_image . '></div>';
    $image_output_class = 'with-image';
  }

  $output .= '<a class="x-recent-post' . $count . ' ' . $image_output_class . '" href="' . get_permalink( $post->ID ) . '" title="' . esc_attr( sprintf( csi18n('shortcodes.recent-posts-permalink'), the_title_attribute( array( 'echo' => false, 'post' => $post->ID ) ) ) ) . '">'
             . '<article id="post-' . $post->ID . '" class="' . implode( ' ', get_post_class('', $post->ID) ) . '">'
               . '<div class="entry-wrap">'
                 . $image_output
                 . '<div class="x-recent-posts-content">'
                   . '<h3 class="h-recent-posts">' . get_the_title( $post->ID ) . '</h3>'
                   . '<span class="x-recent-posts-date">' . get_the_date( '', $post->ID ) . '</span>'
                 . '</div>'
               . '</div>'
             . '</article>'
           . '</a>';

}

$output .= ‘’;

return $output;
}

function x_recent_posts_excerpt() {
remove_shortcode( ‘x_recent_posts’ );
remove_shortcode( ‘recent_posts’ );
add_shortcode( ‘x_recent_posts’, ‘x_shortcode_recent_posts_v2’ );
add_shortcode( ‘recent_posts’, ‘x_shortcode_recent_posts_v2’ );
}

Thank you

#4

Hi @jimenagordillo,

The code you shared above seems correct, though I can’t confirm because I can’t login via FTP. Got this error:

Error:	Network error: Connection timed out
Error:	Could not connect to server

If you’re sure you have added that correctly, this mean caching. In case you have caching on your server, please try to clear/purge cache and then check again.

#5

Hi.

I have cleared the cache but it still fails.

The username and password for access to FTP is the same as that of ssh.

thank you

#6

Hi @jimenagordillo,

Thank you for the credentials, I did go ahead and replace the code in functions.php file with the one provided by Ruenel here.

I’ve also added this to Theme Options > CSS to fit the image perfectly.

.x-recent-posts .x-recent-posts-img {
    background-size: contain;
   padding-top:10%;
}

Please clear your browser’s cache if you don’t see these changes on your end.


Hope it helps,
Cheers!

#7

Hi

Now it looks perfect !!!

Thank you very much!!!

#8

We are delighted to assist you with this.

Cheers!

#9

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.