[Trevor Wilcox]

Hi Steve

Not sure what I’m doing wrong here. I have set my shortcode specifying my image width and height, as follows:

[connections order_by="department|SORT_DESC,last_name|SORT_ACS, first_name|SORT_ACS" enable_search='TRUE' page_limit=500 enable_category_select='TRUE' show_profile_link='FALSE' image="photo" image_width=73 image_height=90 show_phone_numbers='FALSE' show_org='TRUE' card_width=420 show_empty_categories='FALSE' category=2 home_id=2643233]

In my image settings, I have it set to:
width:400
height:493
Quality:100%

The images uploaded at these settings are pre-cropped and sized at that size (400 x 493). This is directly proportional to the display size settings of 73×90. And so the crop mode is set to Resize to Fit (No Cropping). They are all appearing at the correct size, but the quality of the resulting image output is not what it should be.

[Trevor Wilcox]

This reply has been marked as private.

[Trevor Wilcox]

This reply has been marked as private.

[Steven Zahm]

This reply has been marked as private.

[Trevor Wilcox]

This reply has been marked as private.

[Trevor Wilcox]

Yeah, for my directory, I’m actually not using the card-single view at all – I’ve elected to not show the link to that view in my shortcode, so I’m only displaying thumbnails.

[Steven Zahm]

@ Trevor

Ok, open the card.php file found in this folder:

../wp-content/plugins/connections-tile-plus/

Look for this:

$entry->getImage( array(
    'image'    => $atts['image'] ,
    'height'   => $atts['image_height'] ,
    'width'    => $atts['image_width'] ,
    'fallback' => array(
        'type'     => $atts['image_fallback'] ,
        'string'   => $atts['str_image']
        )
    )
);

Change to this:

$entry->getImage( array(
    'image'    => $atts['image'] ,
    'height'   => $atts['image_height'] ,
    'width'    => $atts['image_width'] ,
    'quality'  => 100,
    'fallback' => array(
        'type'     => $atts['image_fallback'] ,
        'string'   => $atts['str_image']
        )
    )
);

The difference being the quality setting. Hope that helps!

[Trevor Wilcox]

This reply has been marked as private.

[Trevor Wilcox]

Nevermind, Steve – I got it. All I had to do was look at card-single.php and use the same in card.php, like this:

$entry->getImage( array(
'image' => $atts['image_single'] ,
'height' => $atts['image_single_height'] ,
'width' => $atts['image_single_width'] ,
'quality' => 100,
'fallback' => array(
'type' => $atts['image_single_fallback'] ,
'string' => $atts['str_image']
)
)
);

That did the trick and I then could adjust the CSS to get the display size I wanted.

[Steven Zahm]

@ Trevor

Yep, that’ll work too. You can set any width/height you wish you do not necessarily need to use the shortcode values. Personally, I really can not see a difference between the small image @100 and the larger image scaled down with CSS. Perhaps that is simply due to my display. It’s not cheap or low end but is not a HiDPI either as it has a pixel density of about 110 PPI. If you are viewing on a Mac Pro or a high end tablet/phone which has a higher pixel density then scaling down a larger image in CSS would make a little difference. I did dev a feature to specifically support HiDPI images but disabled it for now since it does cause the directory to load slower as it has to create multiple images for the browser to swap in the most relevant based on the device/browser. The slowest part is that the browser has to download multiple images. I do revist this from time to time so at some point I am sure I will enable this feature again.

[Author]

Posts