Masonry Image Gallery – Elementor

  • Posted in : Interique
  • butlerjeffery
    Participant

    I was wondering if there is a way to crop the images in a specific way in the Image Size of the gallery (Square/Landscape/Portrait/Huge Square)? I like the the square size but it’s cutting off important parts of the images. If that is not an option, is there a way to customize the sizes?

    serkan
    Moderator

    Hi there,

    Thank you for reaching out!

    The gallery image size options (Square, Landscape, Portrait, Huge Square) use predefined aspect ratios with center cropping by default, and unfortunately there isn’t a built-in option to adjust the crop position or focal point for individual images within those presets.

    However, here are a couple of workarounds:

    1. **Pre-crop your images** – Before uploading, crop/resize your images manually (using a tool like Canva, Photoshop, or even the WordPress image editor) so the important parts are centered. This way, the theme’s center crop will capture the area you want.

    2. **Use CSS to adjust object-position** – If you’re comfortable with a small CSS snippet, you can change the crop anchor point. For example:

    `css
    .gallery-item img {
    object-position: top center; /* or: 50% 30%, left center, etc. */
    }
    `
    This shifts which part of the image is visible within the cropped frame. You can add this in **Appearance → Customize → Additional CSS**.

    3. **Custom sizes via CSS** – If you’d like entirely custom aspect ratios beyond the provided options, that would also require custom CSS targeting the gallery container.

    If you can let me know which specific images are being cut off, I’d be happy to suggest the exact CSS adjustment for your case.

    Best regards

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in and have valid license to reply to this topic.

License required for the following item
Login and Registration Log in · Register