Simple Elementor Logo Cloud Section

This Elementor logo cloud section shows a short centered heading above a row of five client or partner logos. Logo Cloud Simple with Heading is a free, responsive block shared as a JSON file and built only with native Elementor widgets.

What's Inside the Block

• A centered H2 heading ("Trusted by the town's most loved local shops") in navy (#101828), semi-bold Inter at 1.125 rem.
• A centered row of five Image widgets, each 48 px high with the logo scaled to fit (object-fit: contain).
• The logos are 2.5 rem apart and wrap to a new line when there is not enough room.
• Five logos per row on desktop, three on tablet, and two on mobile.
• A white boxed section with 8 rem of vertical padding on desktop, reduced on tablet and mobile.

Tip: Use logos that share a similar height and color treatment, such as all dark gray or all full color, so the row looks even. Wide wordmarks and square marks can look uneven side by side, so test them together. Only show logos of companies that have agreed to be shown.

Requirements

• A recent version of Elementor with Flexbox Container available.
• No Elementor Pro required.
• The Inter font available on your site (otherwise a fallback font is used).
• Your own logo files, such as PNG, SVG, or WebP with a transparent or white background.

Note: All five Image widgets are empty, so Elementor shows its default placeholder until you choose your own logos. The logos in the preview image are made-up examples. The images have no links and no alt text, so add alt text for each logo and a link if you want one. The widths of the logo boxes use custom calc values, so an older version of Elementor may show a different number of logos per row. Back up your page before importing a template into an existing layout.

Download Elementor Template (JSON)

Widgets Used

Element	Purpose	Pro?
Flexbox Container	Section wrapper and the wrapping logo row (2 in total)	No
Heading	Centered section title (1 in total)	No
Image	Logo slots (5 in total)	No

Frequently Asked Questions

How do I import this Elementor JSON template?

First, download the JSON file using the button above and don't unzip or edit it. Second, open your WordPress dashboard, go to Templates, and choose Saved Templates. Third, click Import Templates, select the JSON file, and wait until the template appears in the list.

Fourth, open the page you want to edit with Elementor and click the folder icon to open the template library. Fifth, open the My Templates tab, choose this template, and click Insert. The block is added to your page and can be edited like any other Elementor container.

How do I change the heading text?

Click the heading and type your own text. It is a Heading widget with the H2 tag. To change the color, size, or alignment, select the widget and open the Style tab.

How do I add my own logos?

Select an Image widget, open its Content tab, and choose or upload your logo. Repeat this for all five widgets. Each widget is set to 48 px high with the logo fitted inside, so the full logo is always visible without being cropped.

How do I add or remove a logo?

To add a logo, duplicate one Image widget inside the logo row. To remove one, delete its widget. The row is centered and wraps, so any number of logos works. Because each box is a fifth of the row, a sixth logo moves to a second line, so consider changing the width if you want six in one row.

How do I make the logos bigger or smaller?

Select an Image widget and change its height in the Style tab. The 48 px value is set on each of the five widgets, so repeat the change for each one.

How do I link a logo to a website?

Select the Image widget, open its Content tab, and set the Link option to Custom URL. The block has no links by default, so add one only where it makes sense, such as a case study or a partner page.

How do I make all logos the same gray color?

Select an Image widget, open its Style tab, and use the CSS Filters option to lower the saturation. Apply the same filter to every logo so they match. You can also upload logos that are already in one color.

How does the layout change on tablet and mobile?

On desktop the row shows five logos. On tablet the row is narrower and shows three logos per line, and on mobile it shows two per line with a slightly smaller gap between columns. The section padding is also reduced on smaller screens.

Where should I place this logo section?

Place it right below a hero section, or before a testimonial or pricing section, where it can add trust early. Because its heading is an H2, use it after the page's H1 and main content.

Do I need Elementor Pro?

No. The block only uses native Heading and Image widgets inside Flexbox containers.

Why won't the file import?

Make sure the file has a .json extension and hasn't been unzipped or edited. If it still fails, check your hosting upload size limit or any security plugin that may block file uploads.

Why do the Flexbox settings look different or missing?

Update Elementor to the latest version. On older versions, the Flexbox Container feature may need to be enabled first in Elementor's feature settings.

Why does the font look different?

The block uses the Inter font. If it isn't available on your site, change the font family in the Style tab of the heading.

Looking for more logo cloud sections? Browse all Elementor logo cloud section templates, or see every free block in Elementor Templates.