{"id":1353,"date":"2024-05-12T02:50:37","date_gmt":"2024-05-12T02:50:37","guid":{"rendered":"https:\/\/tableberg.com\/?post_type=docs&#038;p=1353"},"modified":"2025-06-29T15:44:46","modified_gmt":"2025-06-29T15:44:46","password":"","slug":"como-anadir-iconos-a-las-tablas-de-wordpress","status":"publish","type":"docs","link":"https:\/\/tableberg.com\/es\/docs\/how-to-add-icons-to-wordpress-tables\/","title":{"rendered":"Bloque de iconos"},"content":{"rendered":"<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"A\u00f1adir iconos a una tabla en WordPress con Tableberg\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/obP04Z5ILxs?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p>Los iconos son unos elementos gr\u00e1ficos que se utilizan en contenidos textuales complementarios. Ayudan a una r\u00e1pida comprensi\u00f3n y navegaci\u00f3n. Con ellos puede llamar la atenci\u00f3n de los lectores sobre una notificaci\u00f3n, destacar puntos importantes, se\u00f1alar acciones importantes, etc.<\/p>\n\n\n\n<p>Con el <a href=\"https:\/\/wordpress.org\/plugins\/tableberg\/\" target=\"_blank\" rel=\"noopener nofollow\" title=\"TableBerg\">TableBerg<\/a> puedes a\u00f1adir f\u00e1cilmente una buena colecci\u00f3n de iconos a tus tablas de WordPress. Este post le mostrar\u00e1 c\u00f3mo hacerlo. Por lo tanto, vamos a entrar en la discusi\u00f3n de c\u00f3mo agregar iconos a las tablas de WordPress.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Paso 01: Buscar y a\u00f1adir el bloque de iconos a la tabla<\/h2>\n\n\n\n<p>Coloque el cursor en la celda en la que desea a\u00f1adir el bloque. A continuaci\u00f3n, como con cualquier bloque Gutenberg, busque el bot\u00f3n <strong>Bloque de iconos<\/strong> y a\u00f1\u00e1dalo a la celda pulsando la tecla <strong>Bot\u00f3n m\u00e1s (+)<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"523\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Find-and-Add-the-Icon-Block-to-the-Table-1024x523.webp\" alt=\"Buscar y a\u00f1adir el bloque de iconos a la tabla\" class=\"wp-image-1354\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Find-and-Add-the-Icon-Block-to-the-Table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Find-and-Add-the-Icon-Block-to-the-Table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Find-and-Add-the-Icon-Block-to-the-Table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Find-and-Add-the-Icon-Block-to-the-Table.webp 1280w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Puede ver que el bloque Icono se ha a\u00f1adido a la tabla.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-Icon-block-is-added.webp\" alt=\"Se a\u00f1ade el bloque Icono\" class=\"wp-image-1355\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-Icon-block-is-added.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-Icon-block-is-added-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-Icon-block-is-added-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-Icon-block-is-added-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Paso 02: Configurar los ajustes del bloque de iconos<\/h2>\n\n\n\n<p>Puede mostrar este icono como un p\u00e1rrafo o un car\u00e1cter del <strong>Opci\u00f3n Comportarse como<\/strong> bajo el <strong>pesta\u00f1a de configuraci\u00f3n<\/strong>.<\/p>\n\n\n\n<p>A continuaci\u00f3n, puede aumentar el <strong>Tama\u00f1o del icono<\/strong> y <strong>Rotaci\u00f3n<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"523\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-Settings-of-the-Icon-Block-1024x523.webp\" alt=\"\" class=\"wp-image-1356\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-Settings-of-the-Icon-Block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-Settings-of-the-Icon-Block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-Settings-of-the-Icon-Block-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-Settings-of-the-Icon-Block.webp 1280w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Paso 03: Cambiar el icono de la biblioteca de iconos<\/h2>\n\n\n\n<p>Baja un poco por la p\u00e1gina. Obtendr\u00e1 el <strong>Opci\u00f3n de icono<\/strong> desde donde puedes cambiar el icono por defecto por el que m\u00e1s te guste.<\/p>\n\n\n\n<p>Puede seleccionar iconos de la biblioteca o importarlos a trav\u00e9s de una URL.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Change-the-Icon-from-the-Icon-Library.webp\" alt=\"Cambiar el icono de la biblioteca de iconos\" class=\"wp-image-1357\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Change-the-Icon-from-the-Icon-Library.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Change-the-Icon-from-the-Icon-Library-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Change-the-Icon-from-the-Icon-Library-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Change-the-Icon-from-the-Icon-Library-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Paso 04: Estilizar el bloque de iconos<\/h2>\n\n\n\n<p>Una vez realizados los ajustes, vaya a la <strong>Ficha Estilos<\/strong>. Puede personalizar el <strong>color del icono, color hover, dimensiones, marino, borde,<\/strong> y <strong>radio<\/strong> del bloque.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylize-the-Icon-Block.webp\" alt=\"Estilizar el bloque de iconos\" class=\"wp-image-1358\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylize-the-Icon-Block.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylize-the-Icon-Block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylize-the-Icon-Block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylize-the-Icon-Block-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Podemos haber aplicado estilizaciones al bloque.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylizations-applied-to-the-Icon-block.webp\" alt=\"Estilizaciones aplicadas al bloque Icono\" class=\"wp-image-1359\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylizations-applied-to-the-Icon-block.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylizations-applied-to-the-Icon-block-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylizations-applied-to-the-Icon-block-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylizations-applied-to-the-Icon-block-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Con el bloque Icono, puede transmitir informaci\u00f3n compleja con eficacia, facilitar la navegaci\u00f3n y crear tablas visualmente atractivas que cautiven e informen a los visitantes.<\/p>\n\n\n\n<p>Antes de cerrar este art\u00edculo, puedes consultar esta documentaci\u00f3n en <a href=\"https:\/\/tableberg.com\/es\/docs\/tableberg-one\/tableberg\/como-anadir-listas-con-estilo-en-las-tablas-de-wordpress\/\" target=\"_blank\" rel=\"noopener\" title=\"c\u00f3mo a\u00f1adir listas con estilo a las tablas de WordPress\">c\u00f3mo a\u00f1adir listas con estilo a las tablas de WordPress<\/a>.<\/p>","protected":false},"excerpt":{"rendered":"<p>Icons are some graphical elements that are used in complementary textual content. They aid in quick comprehension and navigation. Using them, you can draw readers&#8217; attention to a notification, highlight important points, signify important actions, and others. With the TableBerg plugin, you can easily add a good collection of icons to your WordPress tables. This [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"_eb_attr":"","footnotes":""},"doc_category":[94],"doc_tag":[78,46,54],"class_list":["post-1353","docs","type-docs","status-publish","hentry","doc_category-sub-blocks","doc_tag-icon-block","doc_tag-list-block","doc_tag-table-borders"],"year_month":"2026-04","word_count":298,"total_views":"0","reactions":{"happy":"1","normal":"0","sad":"0"},"author_info":{"name":"Istiak Rayhan","author_nicename":"wpx_irayhan","author_url":"https:\/\/tableberg.com\/es\/author\/wpx_irayhan\/"},"doc_category_info":[{"term_name":"Sub-Blocks","term_url":"https:\/\/tableberg.com\/es\/docs-category\/sub-blocks\/"}],"doc_tag_info":[{"term_name":"Icon Block","term_url":"https:\/\/tableberg.com\/es\/docs-tag\/icon-block\/"},{"term_name":"List Block","term_url":"https:\/\/tableberg.com\/es\/docs-tag\/list-block\/"},{"term_name":"Table Borders","term_url":"https:\/\/tableberg.com\/es\/docs-tag\/table-borders\/"}],"_links":{"self":[{"href":"https:\/\/tableberg.com\/es\/wp-json\/wp\/v2\/docs\/1353","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tableberg.com\/es\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/tableberg.com\/es\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/tableberg.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tableberg.com\/es\/wp-json\/wp\/v2\/comments?post=1353"}],"version-history":[{"count":4,"href":"https:\/\/tableberg.com\/es\/wp-json\/wp\/v2\/docs\/1353\/revisions"}],"predecessor-version":[{"id":9877,"href":"https:\/\/tableberg.com\/es\/wp-json\/wp\/v2\/docs\/1353\/revisions\/9877"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/es\/wp-json\/wp\/v2\/media?parent=1353"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/tableberg.com\/es\/wp-json\/wp\/v2\/doc_category?post=1353"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/tableberg.com\/es\/wp-json\/wp\/v2\/doc_tag?post=1353"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}