[Alfonso Ballesteros]

Hello,

I set a custom size for the grid (image_width=’280′ image_height=’220′) but my images are croped and are not displayed correctly. I tried to resize the images before uploading and also the different crop options in settings->images and it doesn´t work.

[Steven Zahm]

@ Alfonso

re: I set a custom size for the grid (image_width=’280′ image_height=’220′) but my images are croped and are not displayed correctly

The crop being applied to the images will be “Crop and resize proportionally to best fit the specified dimensions, maintaining the aspect ratio.” Meaning if you are uploading oversized images (larger than 280×220) then the image will be scaled down using the smaller dimension and then the larger dimension will be cropped based center of the image.

re: the different crop options in settings->images and it doesn´t work.

Those settings will not affect the images in the grid. The Large Image settings will affect the image displayed on the profile view of the template.

Hope that helps!

ps. Ensure you do not have errors in your shortcode, I supetct you do. Please follow the advice given here when working with shortcodes.

[Alfonso Ballesteros]

The images are displayed as attached in the image.

I tried the 4 different crop modes for Thumbnail Image, Medium Image, Large Image and Logo but the images remain the same. I also tried to upload smaller size images and the problem is not solved. Do you know what could be the problem? Thank you

Attachments:

You must be logged in to view attached files.

[Steven Zahm]

@ Alfonso

re: I tried the 4 different crop modes for Thumbnail Image, Medium Image, Large Image and Logo but the images remain the same.

Changing the crop mode on the Image settings will not affect the image used on the Gridder page. Only the Large Image size and its crop mode will be applied to the image on the profile page of the entry.

The crop applied to the grid images, like I mentioned is -> the image will be scaled down using the smaller dimension and then the larger dimension will be cropped based center of the image.

re: I also tried to upload smaller size images and the problem is not solved.

Uploading smaller will not change anything because the image would have to be scaled up instead so you would end up being blurry.

re: Do you know what could be the problem?

Yes, I see you’re uploading logos… those will not generally look good because of how the image is scaled and cropped because logo are never “square” (for a lack of a better term). The crop mode on the grid images is designed to be a good fit for profile pictures of people which is why the images are scaled to fit and cropped based on the image center this is because that is where faces generally are in profile shots.

What you need is the images to be simply scaled to fit the size adding a border as needed. The only way to do this would be to edit the card.php found here: ../wp-content/plugins/connections-gridder/

Change this:

    <?php $entry->getImage(
        array(
            'image'    => $atts['image'],
            'height'   => $atts['image_height'],
            'width'    => $atts['image_width'],
            'fallback' => array(
                'type'     => 'block',
                'string'   => ''
                ),
            'style'    => $atts['image_opacity'] ? array( 'opacity' => $atts['image_opacity'], 'filter' => 'alpha(opacity=' . $atts['image_opacity'] * 100 . ')' ) : array(),
        )
    ); ?>

to this:

<?php $entry->getImage(
    array(
        'image'    => $atts['image'],
        'height'   => $atts['image_height'],
        'width'    => $atts['image_width'],
        'fallback' => array(
            'type'     => 'block',
            'string'   => ''
            ),
        'zc'       => 2,
        'style'    => $atts['image_opacity'] ? array( 'opacity' => $atts['image_opacity'], 'filter' => 'alpha(opacity=' . $atts['image_opacity'] * 100 . ')' ) : array(),
    )
); ?>

That crop mode will be better suited for logos.

Hope that helps!

[Alfonso Ballesteros]

That worked! Thank you

[Author]

Posts