Adding your partners’ logos to your website can be an excellent way to boost your company's credibility. To add logos or certification badges to your site, we suggest using the Logo wall block.
This block was specifically created to give you the ability to add the logos of companies you partner with or badges and certificates your company earned over the years. Below we will review how to modify the Logo wall block.
Note: Using a logo without permission may constitute a trademark infringement and can result in loss of clients or even a lawsuit. Please make sure that you are authorized to use a company’s logo.
Adding a Logo wall block
Here’s how you add a Logo wall block:
- Choose a location where you want to add your Logo wall block and click the Add a block (+) Plus button.
- In the Block library, choose Logo wall from the list to see the pre-designed layout for this block type.
- Click the pre-designed layout you like to add it to your page.
Customizing block settings
You can customize the Logo wall block with the help of its control pane. To activate it, click the block and then click the Block settings icon.
The Block settings menu will appear. It consists of two tabs: the Layout tab and the Appearance tab.
In the Layout tab, you can choose which elements should be displayed in the block. To hide a specific block element (for example, if you want to delete a button), remove the blue tick next to the element’s name.
In the Appearance tab, you can make the following changes:
- Block style: Change the block’s color scheme.
- Block spacing: Adjust the whitespace (margins) at the top and the bottom of the block.
- Media content settings: Add a black & white filter to the images within this block.
Once you are done customizing block settings, click Save.
Editing the block title and buttons
You can edit the tile of the block (the text piece at the very top) and both buttons. To learn more about how to do it, visit the respective tutorials:
Replacing demo logos
To replace the demo logos and upload your own, follow these steps:
- Click on the logo you want to change and then click Replace image.
- Choose the new logo image on your computer and click Open.
- To quickly resize the logo, move the resize control.
Once you are done replacing the logos, publish your site to make the changes live.
Adding more logos
To add more logos to the page, duplicate any logo and then add a new image. To duplicate a logo, hover over it to activate its control panel and then click the Duplicate icon.
A copy of the logo will appear to the right of the original one, and a new row will be added automatically to the logo wall.
Changing the order of the logos
You can change the order of the logos within a block. To do this, follow these steps:
- Hover over the logo you want to move to enable its controls.
- Click the Move button and then drag and drop the element along the row to the place you want.
Here’s the video of the process.
Setting a logo click action
You can set a click action for any logo on your logo wall. This is useful if you want to direct your site visitors to your partner’s site when they click the respective logo. You can choose one of the following click actions to be assigned to a logo:
- Open a page: This action opens a page on your website.
- Make a phone call: This option allows visitors to make a phone call upon the click on the logo.
- Send an email: This action allows your visitors to instantly send you a message via the email client on their device.
- Download a file: This action allows visitors to download a file.
- Scroll to a block: This action brings your visitors to another block on the page.
- Open a web address: This action will open an external URL.
Here is how to set a click action for a logo:
- Right-click the logo you want to hyperlink to call out the dropdown menu, and then click Set a click action.
- In the Set a click-action menu, you can choose a corresponding click-cation and set it up. The Set a click-action feature for logos works the same as for the images and is described in detail in this tutorial.
- Click Save to submit the changes and publish the site.
Set a logo title (Alt text)
Alt text (alternative text), also known as alt attributes, alt descriptions, or alt tags, is used to describe the appearance and function of an image on a page for visually impaired visitors and search engines. For more details, refer to Google Image best practices.
Here is how to add alt text (also called logo title) to a logo:
- Right-click on the logo you want to hyperlink to call out the dropdown menu, and then click Change alt title.
- Enter the Image title (alt text) into the respective field and click Save.
- Publish your site to make the changes live.
Deleting a logo
To delete a logo, hover over it to enable its controls and click Delete.
The logo will be removed, and the design will adapt automatically.
We hope you find this article helpful. If you have any questions left, please contact our Support Team.
Ready to use your new knowledge? – Edit your site!