An icon list is a collection of visual elements displayed in a listicle format. They are used in various contexts to enhance the visual appeal and readability of your blog posts and page content.
Icon lists are mostly used to showcase products’ features, key points, benefits, etc., in a listical format. They break down the large content into small and scannable pieces so readers can understand them quickly and easily.
In this blog post, we’ll show you two easy methods how to add icon list in WordPress. Be with us till the end.
Cree bonitas mesas
Con el editor de bloques
Método 1: Utilizar bloques Ultimate
Ultimate Block es un plugin de bloques Gutenberg con más de 25 bloques personalizados. La 'Lista con estilo' es un bloque prominente entre ellos. Aquí, le mostraremos cómo utilizar este bloque.
Paso 1: Instalar el plugin Ultimate Blocks
Ir a Plugins > Añadir nuevo plugin desde el panel de control de WordPress. Encuentra el plugin escribiendo Ultimate Blocks en el cuadro de búsqueda. Instale y activar el plugin después de que aparezca a continuación.
Paso 2: Añadir el bloque de lista estilizada al editor
Like any Gutenberg block, haga clic en el botón más (+) y type Styled List in the search box. When the block appears, add it to the editor.
Paso 3: Añadir elementos al bloque de lista con estilo
You can see that the Styled List block is added to the editor. Now, it’s time to add items to the list. You may list the features of your product.
We have added some dummy text to the styled list block.
Paso 4: Seleccionar el icono para el bloque de lista estilizada
Select the entire Styled List block. You will see the default Tick icon under the Settings tab. Click on the Tick Icon.
A box, including a collection of icons, will open up. Select the icon you want. The icon will be applied over the entire styled list block.
Paso 5: Personalizar el bloque de lista con estilo
Under the settings tab, you’ll find several more options by which you can customize the block. They are:
Icon size – Increase or decrease the icon size.
Number of columns – Showcase listicle block in multiple columns.
Number of columns in mobile – Showcase listicle block in multiple columns in mobile.
Item spacing (pixels) – Increase or decrease the space between the listicle items.
Step 06: Stylize the Styled List Block
Next, come to the Styles tab. You can change the icon color, list text color, and list background color from this tab.
After that, you can add padding and margin to give a block your desired layout.
Thus, you can create an icon list using the Ultimate Blocks plugin.
Método 2: Utilizar Tableberg
You may often want to add icon lists to your WordPress tables. But the default table block doesn’t allow you to do this. So, install the Tableberg plugin. You can create comprehensive and multipurpose tables for your site using it.
Paso 1: Instalar el plugin TableBerg
Instale y activar el plugin Tableberg en su sitio.
The process of creating tables with the plugin is almost the same as the default table block. Follow this guide to learn how to create tables with TableBerg.
Nota: La versión gratuita de Tableberg viene con un Bloque de lista. Para utilizar el Bloque Lista estilizadanecesita obtener el versión pro de Tableberg.
Paso 2: Añadir el bloque de lista estilizada a la tabla
Select the cell to which you want to add the icon list. Once the cell is selected, you’ll see the plus (+) icon.
Click the plus (+) icon. Find and add the Styled List block a la célula.
The Styled List block will instantly be added to the table.
Paso 3: Añadir elementos al bloque de lista estilizada de la tabla
Add as many items as you want to the table.
Step 04: Set an Icon for the Styled List Block
Select the entire Styled List block. Go to the Ficha Configuración en la barra lateral derecha. Click the Tick icon under the Icon Settings option.
A pop-up will open up with a collection of icons. Select the icon you like.
The selected icon will be applied to the entire Styled List block.
Paso 5: Personalizar el bloque de lista con estilo
Under the Icon Settings option, you find ways to customize the icon size and icon spacing.
Step 06: Stylize the Styled List Block
Go to the Styles tab. You can change the icon color, text color, background color, and padding for the block.
Thus, you can add and create icon lists on WordPress tables.
Conclusión
Icon lists in WordPress not only help convey key information to users but also improve the navigation and aesthetics of your content. While customizing the block, you must keep the brand consistency, readability score, and content hierarchy in mind.
Sólo si hay una combinación de todas estas cosas su lista de iconos cobrará vida para los usuarios. Eso es todo por hoy.
Lea también:
