{"id":16494,"date":"2019-07-03T16:41:55","date_gmt":"2019-07-03T19:41:55","guid":{"rendered":"https:\/\/blog.hostinger.io\/br-tutoriais\/?p=16494"},"modified":"2026-03-19T17:00:16","modified_gmt":"2026-03-19T20:00:16","slug":"plugin-botao-wordpress","status":"publish","type":"post","link":"\/br\/tutoriais\/plugin-botao-wordpress\/","title":{"rendered":"Como adicionar um plugin de bot\u00e3o WordPress para seu site"},"content":{"rendered":"<p class=\"wp-block-paragraph\">Os plugins de bot&otilde;es do WordPress permitem adicionar facilmente bot&otilde;es personalizados ao seu site por meio de shortcodes, sem precisar escrever o c&oacute;digo CSS do zero. Esses trechos de c&oacute;digo s&atilde;o f&aacute;ceis de criar, reutilizar e personalizar, tornando-os o m&eacute;todo preferido para adicionar esses elementos interativos.<\/p><p class=\"wp-block-paragraph\">A maneira mais f&aacute;cil de criar e adicionar shortcodes do WordPress ao seu site &eacute; usar um plugin como o <strong>MaxButtons<\/strong>. Ap&oacute;s a instala&ccedil;&atilde;o, basta:<\/p><ol class=\"wp-block-list\">\n<li>Abra o menu de cria&ccedil;&atilde;o de bot&otilde;es do MaxButtons no painel de administra&ccedil;&atilde;o do WordPress.<\/li>\n\n\n\n<li>Crie um novo bot&atilde;o e configure seu comportamento. <\/li>\n\n\n\n<li>Edite a publica&ccedil;&atilde;o onde deseja inserir o bot&atilde;o.<\/li>\n\n\n\n<li>Insira o bot&atilde;o usando o bloco MaxButtons ou manualmente usando um c&oacute;digo curto.<\/li>\n<\/ol><p class=\"wp-block-paragraph\">Se voc&ecirc; n&atilde;o quiser usar um shortcode, pode adicionar bot&otilde;es usando plugins como o <strong>Ultimate Blocks<\/strong>, que oferece um recurso de personaliza&ccedil;&atilde;o de design integrado ao editor do WordPress. No <strong>WordPress 5.4<\/strong> ou posterior, voc&ecirc; tamb&eacute;m pode fazer isso com o bloco de <strong>bot&otilde;es<\/strong> padr&atilde;o.<\/p><p class=\"wp-block-paragraph\">Antes de nos aprofundarmos no assunto, explore o que s&atilde;o os shortcodes de bot&otilde;es do WordPress e como adicion&aacute;-los ao seu site usando um plugin. Em seguida, aprenda sobre m&eacute;todos alternativos para que voc&ecirc; possa determinar se eles s&atilde;o mais adequados para os seus casos de uso.<\/p><p>\n\n\n\n\n\n\n<\/p><h2 class=\"wp-block-heading\" id=\"h-what-are-wordpress-button-shortcodes\">O que s&atilde;o shortcodes de bot&otilde;es do WordPress?<\/h2><p class=\"wp-block-paragraph\">Os shortcodes de bot&otilde;es do WordPress s&atilde;o pequenos trechos de c&oacute;digo que permitem incluir facilmente elementos interativos, como bot&otilde;es de chamada para a&ccedil;&atilde;o, em sua p&aacute;gina da web. Eles s&atilde;o &uacute;teis por alguns motivos:<\/p><ul class=\"wp-block-list\">\n<li><strong><\/strong>Facilidade no uso. Inserir bot&otilde;es no seu site usando shortcodes &eacute; f&aacute;cil, pois voc&ecirc; s&oacute; precisa escrever um pequeno trecho de c&oacute;digo no editor de posts, sem precisar escrever CSS ou JavaScript personalizados.<\/li>\n\n\n\n<li><strong>Personaliza&ccedil;&atilde;o.<\/strong> Voc&ecirc; pode personalizar v&aacute;rios aspectos dos seus bot&otilde;es de c&oacute;digo curto, incluindo tamanho, cor, formato e URL de destino.<\/li>\n\n\n\n<li><strong>Consist&ecirc;ncia<\/strong> <strong>e reutiliza&ccedil;&atilde;o<\/strong>. Depois de <a href=\"\/br\/tutoriais\/criar-shortcode-wordpress\/\">criar um c&oacute;digo curto (shortcode)<\/a> para um bot&atilde;o no WordPress, voc&ecirc; pode inseri-lo em v&aacute;rias p&aacute;ginas e manter o mesmo design sempre. <\/li>\n<\/ul><p class=\"wp-block-paragraph\">A <a href=\"\/br\/tutoriais\/o-que-e-wordpress\/\">plataforma WordPress<\/a> oferece diferentes maneiras de criar c&oacute;digos curtos para bot&otilde;es, incluindo a possibilidade de escrev&ecirc;-los do zero. Neste tutorial, vamos configur&aacute;-lo usando um plugin, pois &eacute; o m&eacute;todo mais f&aacute;cil e simplifica o gerenciamento de shortcodes no futuro. <\/p><h2 class=\"wp-block-heading\" id=\"h-how-to-create-a-button-shortcode-in-wordpress\">Como criar um shortcode de bot&atilde;o no WordPress<\/h2><p class=\"wp-block-paragraph\">Para configurar um shortcode de bot&atilde;o no WordPress, basta <a href=\"\/br\/tutoriais\/como-instalar-plugins-wordpress\/\">instalar o plugin necess&aacute;rio<\/a> e seguir o procedimento. No entanto, dependendo do plugin, os passos para criar um shortcode podem variar. Portanto, consulte os manuais para aprender sobre o processo em si. <\/p><p class=\"wp-block-paragraph\">Neste artigo, mostraremos como criar um shortcode de bot&atilde;o com o <a href=\"https:\/\/wordpress.org\/plugins\/maxbuttons\/\" target=\"_blank\" rel=\"noreferrer noopener\">MaxButtons<\/a>, j&aacute; que ele &eacute; um dos plugins mais populares e simples para essa tarefa. Eis como fazer:<\/p><ol class=\"wp-block-list\">\n<li>Abra o <strong>painel de administra&ccedil;&atilde;o do WordPress<\/strong>. Acesse a <strong>barra lateral<\/strong> e clique em <strong>MaxButtons<\/strong>.<\/li>\n\n\n\n<li>Clique em <strong>Adicionar novo<\/strong>, o que o redirecionar&aacute; para o menu de cria&ccedil;&atilde;o do c&oacute;digo curto do bot&atilde;o.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a6fe4e001c53\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a6fe4e001c53\" class=\"aligncenter size-large wp-lightbox-container\"><img decoding=\"async\" width=\"1024\" height=\"341\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/a-pagina-do-plugin-maxbuttons-adicionar-novo-botao.png\/w=1024,h=1024,fit=scale-down\" alt=\"Bot&atilde;o Adicionar Novo do plugin MaxButton\" class=\"wp-image-53627\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/a-pagina-do-plugin-maxbuttons-adicionar-novo-botao.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/a-pagina-do-plugin-maxbuttons-adicionar-novo-botao.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/a-pagina-do-plugin-maxbuttons-adicionar-novo-botao.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/a-pagina-do-plugin-maxbuttons-adicionar-novo-botao.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><ol start=\"3\" class=\"wp-block-list\">\n<li>Na se&ccedil;&atilde;o <strong>&ldquo;No&ccedil;&otilde;es b&aacute;sicas&rdquo;<\/strong>, configure as defini&ccedil;&otilde;es essenciais do seu bot&atilde;o. Por exemplo, defina o <strong>nome<\/strong> do bot&atilde;o, o <strong>URL<\/strong>, a <strong>fonte<\/strong>, o <strong>espa&ccedil;amento interno<\/strong> e muito mais.<\/li>\n\n\n\n<li>Deslize a tela para baixo at&eacute; as pr&oacute;ximas <span style=\"margin: 0px;padding: 0px\"><strong>se&ccedil;&otilde;es para personalizar a borda<\/strong>, <strong>o fundo<\/strong>, <\/span> <strong>a sombra do texto<\/strong> e o <strong>cont&ecirc;iner<\/strong> <span style=\"margin: 0px;padding: 0px\">, refinando ainda mais o estilo do seu bot&atilde;o<\/span>. Voc&ecirc; pode visualizar como o bot&atilde;o ficar&aacute; no canto superior direito da tela.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a6fe4e002650\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a6fe4e002650\" class=\"aligncenter size-large wp-lightbox-container\"><img decoding=\"async\" width=\"1024\" height=\"485\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/maxbuttons-button-creation-menu.png\/w=1024,h=1024,fit=scale-down\" alt=\"P&aacute;gina de cria&ccedil;&atilde;o de bot&otilde;es do plugin MaxButtons\" class=\"wp-image-53628\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/maxbuttons-button-creation-menu.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/maxbuttons-button-creation-menu.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/maxbuttons-button-creation-menu.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/maxbuttons-button-creation-menu.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><ol start=\"5\" class=\"wp-block-list\">\n<li>Acesse a se&ccedil;&atilde;o <strong>Avan&ccedil;ado<\/strong> e ajuste outras configura&ccedil;&otilde;es opcionais.<\/li>\n\n\n\n<li>Ap&oacute;s concluir o design do bot&atilde;o, clique em <strong>Salvar<\/strong>. <\/li>\n<\/ol><p class=\"wp-block-paragraph\">Para verificar os bot&otilde;es criados anteriormente, acesse a <strong>barra lateral do WordPress<\/strong> &rarr; <strong>MaxButtons<\/strong> &rarr; <strong>Bot&otilde;es<\/strong>. Aqui voc&ecirc; encontra todos os bot&otilde;es existentes com op&ccedil;&otilde;es para gerenci&aacute;-los, al&eacute;m de seus <strong>IDs<\/strong> e <strong>nomes<\/strong>. <\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a6fe4e003037\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a6fe4e003037\" class=\"aligncenter size-large wp-lightbox-container\"><img decoding=\"async\" width=\"1024\" height=\"468\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/button-shortcode-list-on-maxbuttons-buttons-menu-1.png\/w=1024,h=1024,fit=scale-down\" alt=\"A lista de bot&otilde;es existentes no menu Bot&otilde;es do MaxButtons\" class=\"wp-image-53629\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/button-shortcode-list-on-maxbuttons-buttons-menu-1.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/button-shortcode-list-on-maxbuttons-buttons-menu-1.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/button-shortcode-list-on-maxbuttons-buttons-menu-1.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/button-shortcode-list-on-maxbuttons-buttons-menu-1.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Assim que o bot&atilde;o estiver pronto, adicione-o &agrave; sua p&aacute;gina web. Eis como fazer:<\/p><ol class=\"wp-block-list\">\n<li>Acesse a <strong>barra lateral<\/strong> do painel de administra&ccedil;&atilde;o do WordPress &rarr; <strong>Posts<\/strong> &rarr; <strong>Todos os Posts<\/strong>. <\/li>\n\n\n\n<li>Clique em<strong> Editar <\/strong>na p&aacute;gina em que deseja inserir o bot&atilde;o. <\/li>\n\n\n\n<li>Clique no &iacute;cone <strong>+<\/strong> para adicionar um novo bloco e selecione o bloco <strong>MaxButtons<\/strong>.<\/li>\n\n\n\n<li>Navegue at&eacute; o <strong>painel de configura&ccedil;&atilde;o de blocos<\/strong> no lado direito da tela e clique no bot&atilde;o <strong>Selecionar<\/strong>.<\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a6fe4e003969\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a6fe4e003969\" class=\"aligncenter size-large wp-lightbox-container\"><img decoding=\"async\" width=\"455\" height=\"1024\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/o-painel-de-configuracao-do-bloco-maxbuttons-1.png\/w=1024,h=1024,fit=scale-down\" alt=\"Painel de configura&ccedil;&atilde;o do bloco MaxButtons\" class=\"wp-image-53630\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/o-painel-de-configuracao-do-bloco-maxbuttons-1.png\/w=455,fit=scale-down 455w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/o-painel-de-configuracao-do-bloco-maxbuttons-1.png\/w=133,fit=scale-down 133w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/o-painel-de-configuracao-do-bloco-maxbuttons-1.png\/w=67,fit=scale-down 67w\" sizes=\"(max-width: 455px) 100vw, 455px\" \/><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><ol start=\"5\" class=\"wp-block-list\">\n<li>Selecione o bot&atilde;o que deseja inserir e clique em <strong>Inserir bot&atilde;o no editor<\/strong>. <\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a6fe4e00419c\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a6fe4e00419c\" class=\"aligncenter size-large wp-lightbox-container\"><img decoding=\"async\" width=\"1024\" height=\"418\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/maxbutton-block-button-insertion-menu.png\/w=1024,h=1024,fit=scale-down\" alt=\"Menu de inser&ccedil;&atilde;o de bot&otilde;es do bloco MaxButtons\" class=\"wp-image-53631\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/maxbutton-block-button-insertion-menu.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/maxbutton-block-button-insertion-menu.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/maxbutton-block-button-insertion-menu.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/maxbutton-block-button-insertion-menu.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">O bot&atilde;o aparecer&aacute; no seu editor. Ao inserir um bot&atilde;o, voc&ecirc; pode sobrescrever sua configura&ccedil;&atilde;o ajustando as defini&ccedil;&otilde;es no painel de configura&ccedil;&atilde;o do bloco. Por exemplo, voc&ecirc; pode alterar o texto, o URL e configurar para que o link seja aberto em uma nova aba.<\/p><p class=\"wp-block-paragraph\">Se voc&ecirc; usa o Editor Cl&aacute;ssico do WordPress, os passos para inserir um bot&atilde;o s&atilde;o semelhantes. <span style=\"margin: 0px;padding: 0px\">A diferen&ccedil;a &eacute; que voc&ecirc; adiciona um bot&atilde;o clicando no bot&atilde;o <strong>&ldquo;Adicionar bloco&rdquo;<\/strong> em vez de usar um bloco e sobrescrever as configura&ccedil;&otilde;es <strong>antes<\/strong> da inser&ccedil;&atilde;o.<\/span> <\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a6fe4e00455b\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a6fe4e00455b\" class=\"aligncenter wp-lightbox-container\"><img decoding=\"async\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"\/br\/tutoriais\/wp-content\/uploads\/sites\/53\/2026\/03\/adicionar-botoes-ao-wordpress-com-maxbuttons.png\" alt=\"Adicione bot&otilde;es ao WordPress usando o MaxButtons\"><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">No editor Gutenberg, voc&ecirc; tamb&eacute;m pode usar o bloco <strong>Shortcode<\/strong> padr&atilde;o para inserir o bot&atilde;o manualmente. No entanto, voc&ecirc; precisa digitar o c&oacute;digo curto manualmente, e o design do bot&atilde;o n&atilde;o &eacute; exibido no editor de posts.<\/p><p class=\"wp-block-paragraph\">Utilizando c&oacute;digos curtos, voc&ecirc; pode inserir um bot&atilde;o do MaxButtons usando seu <strong>nome<\/strong> ou <strong>ID<\/strong>, como mostrado abaixo.<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">[maxbutton id=\"1\"]<\/pre><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">[maxbutton name=\"Google\"]<\/pre><p class=\"wp-block-paragraph\">Voc&ecirc; tamb&eacute;m pode sobrescrever as configura&ccedil;&otilde;es existentes adicionando mais par&acirc;metros ao seu c&oacute;digo curto. Se voc&ecirc; deseja substituir todas as configura&ccedil;&otilde;es suportadas, seu c&oacute;digo deve ser semelhante a este:<\/p><pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">[maxbutton id=\"1\" text=\"yourtext\" url=\"http:\/\/yoururl\" linktitle=\"tooltip\" window=\"new\" nofollow=\"true\" extraclass=\"extra\"]<\/pre><p class=\"wp-block-paragraph\">Isso pressup&otilde;e que voc&ecirc; queira apenas substituir o texto, omitir outras configura&ccedil;&otilde;es e incluir somente o par&acirc;metro de <strong>texto<\/strong>.<\/p><h2 class=\"wp-block-heading\" id=\"h-what-are-the-alternatives-to-button-shortcode-plugins\">Quais s&atilde;o as alternativas aos plugins de shortcode para bot&otilde;es?<\/h2><p class=\"wp-block-paragraph\">Existem alternativas aos plugins de shortcode de bot&atilde;o que oferecem um processo mais simples para criar e inserir esse conte&uacute;do interativo. Aqui est&atilde;o duas das op&ccedil;&otilde;es mais comuns. <\/p><h3 class=\"wp-block-heading\" id=\"h-block-plugin\">Plugin de bloco<\/h3><p class=\"wp-block-paragraph\">Embora os shortcodes ofere&ccedil;am flexibilidade e reutiliza&ccedil;&atilde;o, eles podem n&atilde;o ser t&atilde;o vantajosos se voc&ecirc; preferir inserir bot&otilde;es usando um bloco. Para isso, um plugin de bot&otilde;es como o <strong>Ultimate Blocks<\/strong> &eacute; o m&eacute;todo ideal.<\/p><p class=\"wp-block-paragraph\">O Ultimate Blocks oferece um bloco de bot&atilde;o pr&eacute;-configurado que voc&ecirc; pode inserir facilmente no editor de posts do WordPress e estilizar a partir da&iacute;. Basta adicionar o bloco <strong>Bot&otilde;es (UB)<\/strong> e come&ccedil;ar a modificar seu bot&atilde;o diretamente. <\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a6fe4e005175\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a6fe4e005175\" class=\"aligncenter size-full wp-lightbox-container\"><img decoding=\"async\" width=\"692\" height=\"610\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/o-explorador-de-blocos-de-botoes-definitivo-no-editor-wordpress.png\/public\" alt=\"O bloco de bot&otilde;es do Ultimate Blocks no navegador de blocos do Gutenberg do WordPress.\" class=\"wp-image-53633\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/o-explorador-de-blocos-de-botoes-definitivo-no-editor-wordpress.png\/w=692,fit=scale-down 692w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/o-explorador-de-blocos-de-botoes-definitivo-no-editor-wordpress.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/o-explorador-de-blocos-de-botoes-definitivo-no-editor-wordpress.png\/w=150,fit=scale-down 150w\" sizes=\"(max-width: 692px) 100vw, 692px\" \/><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">As op&ccedil;&otilde;es de design s&atilde;o mais abrangentes do que as do MaxButtons, permitindo que voc&ecirc; altere a orienta&ccedil;&atilde;o do bot&atilde;o, aplique uma anima&ccedil;&atilde;o e inclua um &iacute;cone para torn&aacute;-lo mais atraente. No entanto, algumas configura&ccedil;&otilde;es de estilo est&atilde;o dispon&iacute;veis apenas na vers&atilde;o PRO.<\/p><p class=\"wp-block-paragraph\">Voc&ecirc; pode salvar o design do seu bot&atilde;o acessando a aba <strong>Estilo<\/strong> no painel de configura&ccedil;&atilde;o do bloco. Em seguida, expanda a se&ccedil;&atilde;o <strong>Avan&ccedil;ado<\/strong> e clique em <strong>Salvar estilo atual<\/strong>.<\/p><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a6fe4e005a54\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a6fe4e005a54\" class=\"aligncenter size-large wp-lightbox-container\"><img decoding=\"async\" width=\"537\" height=\"1024\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/ultimate-blocks-buttons-block-configuration-pane.png\/w=1024,h=1024,fit=scale-down\" alt=\"O painel de configura&ccedil;&atilde;o do bloco de bot&otilde;es do Ultimate Blocks\" class=\"wp-image-53634\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/ultimate-blocks-buttons-block-configuration-pane.png\/w=537,fit=scale-down 537w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/ultimate-blocks-buttons-block-configuration-pane.png\/w=157,fit=scale-down 157w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/ultimate-blocks-buttons-block-configuration-pane.png\/w=79,fit=scale-down 79w\" sizes=\"(max-width: 537px) 100vw, 537px\" \/><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Se desejar reutilizar o estilo em outro bot&atilde;o, acesse a guia <strong>Estilo<\/strong>, expanda a se&ccedil;&atilde;o <strong>Estilos<\/strong> e selecione um design salvo. Voc&ecirc; tamb&eacute;m pode definir um design de bot&atilde;o como padr&atilde;o, o que ajuda a manter um design consistente facilmente, sem usar c&oacute;digos curtos.<\/p><p><strong><div class=\"announcement-block announcement-block--important\">\n            <span class=\"announcement-block__heading\">\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n                    <path fill-rule=\"evenodd\" clip-rule=\"evenodd\"\n                          d=\"M12 22.5C17.799 22.5 22.5 17.799 22.5 12C22.5 6.20101 17.799 1.5 12 1.5C6.20101 1.5 1.5 6.20101 1.5 12C1.5 17.799 6.20101 22.5 12 22.5ZM13.637 7.65198C13.637 6.74791 12.9041 6.01501 12 6.01501C11.0959 6.01501 10.363 6.74791 10.363 7.65198C10.5335 9.53749 10.875 13.383 10.875 13.383C10.875 14.0043 11.3787 14.508 12 14.508C12.6213 14.508 13.125 14.0043 13.125 13.383V13.38L13.637 7.65198ZM11.9927 15.714C11.3714 15.714 10.8677 16.2177 10.8677 16.839C10.8677 17.4603 11.3714 17.964 11.9927 17.964H12.0073C12.6286 17.964 13.1323 17.4603 13.1323 16.839C13.1323 16.2177 12.6286 15.714 12.0073 15.714H11.9927Z\"\n                          fill=\"#FEA419\"\/>\n                <\/svg>\n                Important\n            <\/span>\n            <p class=\"announcement-block__content\">\n                Importante!<\/strong> Como o plugin <strong>Ultimate Blocks<\/strong> &eacute; baseado em blocos, ele n&atilde;o funciona com o <strong>Editor Cl&aacute;ssico do WordPress<\/strong>. Se voc&ecirc; deseja continuar trabalhando com o Editor Cl&aacute;ssico, permane&ccedil;a com o MaxButtons ou encontre outras alternativas que sejam compat&iacute;veis com o editor antigo do WordPress. \n            <\/p><\/div><\/p><h3 class=\"wp-block-heading\" id=\"h-buttons-block\">Bloco de bot&otilde;es<\/h3><p class=\"wp-block-paragraph\">O bloco de <strong>bot&otilde;es<\/strong> &eacute; um recurso integrado do <strong>WordPress 5.4 e vers&otilde;es posteriores<\/strong> que permite arrastar e soltar um bot&atilde;o em sua postagem ou p&aacute;gina sem a necessidade de instalar um plugin adicional. Eis como us&aacute;-lo:<\/p><ol class=\"wp-block-list\">\n<li>Abra o <strong>editor de blocos Gutenberg do WordPress<\/strong> e clique no &iacute;cone de <strong>mais<\/strong> para adicionar um novo bloco. <\/li>\n\n\n\n<li>No <strong>explorador de blocos<\/strong>, procure e selecione o bloco &ldquo;<strong>Bot&otilde;es<\/strong>&ldquo;.<\/li>\n\n\n\n<li>Digite o texto para o seu bot&atilde;o.<\/li>\n\n\n\n<li>Ajuste as configura&ccedil;&otilde;es do seu bot&atilde;o na <strong>dica de ferramenta embutida<\/strong> e no <strong>painel de configura&ccedil;&atilde;o do bloco<\/strong>. <\/li>\n<\/ol><div class=\"wp-block-image\">\n<figure data-wp-context='{\"imageId\":\"6a6fe4e0062b6\"}' data-wp-interactive=\"core\/image\" data-wp-key=\"6a6fe4e0062b6\" class=\"aligncenter size-large wp-lightbox-container\"><img decoding=\"async\" width=\"1024\" height=\"504\" data-wp-class--hide=\"state.isContentHidden\" data-wp-class--show=\"state.isContentVisible\" data-wp-init=\"callbacks.setButtonStyles\" data-wp-on--click=\"actions.showLightbox\" data-wp-on--load=\"callbacks.setButtonStyles\" data-wp-on--pointerdown=\"actions.preloadImage\" data-wp-on--pointerenter=\"actions.preloadImageWithDelay\" data-wp-on--pointerleave=\"actions.cancelPreload\" data-wp-on-window--resize=\"callbacks.setButtonStyles\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/the-wordpress-buttons-block-inline-toolbar-1.png\/w=1024,h=1024,fit=scale-down\" alt=\"a barra de ferramentas embutida do bloco de bot&otilde;es do WordPress\" class=\"wp-image-53635\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/the-wordpress-buttons-block-inline-toolbar-1.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/the-wordpress-buttons-block-inline-toolbar-1.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/the-wordpress-buttons-block-inline-toolbar-1.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2026\/03\/the-wordpress-buttons-block-inline-toolbar-1.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><button class=\"lightbox-trigger\" type=\"button\" aria-haspopup=\"dialog\" data-wp-bind--aria-label=\"state.thisImage.triggerButtonAriaLabel\" data-wp-init=\"callbacks.initTriggerButton\" data-wp-on--click=\"actions.showLightbox\" data-wp-style--right=\"state.thisImage.buttonRight\" data-wp-style--top=\"state.thisImage.buttonTop\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"12\" height=\"12\" fill=\"none\" viewbox=\"0 0 12 12\">\n\t\t\t\t<path fill=\"#fff\" d=\"M2 0a2 2 0 0 0-2 2v2h1.5V2a.5.5 0 0 1 .5-.5h2V0H2Zm2 10.5H2a.5.5 0 0 1-.5-.5V8H0v2a2 2 0 0 0 2 2h2v-1.5ZM8 12v-1.5h2a.5.5 0 0 0 .5-.5V8H12v2a2 2 0 0 1-2 2H8Zm2-12a2 2 0 0 1 2 2v2h-1.5V2a.5.5 0 0 0-.5-.5H8V0h2Z\"><\/path>\n\t\t\t<\/svg>\n\t\t<\/button><\/figure>\n<\/div><p class=\"wp-block-paragraph\">Embora seja simples, esse m&eacute;todo oferece op&ccedil;&otilde;es de personaliza&ccedil;&atilde;o limitadas. Al&eacute;m disso, n&atilde;o &eacute; reutiliz&aacute;vel e n&atilde;o funciona com o Editor Cl&aacute;ssico.<\/p><p class=\"wp-block-paragraph\">Se voc&ecirc; busca uma solu&ccedil;&atilde;o simples e precisa adicionar apenas alguns bot&otilde;es, este bloco integrado &eacute; uma excelente alternativa ao uso de um plugin. Caso esteja usando uma vers&atilde;o mais antiga do WordPress, basta abrir o painel de controle ou o painel de administra&ccedil;&atilde;o da sua <a href=\"\/br\/wordpress-hosting\">hospedagem WordPress<\/a> e baixar a <strong>vers&atilde;o 5.4 <\/strong>ou mais recente.<\/p><div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><a href=\"\/br\/hospedagem-wordpress\" target=\"_blank\" rel=\"noreferrer noopener\"><img decoding=\"async\" width=\"1024\" height=\"300\" src=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/06\/BR-New-WP_in-text-banner.png\/public\" alt=\"\" class=\"wp-image-44638\" srcset=\"https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/06\/BR-New-WP_in-text-banner.png\/w=1024,fit=scale-down 1024w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/06\/BR-New-WP_in-text-banner.png\/w=300,fit=scale-down 300w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/06\/BR-New-WP_in-text-banner.png\/w=150,fit=scale-down 150w, https:\/\/imagedelivery.net\/LqiWLm-3MGbYHtFuUbcBtA\/wp-content\/uploads\/sites\/53\/2024\/06\/BR-New-WP_in-text-banner.png\/w=768,fit=scale-down 768w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/a><\/figure>\n<\/div><h2 class=\"wp-block-heading\" id=\"h-how-to-create-a-custom-wordpress-shortcode\">Como criar um shortcode personalizado no WordPress<\/h2><p class=\"wp-block-paragraph\">At&eacute; agora, explicamos como adicionar c&oacute;digos curtos de bot&otilde;es ao seu site WordPress usando plugins. Embora sejam f&aacute;ceis de usar, voc&ecirc; pode descobrir que oferecem op&ccedil;&otilde;es de personaliza&ccedil;&atilde;o limitadas e podem deixar seu servidor mais lento, especialmente se voc&ecirc; j&aacute; tiver v&aacute;rias extens&otilde;es instaladas.<\/p><p class=\"wp-block-paragraph\">Se voc&ecirc; quiser evitar plugins, pode <a href=\"\/br\/tutoriais\/criar-shortcode-wordpress\/\">criar um shortcode do WordPress<\/a> para o seu bot&atilde;o do zero. Como esse m&eacute;todo envolve codifica&ccedil;&atilde;o manual, requer algum conhecimento t&eacute;cnico e pode n&atilde;o ser adequado para iniciantes que desejam uma solu&ccedil;&atilde;o r&aacute;pida.<\/p><p class=\"wp-block-paragraph\">Por outro lado, desenvolvedores ou usu&aacute;rios experientes do WordPress podem preferir criar o shortcode do zero, j&aacute; que t&ecirc;m controle total sobre o design e a configura&ccedil;&atilde;o do bot&atilde;o. Al&eacute;m disso, esse m&eacute;todo ajuda a manter o desempenho ideal, uma vez que o c&oacute;digo adicional &eacute; mais enxuto e limpo do que o uso de um plugin.<\/p><p class=\"wp-block-paragraph\">Independentemente do m&eacute;todo que funcionar melhor para voc&ecirc;, agora voc&ecirc; estar&aacute; totalmente equipado para come&ccedil;ar a criar seus pr&oacute;prios c&oacute;digos curtos para bot&otilde;es. <\/p><p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Os plugins de bot&otilde;es do WordPress permitem adicionar facilmente bot&otilde;es personalizados ao seu site por meio de shortcodes, sem precisar escrever o c&oacute;digo CSS do zero. Esses trechos de c&oacute;digo s&atilde;o f&aacute;ceis de criar, reutilizar e personalizar, tornando-os o m&eacute;todo preferido para adicionar esses elementos interativos. A maneira mais f&aacute;cil de criar e adicionar shortcodes [&#8230;]<\/p>\n<p><a class=\"btn btn-secondary understrap-read-more-link\" href=\"\/br\/tutoriais\/plugin-botao-wordpress\/\">Read More&#8230;<\/a><\/p>\n","protected":false},"author":356,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"rank_math_title":"","rank_math_description":"Aprenda como usar plugins de bot\u00e3o do wordpress para implementar bot\u00f5es personalizados em seu site com ou sem o uso de shortcodes!","rank_math_focus_keyword":"plugin bot\u00e3o wordpress","footnotes":""},"categories":[4911],"tags":[6774,6772,6771,6770,6773,4798],"class_list":["post-16494","post","type-post","status-publish","format-standard","hentry","category-wordpress","tag-botao","tag-botao-wordpress","tag-plugin-criar-botao-wordpress","tag-plugin-de-botao-wordpress","tag-shortcode-wordpress","tag-wordpress"],"hreflangs":[{"locale":"en-US","link":"https:\/\/www.hostinger.com\/tutorials\/wordpress-button-shortcode\/","default":1},{"locale":"pt-BR","link":"https:\/\/www.hostinger.com\/br\/tutoriais\/plugin-botao-wordpress\/","default":0},{"locale":"id-ID","link":"https:\/\/www.hostinger.com\/id\/tutorial\/cara-membuat-button-di-wordpress\/","default":0},{"locale":"en-PH","link":"https:\/\/www.hostinger.com\/ph\/tutorials\/wordpress-button-shortcode\/","default":0},{"locale":"en-MY","link":"https:\/\/www.hostinger.com\/my\/tutorials\/wordpress-button-shortcode\/","default":0},{"locale":"en-GB","link":"https:\/\/www.hostinger.com\/uk\/tutorials\/wordpress-button-shortcode\/","default":0},{"locale":"en-IN","link":"https:\/\/www.hostinger.com\/in\/tutorials\/wordpress-button-shortcode\/","default":0},{"locale":"en-CA","link":"https:\/\/www.hostinger.com\/ca\/tutorials\/wordpress-button-shortcode\/","default":0},{"locale":"en-AU","link":"https:\/\/www.hostinger.com\/au\/tutorials\/wordpress-button-shortcode\/","default":0},{"locale":"en-NG","link":"https:\/\/www.hostinger.com\/ng\/tutorials\/wordpress-button-shortcode\/","default":0},{"locale":"pt-PT","link":"https:\/\/www.hostinger.com\/pt\/tutoriais\/plugin-botao-wordpress\/","default":0}],"acf":[],"_links":{"self":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts\/16494","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/users\/356"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/comments?post=16494"}],"version-history":[{"count":7,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts\/16494\/revisions"}],"predecessor-version":[{"id":53649,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/posts\/16494\/revisions\/53649"}],"wp:attachment":[{"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/media?parent=16494"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/categories?post=16494"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hostinger.com\/br\/tutoriais\/wp-json\/wp\/v2\/tags?post=16494"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}