Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter compumatter

    (@compumatter)

    By the way, I have set a CSS class to modify it however it seems to be ‘stretching’ a 150px image to get there resulting in a loss of resolution, so I want to deal with the 150px and modify it to 200px or just let css handle it.

    Thanks again.

    Jay
    http://shuksanhealthcare.com/testimonials-2/

    Plugin Author Kerry

    (@bluenotes)

    The image uses the standard “thumbnail” crop size that is set in Settings > Media. On most installs this will be 150×150. The plugin is then using CSS to reduce this to 100×100 to better fit, especially on sidebars.

    So you have a couple of options…
    1) Change the size for Thumbnails in Settings > Media, however this will effect all images using this crop size on your site, then adjust CSS to match.
    2) Use an available filter to adjust only the one used in the plugin, then use your own class names or adjust the plugin css to match.

    Going with #2 would look something like the following, you would add it to your theme’s functions.php file

    // Custom BNE Testimonials Featured Image
    function custom_testimonial_featured_image( $shortcode_output, $options ) {
    
    	// Post ID
    	$id = get_the_id();	
    
    	// Crop Size  (thumbnail, medium, full, etc)
    	$size = 'medium';
    
    	// Image Attributes (class, title, etc)
    	// http://codex.wordpress.org/Function_Reference/get_the_post_thumbnail
            // You can add any custom CSS here if you prefer to use your own.
    	$attr = array(
    		'class' => 'bne-testimonial-featured-image circle'
    	);
    
        // Get Thumbnail Image and apply above attributes
        $shortcode_output = get_the_post_thumbnail( $id, $size, $attr );
    
    	// Return the image
        return $shortcode_output;
    }
    add_filter('bne_testimonials_featured_image','custom_testimonial_featured_image', 10 , 2);
    

    The above will now use the crop size “medium” which by default is 300×300 in Settings > Media unless it has been changed. You can use any crop size available to you from your theme. However, the down side to using this filter is that you then loose the image style options that are used in the shortcode/widget (circle, square, flat-circle, and flat-square) So you would need to set them above like I did in the example using “circle”. This filter would be a global filter and affect ALL testimonials unless you add conditional logic to it.

    In either case you will need to override the CSS that forces it down to 100×100. If you’re going with #2, you could actually use your own CSS class names since it’s added within the filter which would allow you to skip the next step. But if you’re going with what I have then you would need to add the following to a CSS area in your theme options or theme style.css file

    .bne-testimonial-featured-image { width: 200px !important; height: 200px !important; }
    

    Adjust the size to your preference that would match your desired crop size/look.

    Thread Starter compumatter

    (@compumatter)

    Thank you. I have used the overriding function of 200/200 and somehow in this process it results in a poor resolution image.

    However, you have given me enough detail to dissect the various possibilities and determine the best approach including the ‘medium’ option.

    Thank you for that.

    Jay

    Plugin Author Kerry

    (@bluenotes)

    If you changed the default thumbnail size in Settings > Media then you should also regenerate all of your images or re-upload the ones you need. Also make sure to clear your browser cache.

    Regenerate Thumbnails plugin: https://wordpress.org/plugins/regenerate-thumbnails/

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘image size of 150px w/h where is this coming from ?’ is closed to new replies.