by Raelene Morey on February 5, 2019

How to Create a Stunning WordPress Logo Slider

WordPress logo slider

Thinking about adding a WordPress logo slider to your site? If there’s one thing successful businesses have in common, it’s the use of customer logos on their sites. Logos inspire trust in your brand. Essentially, you’re saying to potential customers, “trust us because they these guys did!”

With your own WordPress logo slider, you can easily showcase client, customer, sponsor, or partner logos on your site. In this post, we’ll take a look at what WordPress logo sliders are, the benefits you can expect when you add one to your site, and how to get started creating one with Smart Slider 3.

What is a WordPress Logo Slider?

A WordPress logo slider, also known as a logo carousel, lets you display logos on your site. This makes it easy for customers to see what brands are you associated with your business. For example, WP Engine uses a logo slider to display some of the big name customers it works with:

WordPress logo sliders are one of the best ways to display logos because you can:

  • Display as many logos as you want. Whether you have two or 20 logos, you can display them all with a logo slider since space isn’t a concern.
  • Display logos responsively. With a logo slider, you can keep your logos organized and ensure your design looks great on any device.
  • Set manual or auto-scroll. You can set your WordPress logo slider to scroll automatically (like the WP Engine example above), or let your visitors advance through logos manually using arrows, dots, or swipes.
  • Control other settings. There are many other design and configuration settings you can control, including the size of your logo slider, any animations, responsive design, and navigation.

Why Use a WordPress Logo Slider?

There’s one simple reason why so many brands display logos on their site: logos inspire trust and credibility in your business.

Logo carousel
Infinite Logo Carousel

Logos offer quick visual brand recognition. When skeptical visitors see well-known logos on your site, their guard comes down. It’s like walking into a party and seeing someone you know — you immediately think, “Okay, these people are cool!”

Often, logos will impress your customers — and the bigger the businesses, the better. If you’ve worked with Google or Apple, why wouldn’t you want to tell potential customers about it?

Best Practice Tips for Using a WordPress Logo Slider

Before you dive into creating a WordPress logo slider, there are a few things to keep in mind:

1. Choose a Prominent Location

Place your logo slider somewhere where people are going to see it — your homepage, product/services pages, and About page are ideal.

Minimal Logo Slider
Minimal Logo Slider

2. Manual vs Auto-Scroll

Do you want visitors to manually advance through your logos using left/right arrows, dots underneath the slider, or swiping on mobile? Or do you want the logos to scroll automatically?

3. Ask for Permission

Ask for permission before using logos on your site. Not only is it polite, but it’ll save you from getting a nasty letter from a lawyer later on.

Choosing a WordPress Logo Slider Plugin

There are some key features you’ll want to look out for when choosing a WordPress logo slider plugin:

  • Ease of use. Choose a solution that is intuitive and lets you quickly design your logo slider and insert it into your site.
  • Size. Check that you can control the size of your logo slider. You want to make sure that it can easily fit into the layout of your site.
  • Responsive design. Choose a solution that is responsive and allows you to control how your logo slider displays on tablet and mobile devices.
  • Auto-scroll. Check that you can set the auto-scroll speed.
  • Navigation. Look for a solution that lets you configure the navigation, whether you want to display left/right arrows that visitors click, or simple dots below the slider.
  • Number of logos. How many logos can you include? Make sure the solution you use can handle the number of logos you want to display.
  • Design. There are lots of WordPress logo slider plugins available that can help you create a basic slider but have limited functionality. For more features and control, Smart Slider 3 can help you create a WordPress logo in minutes.
Smart Slider 3 Icon
Bring Your Ideas to Life
Powerful. Visual. Intuitive. Smart Slider 3 is the most advanced slider and block creation tool for WordPress and Joomla.

Creating a WordPress Logo Slider with Smart Slider 3

In Smart Slider 3 Pro the Carousel slider type is the best choice to create a logo slider. In a WordPress carousel you can show more slides next to each other at the same time. And what is even cooler? You can create a logo slider easily and now I will show you how you can build the Logo Carousel template.

Logo carousel
Logo carousel

1. Plan

Planning is the most important part of the slider design process. You should plan for example where you would like to put your slider, or how big it should be. In a logo carousel you should calculate a bit. There are 3 main points: the slider size, the slide size and the maximum pane width. The slider size will be 1200px width and 350px height. This is the base size of your carousel, but the responsive mode will define how big your slider will be. In this template there is the auto responsive mode used, so the logo slider can be as big as the container it’s in.

Now you can decide how big the maximum pane should be, at this slider it is 1200px. It gives the maximum width of how far your slides can go within the carousel. The last thing you should plan how many slides you want within a slider at the same time. In this logo slider you can see 4 slides next to each other. 1200px/4 = 300px, but in this logo slider there is a little space between the slides, so the slide size will be a little smaller: 270x160px.

2. Create a new slider and choose the Carousel type

Create a carousel in Smart Slider 3
Create a carousel in Smart Slider 3

After you’ve planned the sizes, you can create your slider. First you should click on the New slider button, and you can choose the Carousel slider type. With this slider type you can create a logo slider the easiest way. Here you can add your Slider size, but you can change it later too.

3. Add a new slide

Now that you have a slider, you can create your first slide. In the logo carousel each slide has the same layout with a 1 Row 1 Col structure, where there is a simple image layer, the logo. The column gets 2px white border and 5px border radius, and a hover background color which makes a good impact.

1 Row 1 Col structure
1 Row 1 Col structure

4. Carousel slider type settings

After you’ve created the first slide, you can see the Slider settings, and at the General tab you will see the Carousel type settings too. Here you can add the Slider size, the Slide size and the Maximum pane width as I‘ve written above. Also you can upload a slider background image. This image will be below the slides, so when you navigate between the slides, this background gives you a static impression. Since the slides and the logos are white, this background gives a nice contrast too which the slides will be more visible. Finally you can set a slider autoplay interval to your slider, and the carousel will automatically move after the given time.

5. Use your first slide as a layout

You are almost ready with your logo slider. Now what you can do is that you duplicate your first slide, and use it as a template. The only thing what you should change is the image.

Duplicate your slide
Duplicate your slide

And that’s all, your logo slider is ready now. It wasn’t difficult, right?

Wrapping Up

Don’t hide who you’ve worked with. Inspire your customers with a WordPress logo slider. Because the more businesses that can vouch for your company and help potential customers feel confident working with you, the better!

Hopefully, this guide has helped you learn more about logo sliders. If you have any questions about how to create a logo sliders with Smart Slider 3, leave a comment below!

Raelene Morey

About Author

Raelene Morey is the Chief Bird at Words By Birds , an agency that helps WordPress businesses make better content. Computer science grad turned newspaper journalist and ex-managing editor at WPMU DEV. Raelene has been developing WordPress sites for over 10 years.