{"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-adicionar-icones-as-tabelas-do-wordpress","status":"publish","type":"docs","link":"https:\/\/tableberg.com\/pt\/docs\/how-to-add-icons-to-wordpress-tables\/","title":{"rendered":"Bloco de \u00edcones"},"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=\"Como adicionar \u00edcones a uma tabela no WordPress com o 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>Os \u00edcones s\u00e3o alguns elementos gr\u00e1ficos usados para complementar o conte\u00fado textual. Eles ajudam na compreens\u00e3o e na navega\u00e7\u00e3o r\u00e1pidas. Com eles, voc\u00ea pode chamar a aten\u00e7\u00e3o dos leitores para uma notifica\u00e7\u00e3o, destacar pontos importantes, indicar a\u00e7\u00f5es importantes, entre outros.<\/p>\n\n\n\n<p>Com o <a href=\"https:\/\/wordpress.org\/plugins\/tableberg\/\" target=\"_blank\" rel=\"noopener nofollow\" title=\"MesaBerg\">MesaBerg<\/a> voc\u00ea pode adicionar facilmente uma boa cole\u00e7\u00e3o de \u00edcones \u00e0s suas tabelas do WordPress. Esta postagem mostrar\u00e1 a voc\u00ea como fazer isso. Ent\u00e3o, vamos come\u00e7ar a discuss\u00e3o sobre como adicionar \u00edcones \u00e0s tabelas do WordPress.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Etapa 01: Localizar e adicionar o bloco de \u00edcones \u00e0 tabela<\/h2>\n\n\n\n<p>Coloque o cursor na c\u00e9lula onde deseja adicionar o bloco. Em seguida, como em qualquer bloco do Gutenberg, localize a tag <strong>Bloco de \u00edcones<\/strong> e adicione-o \u00e0 c\u00e9lula pressionando a tecla <strong>bot\u00e3o de adi\u00e7\u00e3o (+)<\/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=\"Localizar e adicionar o bloco de \u00edcones \u00e0 tabela\" 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>Voc\u00ea pode ver que o bloco Icon foi adicionado \u00e0 tabela.<\/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=\"O bloco de \u00edcones \u00e9 adicionado\" 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\">Etapa 02: Configurar as defini\u00e7\u00f5es do bloco de \u00edcones<\/h2>\n\n\n\n<p>Voc\u00ea pode exibir esse \u00edcone como um par\u00e1grafo ou um caractere do <strong>Op\u00e7\u00e3o Behave As<\/strong> sob o <strong>guia de configura\u00e7\u00f5es<\/strong>.<\/p>\n\n\n\n<p>Em seguida, voc\u00ea pode aumentar o <strong>Tamanho do \u00edcone<\/strong> e <strong>Rota\u00e7\u00e3o<\/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\">Etapa 03: Alterar o \u00edcone na biblioteca de \u00edcones<\/h2>\n\n\n\n<p>Role a p\u00e1gina um pouco para baixo. Voc\u00ea ver\u00e1 o <strong>Op\u00e7\u00e3o de \u00edcone<\/strong> de onde voc\u00ea pode alterar o \u00edcone padr\u00e3o para o que preferir.<\/p>\n\n\n\n<p>Voc\u00ea pode selecionar \u00edcones da biblioteca ou importar via 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=\"Alterar o \u00edcone na biblioteca de \u00edcones\" 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\">Etapa 04: Estilizar o bloco de \u00edcones<\/h2>\n\n\n\n<p>Quando as configura\u00e7\u00f5es estiverem conclu\u00eddas, v\u00e1 para a se\u00e7\u00e3o <strong>Guia Estilos<\/strong>. Voc\u00ea pode personalizar o <strong>cor do \u00edcone, cor do hover, dimens\u00f5es, marinho, borda,<\/strong> e <strong>raio<\/strong> do bloco.<\/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 o bloco de \u00edcones\" 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>Voc\u00ea pode ver que aplicamos estiliza\u00e7\u00f5es ao bloco.<\/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=\"Estiliza\u00e7\u00f5es aplicadas ao bloco de \u00edcones\" 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>Com o bloco de \u00edcones, voc\u00ea pode transmitir informa\u00e7\u00f5es complexas com efici\u00eancia, facilitar a navega\u00e7\u00e3o e criar tabelas visualmente atraentes que cativam e informam os visitantes.<\/p>\n\n\n\n<p>Antes de encerrar este artigo, voc\u00ea pode consultar esta documenta\u00e7\u00e3o em <a href=\"https:\/\/tableberg.com\/pt\/documentos\/tableberg-one\/tableberg\/como-adicionar-listas-com-estilo-em-tabelas-do-wordpress\/\" target=\"_blank\" rel=\"noopener\" title=\"como adicionar listas estilizadas a tabelas do WordPress\">como adicionar listas estilizadas a tabelas do 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\/pt\/author\/wpx_irayhan\/"},"doc_category_info":[{"term_name":"Sub-Blocks","term_url":"https:\/\/tableberg.com\/pt\/docs-category\/sub-blocks\/"}],"doc_tag_info":[{"term_name":"Icon Block","term_url":"https:\/\/tableberg.com\/pt\/docs-tag\/icon-block\/"},{"term_name":"List Block","term_url":"https:\/\/tableberg.com\/pt\/docs-tag\/list-block\/"},{"term_name":"Table Borders","term_url":"https:\/\/tableberg.com\/pt\/docs-tag\/table-borders\/"}],"_links":{"self":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/docs\/1353","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/comments?post=1353"}],"version-history":[{"count":4,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/docs\/1353\/revisions"}],"predecessor-version":[{"id":9877,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/docs\/1353\/revisions\/9877"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/media?parent=1353"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/doc_category?post=1353"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/doc_tag?post=1353"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}