> For the complete documentation index, see [llms.txt](https://modernpress-io.gitbook.io/modernpress/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://modernpress-io.gitbook.io/modernpress/widgets/clients-logos.md).

# Client's Logos

### **Introduction**

The **Clients Logos Widget** in **ModernPress** allows you to showcase client or partner logos in a visually appealing way. This widget is perfect for displaying brand collaborations, sponsors, or featured companies. With **five unique layouts**, you can choose the best style that fits your design needs.

***

**Key Features:**

\
✅ 5 Unique Layout Styles\
✅ Grid & Carousel Display Options\
✅ Custom Spacing & Backgrounds\
✅ Hover Effects & Logo Resizing\
✅ Fully Responsive & Mobile-Friendly

***

### Adding the Clients Logos Widget

{% stepper %}
{% step %}
Open your WordPress Dashboard.
{% endstep %}

{% step %}
Edit a page with **Elementor**.
{% endstep %}

{% step %}
Search for **"Clients Logos"** in the **ModernPress Widgets** panel.

<figure><img src="/files/qN3pMe7WUQXurfrhLAUy" alt=""><figcaption></figcaption></figure>
{% endstep %}

{% step %}
Drag and drop the widget into your section.

{% endstep %}

{% step %}
Upload logos and customize the layout settings.

<figure><img src="/files/rYPVdeyp4hIBp1XD1RQN" alt=""><figcaption></figcaption></figure>
{% endstep %}
{% endstepper %}

***

### **Layouts Overview**

#### **Layout 1 - Simple Logos**

📌 Clean and minimalistic display with **no extra styling**.\
🎨 Best for **modern, subtle branding sections**.

<figure><img src="/files/JDxcRiFUFIVXSzixHKop" alt=""><figcaption></figcaption></figure>

#### **Layout 2 - Black Strip**

📌 Logos placed on a **black background strip** in a single row.\
🎨 Perfect for **bold, high-contrast designs**.

<figure><img src="/files/qmIeI9atMVISRKJwya6C" alt=""><figcaption></figcaption></figure>

#### **Layout 3 - Grid**

📌 Logos arranged in a **tight grid layout** with no spacing.\
🎨 Works well for **compact, space-efficient designs**.

<figure><img src="/files/Scl8EPijSM8Z40neUiB5" alt=""><figcaption></figcaption></figure>

#### **Layout 4 - Boxed Logos with Borders**

📌 Each logo is inside a **box with a border**, creating a structured look.\
🎨 Great for **professional and corporate-style branding**.

<figure><img src="/files/oIAdvuk0OvY5UsFyHo9b" alt=""><figcaption></figcaption></figure>

#### **Layout 5 - Alternating Backgrounds**

📌 Logos are displayed in a **tight grid**, but each logo has an **alternating background color**.\
🎨 Best for **eye-catching, visually dynamic presentations**.

<figure><img src="/files/6AgwPSMk6z1HTgRzvxmW" alt=""><figcaption></figcaption></figure>

***

### **Customization Options**

#### **General Settings**

📌 **Add Unlimited Logos** – Upload multiple client or partner logos.\
🔗 **Clickable Logos** – Option to link each logo to a website.\
📏 **Column Control** – Adjust the number of logos per row.

<figure><img src="/files/a6FxRE6P6vRyDZQy4rOS" alt=""><figcaption></figcaption></figure>

#### **Style Settings**

🎨 **Background & Borders** – Customize background colors, borders, and spacing.\
⚡ **Hover Effects** – Enable grayscale, zoom, or opacity effects on hover.\
📏 **Padding & Margins** – Adjust spacing between logos.

#### **Advanced Features**

📱 **Mobile Optimization** – Adjust columns and spacing for different screen sizes.\
🔄 **Autoplay & Scroll Speed (For Carousel)** – Control the automatic sliding speed.

***

### FAQs

<details>

<summary>Can I add links to the logos?</summary>

Yes! Each logo can be linked to an external website.

</details>

<details>

<summary>Can I adjust the spacing between logos?</summary>

Yes! Use the **Grid Spacing** setting to adjust gaps between logos.

</details>

<details>

<summary>Can I add hover effects to the logos?</summary>

Yes! You can enable grayscale, zoom, opacity, and other effects on hover.

</details>

<details>

<summary>How does the alternating background work in Layout 5?</summary>

The background color will switch between two chosen colors for each logo in the grid. You can customize the colors in the **Style Settings**.

</details>

***

### **Need Help?**

For support, contact us at <support@modernpress.com>.