{"id":1183,"date":"2024-04-30T17:24:06","date_gmt":"2024-04-30T17:24:06","guid":{"rendered":"https:\/\/tableberg.com\/?post_type=docs&#038;p=1183"},"modified":"2025-06-16T09:47:47","modified_gmt":"2025-06-16T09:47:47","password":"","slug":"como-adicionar-botoes-as-tabelas-do-wordpress","status":"publish","type":"docs","link":"https:\/\/tableberg.com\/pt\/docs\/how-to-add-buttons-to-wordpress-tables\/","title":{"rendered":"Bloco de bot\u00f5es"},"content":{"rendered":"<p>Os bot\u00f5es s\u00e3o um poderoso elemento da Web que pode levar os usu\u00e1rios a realizar v\u00e1rias a\u00e7\u00f5es. Ao adicionar bot\u00f5es \u00e0s tabelas, voc\u00ea pode motivar os usu\u00e1rios a explorar e comprar seus produtos.<\/p>\n\n\n\n<p><a href=\"https:\/\/wordpress.org\/plugins\/tableberg\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">MesaBerg<\/a> \u00e9 um maravilhoso plug-in de cria\u00e7\u00e3o de tabelas com o qual voc\u00ea pode criar e adicionar bot\u00f5es \u00e0s suas tabelas. Vamos dar uma olhada em como adicionar bot\u00f5es \u00e0s tabelas do WordPress<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Etapa 01: Selecione a c\u00e9lula onde voc\u00ea deseja adicionar o bot\u00e3o<\/h2>\n\n\n\n<p>Selecione a c\u00e9lula onde deseja adicionar um bot\u00e3o colocando o cursor sobre ela.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"653\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Select-the-Cell-Where-You-Want-to-Add-the-Button.webp\" alt=\"Selecione a c\u00e9lula onde voc\u00ea deseja adicionar o bot\u00e3o\" class=\"wp-image-1184\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Select-the-Cell-Where-You-Want-to-Add-the-Button.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Select-the-Cell-Where-You-Want-to-Add-the-Button-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Select-the-Cell-Where-You-Want-to-Add-the-Button-1024x522.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Select-the-Cell-Where-You-Want-to-Add-the-Button-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Etapa 02: Adicionar o bloco de bot\u00f5es \u00e0 tabela<\/h2>\n\n\n\n<p>Clique no \u00edcone do Gutenberg <strong>\u00edcone de mais (+)<\/strong>. Voc\u00ea ver\u00e1 o <strong>Bloco de bot\u00f5es<\/strong>. <\/p>\n\n\n\n<p><strong>Adicione-o \u00e0 tabela<\/strong> clicando nele.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"653\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-the-Button-Block-to-the-Table.webp\" alt=\"Adicionar o bloco de bot\u00f5es \u00e0 tabela\" class=\"wp-image-1185\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-the-Button-Block-to-the-Table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-the-Button-Block-to-the-Table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-the-Button-Block-to-the-Table-1024x522.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-the-Button-Block-to-the-Table-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Etapa 03: Adicione uma c\u00f3pia da CTA ao bot\u00e3o<\/h2>\n\n\n\n<p>Um texto de CTA \u00e9 obrigat\u00f3rio para todos os bot\u00f5es. <strong>Adicione sua c\u00f3pia da CTA<\/strong> para o bot\u00e3o.<\/p>\n\n\n\n<p>Voc\u00ea pode alterar a posi\u00e7\u00e3o do bot\u00e3o usando a op\u00e7\u00e3o Alignment (Alinhamento) na barra de ferramentas. Em seguida, voc\u00ea pode aumentar sua largura nas configura\u00e7\u00f5es de Largura na barra lateral direita.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"653\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-a-CTA-Copy-to-the-Button.webp\" alt=\"Adicionar uma c\u00f3pia de CTA ao bot\u00e3o\" class=\"wp-image-1186\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-a-CTA-Copy-to-the-Button.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-a-CTA-Copy-to-the-Button-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-a-CTA-Copy-to-the-Button-1024x522.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-a-CTA-Copy-to-the-Button-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Etapa 04: Estilizar o bot\u00e3o<\/h2>\n\n\n\n<p>Venha para o <strong>Guia Estilos<\/strong>. A partir daqui, voc\u00ea pode alterar a cor do texto do bot\u00e3o, a cor do plano de fundo, a cor do mouse, a tipografia e as dimens\u00f5es. Espero que voc\u00ea mesmo possa fazer as altera\u00e7\u00f5es.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"653\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Stylize-the-Button.webp\" alt=\"Estilizar o bot\u00e3o\" class=\"wp-image-1187\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Stylize-the-Button.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Stylize-the-Button-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Stylize-the-Button-1024x522.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Stylize-the-Button-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Etapa 05: Adicionar um link de destino ao bot\u00e3o<\/h2>\n\n\n\n<p>Clique no bot\u00e3o <strong>Op\u00e7\u00e3o de link<\/strong> na barra de ferramentas. Isso abrir\u00e1 uma caixa na qual voc\u00ea poder\u00e1 adicionar um link de destino. Copie e cole o link da postagem ou p\u00e1gina desejada na caixa.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"653\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-a-Destination-Link-to-the-Button.webp\" alt=\"Adicionar um link de destino ao bot\u00e3o\" class=\"wp-image-1188\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-a-Destination-Link-to-the-Button.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-a-Destination-Link-to-the-Button-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-a-Destination-Link-to-the-Button-1024x522.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Add-a-Destination-Link-to-the-Button-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Assim, voc\u00ea pode adicionar bot\u00f5es de CTA \u00e0s suas tabelas do WordPress. Para saber mais, explore este post sobre <a href=\"https:\/\/tableberg.com\/pt\/como-adicionar-o-botao-comprar-na-amazon-no-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">Como adicionar bot\u00f5es \"Comprar na Amazon\" em uma tabela do WordPress<\/a>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Tutorial em v\u00eddeo<\/h3>\n\n\n\n<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 bot\u00f5es a uma tabela no WordPress com o Tableberg\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/3ZJ4RrEwdKE?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>","protected":false},"excerpt":{"rendered":"<p>Buttons are a powerful web element that can trigger users to complete various actions. By adding buttons to tables, you can motivate users to explore and buy your products. TableBerg is a wonderful table-builder plugin by which you can create and add buttons to your tables. Let&#8217;s have a tour on how to add buttons [&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":[63],"class_list":["post-1183","docs","type-docs","status-publish","hentry","doc_category-sub-blocks","doc_tag-table-buttons"],"year_month":"2026-04","word_count":272,"total_views":0,"reactions":{"happy":0,"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":"Table Buttons","term_url":"https:\/\/tableberg.com\/pt\/docs-tag\/table-buttons\/"}],"_links":{"self":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/docs\/1183","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=1183"}],"version-history":[{"count":3,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/docs\/1183\/revisions"}],"predecessor-version":[{"id":9745,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/docs\/1183\/revisions\/9745"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/media?parent=1183"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/doc_category?post=1183"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/doc_tag?post=1183"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}