A logo is a powerful visual representation of a brand. When your business is connected with other brands, whether through partnership or affiliation, you may need to display their logos on your website to build trust and credibility among web visitors.
For example, if you have a portfolio website, you must display logos of the brands you have worked with. The same is true for many other websites. WordPress allows you to do it in various easy and hassle-free ways.
In this tutorial post, we’ll show you two easiest methods of how to showcase logos in WordPress, with and without a plugin. Get started!
Method One: Without a Plugin (Using the Column Block)
The Column is a default block of the Gutenberg editor.
Step 01: Add the Column Block to the Editor
Add Blocco colonne to the editor by clicking the icona più (+).
Step 02: Select a Column Layout
Select a column layout. The more columns you select, the more logos you can add. Let’s select the layout 33/33/33.
Once the block is added, you can increase the column number further.
To do this, click il Column icon on the toolbar. Vai a il Scheda Impostazioni. Then, come to the Columns section.
È possibile increase the column number by dragging the scale or directly typing a figure.
Step 03: Add the Image Block to the Columns Individually
You can add all the other Gutenberg blocks within the columns. Go to the first column e click il icona più (+).
Type Image in the search box. Once the block appears, add it to the column.
Now, upload a logo whether from your local drive or the Media Library.
You can see that we have added a logo to the column block.
Step 04: Add Logos to the Other Columns One by One
In the same way, add logos to the other columns of the block.
Step 05: Stylize the Column Block
To stylize the block, go to il Scheda Stili on the right side bar.
By scrolling the tab, come to Block Spacing. This section will allow you to add space between the logos vertically and horizontally. But in this case, it’s better to add spaces horizontally.
Then, add a border around the entire column block. You can change the color and width of the border.
For advanced-level customization, you need to use a third-party plugin. We will explain the following method with such a plugin.
Method Two: Using a Plugin (Tableberg)
Tavolo di lavoro is a versatile plugin for building tables, icon boxes, image boxes, logo boxes, and more. You can showcase logos with advanced customizations on your website with this plugin. Get it from the banner blow.
Creare bellissimi tavoli
Con l'editor di blocchi
Once installed, follow the outline below.
Step 01: Add the Tableberg Block to the Editor
The plugin adds a block to the Gutenberg block library named Tavolo di lavoro. Add the block to the editor.
You need to define table cells for the number of logos you want to display. Simply create the required number of cells by specifying the number of rows and columns.
For example, we need eight cells to display eight logos. Set the column and row number 4*2.
The required number of cells is created, as you can see.
Step 02: Start Adding Logos to the Tableberg Cells
Tableberg allows you to add several custom blocks to the cells. Find and aggiungere il blocco immagine to a cell.
Now, upload a logo, whether through uploading or from the media library.
Add all the other logos to the rest of Tableberg cells.
Step 03: Stylize the Cells
Now, go to il styles tab while keeping the entire table selected. You may change the background color individually for all rows and cells. But as we don’t need for the tutorial, we are leaving this option.
Come to il Cell Spacing section by scrolling down the tab. Using option under this section, you can add spaces between the logo columns both vertically and horizontally.
Come to Table Border. From the Inner Border section, you can change the color and radius of the border.
Thus, you can give an aesthetic view to the logo columns.
Conclusione
Tableberg is an exciting multipurpose plugin by which you can create numerous stunning designs for your website. Before exiting, you can explore some more tutorial posts on the plugin.
