Logolicious overview

Our logo slider app for Shopify, Logolicious, allows you to add logo carousels to your Shopify store. You can use it to showcase your product brands, partners, satisfied customers, and more. Logo carousels can appear on your home page, or on collection pages, blogs, pages, and more.

Installing the app

If you haven't done so already, you can install the app via the Logolicious app listing in the Shopify theme store.

A note about theme compatibility

Logolicious requires that you have a theme which is compatible with Online Store 2.0, an updated theme architecture introduced by Shopify in July 2021. Thus, if your store is running an older theme it will not be possible to integrate Logolicious into your store. If this is the case, you'll see a warning message when you open the app in the Shopify admin.

Creating a logo set and uploading logos

You can access the app under Apps -> Logolicious. On the main page of the app you'll see that there are ten numbered logo slots. Each of the numbered slots can contain a distinct set of logos.

To set up a logo set, click on one of the ten numbered slots. Upload your logos within that logo set. You can upload images in many common logo formats, including PNG, JPG, EPS, Adobe Illustrator .AI, Adobe Photoshop .PSD, PDF, SVG, and more. The app will automatically trim, convert, and optimize all uploaded images. You can drag and drop the logos to change the order in which they appear.

Adding a logo slider to a template

Once you have created a logo set, you can add it to your store using Shopify's theme customizer tool. To do this, go to Online Store -> Themes, then click the Customize button next to the theme where you want to install the logo slider.

In the theme customizer, use the dropdown menu at the top of the page to choose the type of template where you want to add a logo slider. This can be the home page, a page, product, blog, article, or collection.

In the left column, choose either the option to Add section or Add block, scroll to the bottom of the list, and choose Logolicious. Once added, you can optionally reorder it within in the template by dragging and dropping.

Choosing Logolicious display options

Clicking on the logo slider you just added will reveal a panel with some options that control how the slider looks and behaves. The most important of these options is the dropdown menu that allows you to choose which of the logo sets to display within that particular slider. Other available settings include the speed and delay of slider transitions, whether to display previous/next arrows, and more. When you change these options, the view will be updated accordingly, so you can play with the settings and find out which ones work best for your particular use case.

Frequently asked questions

How can I increase the number of logos which are shown on the page at once?

Simply decrease the Maximum logo width and Space between logo columns values. This will allow more logos to fit onto the page.

How can I make it so that the mobile view of my web site displays two logos simultaneously?

As above, this is simply a matter of adjusting the Maximum logo width and Space between logo columns values. Try setting these fields to 90 and 20px, respectively. You may want to fine-tune the setting from there, but that should be a good starting point.

How can I set the slider to use the entire page width?

Within the theme editor you can optionally set your logo slider to take up the entire width of the page. To do so, first locate the page section labeled "Apps" which contains your logo slider. When you click on that, it will reveal a panel with an option labeled "Make section margins the same as theme." Unchecking that box will cause all apps within the section to use the full page width.

How can I set the slider to scroll continuously?

For continuous scrolling, set the Delay between transitions setting to a value of zero, and set the slider to advance by one logo with each transition. For the Speed of each transition setting, we suggest a value of 3000ms.

Need additional help?

If you have any questions about Logolicious, feature suggestions, etc. please get in touch with us at support@commercecomponents.io.