Do you want to create an Elementor image gallery where all the images have the same size in a grid layout? Images of consistent dimensions create a uniform grid that looks clean and professional on any device.
With the Gallery Listing widget from The Plus Addons for Elementor, you can make all images the same size in the grid layout.
To check the complete feature overview documentation of The Plus Addons for Elementor Gallery Listing widget, click here.
Requirement – This widget is a part of The Plus Addons for Elementor, make sure it is installed & activated to enjoy all its powers.
Best Used For:
- Photography and portfolio sites displaying images in a uniform grid where inconsistent image dimensions would break the layout
- WooCommerce stores showing product images in a clean square grid so all products appear equal in size
- Agency and creative sites presenting client work or brand assets in a consistent Elementor image gallery grid
To do this, add the Gallery Listing widget on the page. After selecting the appropriate listing style, select Grid from the Layout dropdown under the Layout tab.
Select the appropriate image popup type from the Popup Layout dropdown.
In the Content tab, select the appropriate content source and add images to the gallery.
If you have images with different dimensions in your gallery, to make them the same size –
- Go to the Extra Options tab and turn on the Display Image Size toggle. This forces every image to render at a fixed dimension, overriding original upload sizes to maintain a consistent grid.
- Select Tp-image-grid – 700 x 700 from the Image Size dropdown. Use this preset when you want all gallery images cropped to a square format, which is ideal for product galleries and portfolio grids where equal spacing matters.
Note: Make sure all your images are bigger than 700×700 pixels in dimension.
Now all your images will be of the same size.
If you want to present the same image collection as a portfolio-style showcase, see How to create Website Portfolio/Showcase Page in Elementor in The Plus Addons for Elementor.
To display your images in a sliding carousel instead of a grid, see How to Create Image Carousel Slider in Elementor using The Plus Addons for Elementor.
Also, read How to make Elementor image carousel of the same height.
