Display brand logos with the logo gallery

Use the content element Logo gallery to display multiple logos in a consistent and responsive grid. This is useful for showcasing your partners, brands, certifications, or sponsors.

Logo gallery showing multiple brand logos in a grid

Info

For mixed visuals such as photos and logos, consider using the Image gallery instead.

How to add a logo gallery

  1. In the sidebar of the administration, navigate to Editor.
    The Editor opens.
  2. Navigate to Pages.
  3. Select the page to edit or add a new page.
    A preview of the page opens on the right-hand side.
  4. Navigate to Content elementsLogos.
  5. Drag the content element Logo gallery to the desired position. You can only drop content elements into the blue areas of the page.
  6. Select Add logos.
    The Add logos view appears.
  7. Drag logos onto the Add logos view or select Add logos to upload them from your device or browse the Unsplash image library.
    You can add up to 24 logos to the gallery.

    For a more coherent look, consider uploading logos in the same format and aspect ratio.
  8. After adding the logos, you can edit the logo gallery:
    • Size: Adjust the size of all added logos by moving the slider.
    • Spacing: Adjust the space between the added logos by moving the slider.
  9. Once you are done, select Save.
    If you encounter any issues, see Troubleshooting.

You have added a logo gallery to your shop.

The logo gallery is responsive: it adapts to screen sizes while keeping the logo order, sizing, and spacing consistent.

How to edit a logo gallery

Open the page with the logo gallery in the Editor to add, edit, or delete logos.

Add logos

You can add logos to an existing gallery. A gallery supports up to 24 logos.

  1. Hover over the logo gallery and select Edit.
    The Edit logo gallery view appears. In the lower left corner, you can see how many logos you have already added.
  2. Below the uploaded logos, select the Add logos link and choose additional logos from your device or the Unsplash image library.
  3. When the upload is complete, select Save.

You have added additional logos to the logo gallery.

Edit logos

You can add an alternative text and link to each logo. You can also edit the logo format.

  1. Hover over the logo gallery and select Edit.
    The Edit logo gallery view appears.
  2. Hover over a logo and select Edit.
  3. Here you have the following options:

    Option Description
    Edit image format Access the image format settings. For further information, refer to Edit the format of images.
    Alternative text

    Add a short description of the logo, e.g. “Partner brand logo – Leaf & Vine”.

    Info

    Such an alternative text is a description of the logo that can be used for SEO purposes, read by screen readers, or displayed in case the logo cannot be shown. Come up with a short but meaningful description.

    Link

    Add a URL or use the link picker. When customers select the logo, they are redirected to the linked element. This way you can turn logos into buttons.

    • The link will not be visible on the logo.
    • To open the added link, customers can select any part of the logo.
    • Note that the link is only added to the respective logo, not to the logo gallery as a whole.

    Internal link:
    Select Pages or Products and choose the item from the dropdown menu. You can also search in the Enter link or search page/product field.

    Caution

    You can also select products via the link picker that are currently set as not visible in the product settings. Even if a product is set as not visible, it can still be accessed via its URL. However, it can't be ordered.

    External link:
    Enter the full URL in the Enter link or search page/product field.

    Confirm with Apply link.

    To remove the link, select Delete link.

    Open link in new tab

    Optional: Activate the Open link in new tab checkbox to open the link in a new browser tab. Without it, the link opens in the current tab.

    We recommended to activate the checkbox if you enter a link to an external page, for example, a YouTube video. This way, your customers can easily return to your shop by switching tabs again.

  4. Select Apply.
  5. To edit more logos, repeat steps 2–4.
  6. Once you are done, select Save.

You have edited the logo gallery.

Delete logos

You can delete individual logos from a logo gallery.

  1. Hover over the logo gallery and select Edit.
    The Edit logo gallery view appears.
  2. Hover over a logo and select Delete.
  3. Once you are done, select Save.

You have deleted the logo(s) from the logo gallery.

Troubleshooting

The following sections help solve issues that may occur when adding logos to the gallery.

  • Your shop supports JPG, PNG, and GIF. Convert images to a supported format to upload them. For further information, refer to Learn about image file formats.
  • If an image exceeds 20 megabytes (MB), try one of the following:

    Option 1: Change the image file format

    You can upload images to your shop in the JPG, PNG, or GIF format. These formats have different characteristics which also affect the file size. Thus, changing the image file format might reduce the file size. For further information, refer to Learn about image file formats.

    Option 2: Compress the image

    You can compress the image to reduce the file size (e.g. by reducing the resolution). To do this, you can use basic image editors, for example when you open the image on your device. For further information on how to do this, refer to the help information of your chosen tool. Alternatively, you can also use various free online tools.

    Note that the image quality might be affected when compressing the image.

  • There are two possible reasons for a greyed out Save button.

    Reason 1: Upload of images is still in progress

    Depending on the number and the size of the images you would like to add to the logo gallery at once, the upload might take a while. You can see a progress bar on each image that has not been fully uploaded yet. As soon as all images are uploaded, you can select Save again.

    Reason 2: More than 24 images added

    You can only add up to 24 images to the logo gallery. In order to be able to save your changes, you will need to delete images. As soon as your logo gallery includes 24 images or less, you can select Save again.

  • You can upload GIFs to the logo gallery, but they cannot have more than 100 frames. There are free online tools available that can help you with reducing your GIF’s frame rate. For further information about GIFs, refer to Learn about image file formats.
  • Your shop supports image resolutions with a maximum width of 7000 pixels and a maximum height of 7000 pixels.

    If your image exceeds this resolution, you can reduce its size with the help of basic image editors, for example when you open an image on your device. For further information on how to do this, refer to the help information of your chosen tool. Alternatively, you can also use various free online tools.

    Note that the image quality may be affected when you reduce the resolution.

Was this article helpful?