{"id":71162,"date":"2025-02-17T05:19:37","date_gmt":"2025-02-17T08:19:37","guid":{"rendered":"https:\/\/kinsta.com\/pt\/?p=71162&#038;preview=true&#038;preview_id=71162"},"modified":"2025-02-24T11:51:16","modified_gmt":"2025-02-24T14:51:16","slug":"botao-adicionar-ao-carrinho-woocommerce","status":"publish","type":"post","link":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/","title":{"rendered":"Como Adicionar um Bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; \u00e0 sua Loja WooCommerce"},"content":{"rendered":"<p>Se voc\u00ea tem uma loja WooCommerce, o bot\u00e3o adicionar ao carrinho \u00e9 uma de suas ferramentas mais poderosas para <a href=\"https:\/\/kinsta.com\/pt\/blog\/abandono-do-carrinho-de-compras\/\">gerar convers\u00f5es<\/a>. Ele conecta a navega\u00e7\u00e3o do cliente \u00e0 finaliza\u00e7\u00e3o da compra. Um bot\u00e3o bem posicionado e funcional melhora a experi\u00eancia do usu\u00e1rio e aumenta as chances de venda.<\/p>\n<p>Mas o que acontece quando esse bot\u00e3o essencial desaparece ou n\u00e3o funciona como esperado? Muitos propriet\u00e1rios de lojas enfrentam problemas comuns, como o erro \u201cBot\u00e3o Adicionar ao Carrinho n\u00e3o est\u00e1 aparecendo\u201d, ou desejam personalizar o bot\u00e3o para refletir melhor sua marca.<\/p>\n<p>Este artigo \u00e9 um guia completo para adicionar, personalizar e solucionar problemas do bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; no <a href=\"https:\/\/kinsta.com\/pt\/topicos\/woocommerce\/\">WooCommerce<\/a>. Seja voc\u00ea um desenvolvedor que busca controle total, um lojista que precisa de uma solu\u00e7\u00e3o simples ou algu\u00e9m tentando corrigir erros, aqui est\u00e3o os passos pr\u00e1ticos para resolver essas quest\u00f5es com efici\u00eancia. Vamos l\u00e1!<\/p>\n<div><\/div><kinsta-auto-toc heading=\"Table of Contents\" exclude=\"last\" list-style=\"arrow\" selector=\"h2\" count-number=\"-1\"><\/kinsta-auto-toc>\n<h2>Uma r\u00e1pida introdu\u00e7\u00e3o do bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; do WooCommerce<\/h2>\n<p>O bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; no WooCommerce \u00e9 uma pe\u00e7a essencial para a experi\u00eancia de compra em sua loja. Por padr\u00e3o, ele permite que os clientes selecionem produtos e os adicionem ao carrinho de compras.<\/p>\n<p>Aqui est\u00e1 um resumo r\u00e1pido dos locais onde esse bot\u00e3o geralmente aparece:<\/p>\n<ul>\n<li><strong>P\u00e1ginas de produtos<\/strong>: Aparece ao lado dos detalhes do produto, como t\u00edtulo, pre\u00e7o e descri\u00e7\u00e3o.<\/li>\n<li><strong>P\u00e1ginas da loja<\/strong>: \u00c9 exibido diretamente abaixo de cada produto, permitindo que os clientes adicionem itens sem visitar as p\u00e1ginas individuais dos produtos.<\/li>\n<li><strong>P\u00e1ginas de categoria<\/strong>: Semelhante \u00e0s <a href=\"https:\/\/kinsta.com\/pt\/blog\/checkout-de-uma-pagina-woocommerce\/\">p\u00e1ginas da loja<\/a>, simplifica o processo de compra de v\u00e1rios produtos em uma categoria espec\u00edfica da loja.<\/li>\n<\/ul>\n<p>Embora o WooCommerce forne\u00e7a um bot\u00e3o padr\u00e3o de adicionar ao carrinho que funciona para a maioria das lojas, h\u00e1 cen\u00e1rios em que voc\u00ea pode precisar fazer altera\u00e7\u00f5es. Por exemplo, voc\u00ea pode querer personalizar o bot\u00e3o para que ele corresponda ao design da sua marca, ao seu idioma ou para adicionar alguma funcionalidade adicional. Ou talvez voc\u00ea precise corrigir algo. Se o bot\u00e3o estiver faltando, quebrado ou funcionando de forma incorreta, pode ser devido \u00e0 incompatibilidade de temas, conflitos de plugins ou configura\u00e7\u00f5es desatualizadas do WooCommerce. Nesses casos, ser\u00e1 necess\u00e1rio um processo de solu\u00e7\u00e3o de problemas.<\/p>\n<p>Nas se\u00e7\u00f5es a seguir, exploraremos diferentes m\u00e9todos\u00a0para adicionar, personalizar e corrigir o bot\u00e3o &#8220;Adicionar ao Carrinho&#8221;, garantindo que sua loja WooCommerce funcione da melhor forma poss\u00edvel.<\/p>\n<h2>M\u00e9todos para adicionar um bot\u00e3o &#8220;Adicionar ao Carrinho&#8221;<\/h2>\n<p>Existem tr\u00eas m\u00e9todos principais para adicionar um bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; \u00e0 sua loja WooCommerce. Nem todos os m\u00e9todos s\u00e3o adequados para todos os n\u00edveis de habilidade, portanto, leia estas descri\u00e7\u00f5es, avalie os pr\u00f3s e os contras e, em seguida, adote a abordagem que fizer mais sentido para voc\u00ea.<\/p>\n<ul>\n<li><strong>Usando shortcodes:<\/strong> Um m\u00e9todo simples e sem necessidade de c\u00f3digo, ideal para iniciantes. Os shortcodes permitem adicionar rapidamente bot\u00f5es a p\u00e1ginas ou posts, mas as op\u00e7\u00f5es de personaliza\u00e7\u00e3o podem ser limitadas.<\/li>\n<li><strong>Editando arquivos do tema: <\/strong>Para quem deseja mais controle e tem experi\u00eancia com c\u00f3digo, editar arquivos do tema (como <code data-start=\"695\" data-end=\"710\">functions.php<\/code>) permite adicionar e personalizar o bot\u00e3o exatamente como necess\u00e1rio. No entanto, essa abordagem exige cautela e conhecimento t\u00e9cnico, pois erros podem afetar todo o site.<\/li>\n<li><strong>Usando plugins:<\/strong> Uma op\u00e7\u00e3o amig\u00e1vel para usu\u00e1rios que desejam adicionar e personalizar o bot\u00e3o sem precisar programar. No entanto, plugins mal escolhidos podem gerar conflitos, afetar o <a href=\"https:\/\/kinsta.com\/pt\/blog\/desempenho-ecommerce\/\">desempenho do site<\/a> ou exigir atualiza\u00e7\u00f5es frequentes.<\/li>\n<\/ul>\n<p>Vamos explorar cada abordagem, come\u00e7ando pelo uso de shortcodes para adicionar um bot\u00e3o &#8220;Adicionar ao Carrinho&#8221;.<\/p>\n<h3>Usando shortcodes<\/h3>\n<p data-start=\"1287\" data-end=\"1555\">Os <a href=\"https:\/\/kinsta.com\/pt\/blog\/shortcodes-woocommerce\/\">shortcodes<\/a> s\u00e3o uma das formas mais simples e acess\u00edveis de adicionar um bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; no WooCommerce. Um shortcode \u00e9 um pequeno c\u00f3digo entre colchetes, como <code data-start=\"1467\" data-end=\"1480\">[shortcode]<\/code>, que o WooCommerce interpreta para exibir um recurso espec\u00edfico no site.<\/p>\n<p data-start=\"1557\" data-end=\"1645\">Para adicionar um bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; via shortcode, use a seguinte sintaxe: <code>[add_to_cart id=\"PRODUCT_ID\"]<\/code><\/p>\n<p>Aqui, <strong>PRODUCT_ID<\/strong> \u00e9 o ID exclusivo do produto ao qual voc\u00ea deseja vincular. Para localizar o ID do produto, v\u00e1 para <strong>Produtos<\/strong> &gt; <strong>Todos os produtos<\/strong> no painel do WordPress. Passe o cursor do mouse sobre o produto que voc\u00ea deseja adicionar e o ID do produto aparecer\u00e1 sob o nome do produto, assim: <strong>ID: 123<\/strong>.<\/p>\n<figure id=\"attachment_189992\" aria-describedby=\"caption-attachment-189992\" style=\"width: 1000px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-189992 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2025\/01\/product-id.jpg\" alt=\"product id\" width=\"1000\" height=\"190\"><figcaption id=\"caption-attachment-189992\" class=\"wp-caption-text\">Localizando o ID do produto na exibi\u00e7\u00e3o Produtos no WooCommerce.<\/figcaption><\/figure>\n<p>Em seguida, voc\u00ea precisar\u00e1 inserir o shortcode em uma p\u00e1gina ou artigo. Para fazer isso, abra a p\u00e1gina ou artigo em que voc\u00ea deseja exibir o bot\u00e3o. Em seguida, adicione um <strong>bloco Shortcode<\/strong> (se voc\u00ea estiver usando o <a href=\"https:\/\/kinsta.com\/pt\/blog\/blocos-woocommerce\/\">editor de blocos<\/a> do WordPress) ou cole o shortcode diretamente na \u00e1rea de conte\u00fado.<\/p>\n<figure id=\"attachment_189991\" aria-describedby=\"caption-attachment-189991\" style=\"width: 1000px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-189991 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2025\/01\/add-to-cart-shortcode-1.jpg\" alt=\"Shortcode para adicionar ao carrinho\" width=\"1000\" height=\"372\"><figcaption id=\"caption-attachment-189991\" class=\"wp-caption-text\">Inserindo um bot\u00e3o &#8220;Adicionar ao carrinho&#8221; usando o bloco de shortcode.<\/figcaption><\/figure>\n<p>Substitua <strong>PRODUCT_ID<\/strong> pelo ID correto do produto e, em seguida, <strong>salve ou atualize <\/strong>a p\u00e1gina, ou\u00a0o artigo. Ao visualizar a p\u00e1gina, voc\u00ea ver\u00e1 que o bot\u00e3o foi adicionado, juntamente com o pre\u00e7o do item:<\/p>\n<figure id=\"attachment_189990\" aria-describedby=\"caption-attachment-189990\" style=\"width: 900px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-189990 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2025\/01\/add-to-cart-preview.jpg\" alt=\"adicionar ao carrinho visualiza\u00e7\u00e3o\" width=\"900\" height=\"299\"><figcaption id=\"caption-attachment-189990\" class=\"wp-caption-text\">Como um bot\u00e3o &#8220;Adicionar ao carrinho&#8221; inserido via shortcode aparece em um site de produ\u00e7\u00e3o.<\/figcaption><\/figure>\n<p>Por padr\u00e3o, o bot\u00e3o adotar\u00e1 os estilos do seu tema.<\/p>\n<h3>Editando arquivos do tema (op\u00e7\u00e3o personalizada)<\/h3>\n<p>Para propriet\u00e1rios de lojas ou desenvolvedores que buscam controle total, a edi\u00e7\u00e3o de arquivos de tema \u00e9 uma excelente maneira de adicionar e personalizar o bot\u00e3o Adicionar ao carrinho. Esse m\u00e9todo requer conhecimento de codifica\u00e7\u00e3o e cautela, mas oferece infinitas possibilidades de personaliza\u00e7\u00e3o.<\/p>\n<p>Essa abordagem permite modificar a posi\u00e7\u00e3o, o estilo e a funcionalidade do bot\u00e3o exatamente conforme necess\u00e1rio. Al\u00e9m disso, reduz a depend\u00eancia de plugins de terceiros, o que pode melhorar o desempenho do site.<\/p>\n<p>Para adicionar o bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; editando os arquivos do seu tema, primeiro voc\u00ea precisar\u00e1 <a href=\"https:\/\/kinsta.com\/pt\/blog\/tema-filho-no-wordpress\/\">criar um tema filho (child theme)<\/a>. Antes de editar qualquer arquivo de tema, \u00e9 essencial que voc\u00ea use um tema filho (child theme) para garantir que suas altera\u00e7\u00f5es n\u00e3o sejam perdidas durante as atualiza\u00e7\u00f5es do tema.<\/p>\n<p>O restante dessas instru\u00e7\u00f5es deve ser executado somente no tema filho (child theme).<\/p>\n<p>O arquivo a ser editado depende de onde voc\u00ea deseja exibir o bot\u00e3o. Os arquivos mais comuns incluem:<\/p>\n<ul>\n<li><code>single-product.php<\/code> (para p\u00e1ginas de produtos)<\/li>\n<li><code>functions.php<\/code> (para funcionalidade global)<\/li>\n<\/ul>\n<p>Quando voc\u00ea encontrar o arquivo correto no tema filho (child theme), adicione o seguinte snippet de c\u00f3digo PHP no local desejado: <code class=\"language-php\">echo do_shortcode('[add_to_cart id=\"PRODUCT_ID\"]');<\/code><\/p>\n<p>Substitua <strong>PRODUCT_ID<\/strong> pelo ID real do produto.<\/p>\n<p>Em seguida, salve suas altera\u00e7\u00f5es e envie o arquivo atualizado. Acesse sua loja para garantir que o bot\u00e3o aparece e funciona conforme esperado.<\/p>\n<h3>Usando plugins<\/h3>\n<p>Se voc\u00ea preferir uma solu\u00e7\u00e3o sem c\u00f3digo, os plugins s\u00e3o uma maneira r\u00e1pida e confi\u00e1vel de adicionar e personalizar o bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; sem conhecimento de c\u00f3digo.<\/p>\n<p>Aqui est\u00e3o alguns plugins confi\u00e1veis que podem ajudar voc\u00ea a gerenciar e personalizar o bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; do WooCommerce:<\/p>\n<h4>YITH WooCommerce Product Add-Ons<\/h4>\n<figure id=\"attachment_189987\" aria-describedby=\"caption-attachment-189987\" style=\"width: 996px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-189987\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2025\/01\/yith-product-add-ons.jpg\" alt=\"yith product add-ons\" width=\"996\" height=\"319\"><figcaption id=\"caption-attachment-189987\" class=\"wp-caption-text\">Plugin YITH WooCommerce Product Add-Ons.<\/figcaption><\/figure>\n<p>O plugin <a href=\"https:\/\/wordpress.org\/plugins\/yith-woocommerce-product-add-ons\/\" target=\"_blank\" rel=\"noopener noreferrer\">YITH WooCommerce Product Add-Ons<\/a> permite que voc\u00ea aprimore seus produtos oferecendo op\u00e7\u00f5es adicionais e personaliza\u00e7\u00f5es diretamente na <a href=\"https:\/\/kinsta.com\/pt\/blog\/conversoes-paginas-produtos-woocommerce\/\">p\u00e1gina do produto<\/a>. Seja embrulho para presente, campos de personaliza\u00e7\u00e3o ou servi\u00e7os extras, esse plugin facilita a oferta de uma experi\u00eancia de compra personalizada. Os clientes podem selecionar complementos durante o processo de compra, melhorando a satisfa\u00e7\u00e3o deles e aumentando o valor m\u00e9dio do pedido da sua loja.<\/p>\n<p><strong>Principais recursos<\/strong><\/p>\n<ul>\n<li>Adicione op\u00e7\u00f5es extras ilimitadas aos produtos, incluindo checkboxes, menus suspensos, campos de texto e muito mais.<\/li>\n<li>Cobrar taxas adicionais por complementos selecionados para aumentar a receita.<\/li>\n<li>Ofere\u00e7a l\u00f3gica condicional para exibir op\u00e7\u00f5es com base nas sele\u00e7\u00f5es do cliente.<\/li>\n<li>Totalmente compat\u00edvel com <a href=\"https:\/\/kinsta.com\/pt\/blog\/produto-variavel-no-woocommerce\/\">produtos vari\u00e1veis<\/a> e <a href=\"https:\/\/kinsta.com\/pt\/blog\/temas-mais-rapidos-woocommerce\/\">temas de WooCommerce<\/a>.<\/li>\n<\/ul>\n<h4>WooCommerce Custom Add to Cart Button<\/h4>\n<figure id=\"attachment_189986\" aria-describedby=\"caption-attachment-189986\" style=\"width: 1000px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-189986 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2025\/01\/woocommerce-custom-add-to-cart.jpg\" alt=\"woocommerce custom add to cart\" width=\"1000\" height=\"300\"><figcaption id=\"caption-attachment-189986\" class=\"wp-caption-text\">Plugin WooCommerce Custom Add to Cart Button.<\/figcaption><\/figure>\n<p>O plugin <a href=\"https:\/\/wordpress.org\/plugins\/woo-custom-add-to-cart-button\/\" target=\"_blank\" rel=\"noopener noreferrer\">Woo Custom Add to Cart Button<\/a> permite personalizar a forma como os bot\u00f5es de compra funcionam em sua loja WooCommerce. Ele oferece controle total sobre texto, cores, estilos e posicionamento, garantindo que eles se alinhem perfeitamente \u00e0 identidade da sua marca. O plugin tamb\u00e9m oferece suporte a recursos avan\u00e7ados, como URLs personalizadas, para que voc\u00ea possa redirecionar os clientes para p\u00e1ginas espec\u00edficas, como <a href=\"https:\/\/kinsta.com\/pt\/blog\/woocommerce-checkout\/\">checkout<\/a> ou <a href=\"https:\/\/kinsta.com\/pt\/blog\/plugins-de-landing-page-de-alta-conversao\/\">landing page<\/a>\u00a0personalizadas, ap\u00f3s clicar no bot\u00e3o.<\/p>\n<p><strong>Principais recursos<\/strong><\/p>\n<ul>\n<li>Personalize o texto, o estilo e a posi\u00e7\u00e3o do bot\u00e3o &#8220;Adicionar ao Carrinho&#8221;.<\/li>\n<li>Defina URLs de redirecionamento personalizados para fluxos de checkout aprimorados.<\/li>\n<li>Aplique facilmente as altera\u00e7\u00f5es sem tocar no c\u00f3digo, o que o torna f\u00e1cil para iniciantes.<\/li>\n<li>Leve e compat\u00edvel com a maioria dos temas do WooCommerce.<\/li>\n<\/ul>\n<h4>WPC AJAX Add to Cart<\/h4>\n<figure id=\"attachment_189985\" aria-describedby=\"caption-attachment-189985\" style=\"width: 1000px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-189985\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2025\/01\/wpx-ajax.jpg\" alt=\"wpc ajax\" width=\"1000\" height=\"318\"><figcaption id=\"caption-attachment-189985\" class=\"wp-caption-text\">Plugin WPC AJAX Add to Cart.<\/figcaption><\/figure>\n<p>O plugin <a href=\"https:\/\/wordpress.org\/plugins\/wpc-ajax-add-to-cart\/\" target=\"_blank\" rel=\"noopener noreferrer\">WPC AJAX Add to Cart<\/a> aprimora sua loja WooCommerce, permitindo que os clientes <a href=\"https:\/\/kinsta.com\/pt\/blog\/adicionar-e-gerenciar-produtos-no-woocommerce\/\">adicionem produtos<\/a> ao carrinho sem atualizar a p\u00e1gina. Essa funcionalidade AJAX aprimora a experi\u00eancia de compra, tornando-a mais r\u00e1pida e f\u00e1cil de usar. O plugin \u00e9 compat\u00edvel com diversos tipos de produtos, incluindo produtos simples, vari\u00e1veis e agrupados. Ele tamb\u00e9m se integra \u00e0 maioria dos temas e plugins de WooCommerce.<\/p>\n<p><strong>Principais recursos<\/strong><\/p>\n<ul>\n<li>Funcionalidade AJAX para adicionar produtos ao carrinho sem recarregar a p\u00e1gina, proporcionando uma experi\u00eancia de compra mais fluida.<\/li>\n<li>Suporte flex\u00edvel para diferentes tipos de produtos, inclusive produtos vari\u00e1veis e agrupados.<\/li>\n<li>Compatibilidade com temas e <a href=\"https:\/\/kinsta.com\/pt\/blog\/extensoes-woocommerce\/\">extens\u00f5es<\/a> populares de WooCommerce.<\/li>\n<li>Design leve para garantir que sua loja permane\u00e7a r\u00e1pida e responsiva.<\/li>\n<\/ul>\n<h2>Problemas comuns e como resolv\u00ea-los<\/h2>\n<p>Mesmo com os recursos nativos do WooCommerce, o bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; pode, \u00e0s vezes, apresentar problemas como n\u00e3o ser exibido corretamente, n\u00e3o funcionar ou desaparecer completamente. Isso pode prejudicar o desempenho da sua loja e frustrar seus clientes. A seguir, abordamos os problemas mais comuns e fornecemos solu\u00e7\u00f5es passo a passo para resolv\u00ea-los.<\/p>\n<h3>Bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; n\u00e3o aparece<\/h3>\n<p>Se o bot\u00e3o Adicionar ao carrinho n\u00e3o estiver aparecendo, pode ser devido a:<\/p>\n<ul>\n<li>Problemas de compatibilidade de tema<\/li>\n<li><a href=\"https:\/\/kinsta.com\/pt\/blog\/downgrade-do-seu-site-wordpress\/\">Conflitos de plugins<\/a><\/li>\n<li>Vers\u00f5es desatualizadas do WooCommerce<\/li>\n<li>Configura\u00e7\u00f5es incorretas do produto<\/li>\n<\/ul>\n<p>Para corrigir isso, verifique primeiro as configura\u00e7\u00f5es do WooCommerce. V\u00e1 para <strong>WooCommerce<\/strong>\u00a0&gt;\u00a0<strong>Settings<\/strong>\u00a0&gt;\u00a0<strong>Products<\/strong>\u00a0e verifique se a op\u00e7\u00e3o <strong>Enable AJAX add to cart buttons<\/strong>\u00a0est\u00e1 marcada.<\/p>\n<figure id=\"attachment_189984\" aria-describedby=\"caption-attachment-189984\" style=\"width: 900px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-189984 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2025\/01\/enable-ajax-checkbox.jpg\" alt=\"Caixa de sele\u00e7\u00e3o Habilitar AJAX\" width=\"900\" height=\"269\"><figcaption id=\"caption-attachment-189984\" class=\"wp-caption-text\">Verifique se a caixa de sele\u00e7\u00e3o Enable AJAX add to cart buttons est\u00e1 marcada.<\/figcaption><\/figure>\n<p>Em seguida, verifique o tipo de produto. Alguns tipos de produtos, como produtos externos ou de afiliados, podem n\u00e3o exibir um bot\u00e3o &#8220;Adicionar ao Carrinho&#8221;. Para corrigir isso, v\u00e1 para <strong>Produtos<\/strong> &gt; <strong>Todos os produtos<\/strong> em seu painel.<\/p>\n<p>Em seguida, edite o produto e verifique se ele est\u00e1 definido como <strong>Simple Product (Produto simples<\/strong>) ou <strong>Variable Product (Produto vari\u00e1vel)<\/strong> na se\u00e7\u00e3o <strong>Product Data (Dados do produto)<\/strong>.<\/p>\n<figure id=\"attachment_189983\" aria-describedby=\"caption-attachment-189983\" style=\"width: 900px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-189983 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2025\/01\/product-type.jpg\" alt=\"tipo de produto\" width=\"900\" height=\"349\"><figcaption id=\"caption-attachment-189983\" class=\"wp-caption-text\">Verifique o tipo de produto para confirmar se est\u00e1 correto.<\/figcaption><\/figure>\n<p>Se isso n\u00e3o resolver o problema, teste se h\u00e1 conflitos de plugins. Desative todos os plugins, exceto o WooCommerce, e visite sua loja para ver se o bot\u00e3o adicionar ao carrinho reaparece. Se isso acontecer, reative os plugins um a um, atualizando o site a cada vez para identificar o plugin em conflito.<\/p>\n<p>Para continuar a solu\u00e7\u00e3o de problemas, mude temporariamente para um tema padr\u00e3o, como <a href=\"https:\/\/woocommerce.com\/products\/storefront\/\" target=\"_blank\" rel=\"noopener noreferrer\">Storefront<\/a> ou <a href=\"https:\/\/kinsta.com\/pt\/blog\/tema-twenty-twenty-four\/\" rel=\"noopener\">Twenty Twenty-Four<\/a>. Se o bot\u00e3o funcionar com o tema padr\u00e3o, o problema est\u00e1 em seu tema ativo. Talvez voc\u00ea precise entrar em contato com o desenvolvedor do tema para obter suporte.<\/p>\n<p>Voc\u00ea tamb\u00e9m pode verificar se o WooCommerce e o WordPress est\u00e3o atualizados. V\u00e1 para <strong>Dashboard<\/strong> &gt; <strong>Updates<\/strong> (<strong>Painel<\/strong>\u00a0&gt; <strong>Atualiza\u00e7\u00f5es<\/strong>) e verifique se o WooCommerce, o WordPress e todos os plugins est\u00e3o atualizados. Vers\u00f5es desatualizadas podem causar erros e problemas de desempenho.<\/p>\n<p>Se voc\u00ea ainda estiver tendo problemas, ative a depura\u00e7\u00e3o. Para fazer isso, acesse <strong>WooCommerce<\/strong> &gt; <strong>Status<\/strong> &gt; <strong>Logs<\/strong> e procure por mensagens de erro. Uma ferramenta como o plugin <a href=\"https:\/\/wordpress.org\/plugins\/query-monitor\/\" target=\"_blank\" rel=\"noopener noreferrer\">Query Monitor<\/a> pode ajudar a identificar erros ou conflitos de PHP.<\/p>\n<figure id=\"attachment_189981\" aria-describedby=\"caption-attachment-189981\" style=\"width: 1000px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-189981 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2025\/01\/query-monitor.jpg\" alt=\"Query Monitor plugin.\" width=\"1000\" height=\"295\"><figcaption id=\"caption-attachment-189981\" class=\"wp-caption-text\">Plugin Query Monitor.<\/figcaption><\/figure>\n<h3>Bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; n\u00e3o funcionando<\/h3>\n<p>\u00c0s vezes, o bot\u00e3o pode aparecer, mas n\u00e3o adiciona produtos ao carrinho. Isso pode ocorrer devido a <a href=\"https:\/\/kinsta.com\/pt\/blog\/erros-no-javascript\/\">erros de JavaScript<\/a> ou <a href=\"https:\/\/kinsta.com\/pt\/blog\/edge-caching-wordpress\/\">problemas de cache<\/a>.<\/p>\n<p>Para come\u00e7ar, verifique se h\u00e1 erros de JavaScript. Abra sua loja em um navegador e pressione <strong>F12<\/strong> para abrir as ferramentas de desenvolvedor ou<strong> Cmd + Option + I<\/strong> no Mac. V\u00e1 para a aba <strong>Console<\/strong> e verifique se h\u00e1 mensagens de erro vermelhas.<\/p>\n<p>Se aparecerem erros, eles podem ser causados por scripts conflitantes de um tema ou plugin.<\/p>\n<p>Se voc\u00ea usa um <a href=\"https:\/\/kinsta.com\/pt\/blog\/plugins-de-cache-wordpress\/\">plugin de cache<\/a>, limpe o cache e teste novamente. Limpe o cache do navegador ou teste o site em uma janela an\u00f4nima.<\/p>\n<h3>Bot\u00f5es duplicados de adicionar ao carrinho<\/h3>\n<p>Em alguns casos, pode haver v\u00e1rios bot\u00f5es &#8220;Adicionar ao Carrinho&#8221; na p\u00e1gina do produto, o que pode confundir os clientes.<\/p>\n<p>Isso geralmente \u00e9 causado por templates de temas ou personaliza\u00e7\u00f5es. Para corrigir isso, verifique se h\u00e1 hooks <a href=\"https:\/\/stackoverflow.com\/questions\/41588135\/how-to-use-woocommerce-after-add-to-cart-button\" target=\"_blank\" rel=\"noopener noreferrer\">do_action(&#8216;woocommerce_after_add_to_cart_button&#8217;)<\/a> duplicados no arquivo <code>single-product.php<\/code> do seu tema. Em seguida, remova os hooks duplicados e salve as altera\u00e7\u00f5es.<\/p>\n<h2>Como personalizar o bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; no WooCommerce<\/h2>\n<p data-start=\"1318\" data-end=\"1563\">Personalizar o bot\u00e3o melhora a experi\u00eancia do usu\u00e1rio e permite que ele combine melhor com a identidade visual da sua loja. Voc\u00ea pode alterar o texto, o estilo e a funcionalidade do bot\u00e3o fazendo ajustes nos arquivos do tema ou no <a href=\"https:\/\/kinsta.com\/pt\/blog\/otimizar-css\/\">CSS<\/a>. Sempre use um tema filho (child theme) para fazer essas altera\u00e7\u00f5es e fa\u00e7a backup do site antes de seguir adiante.<\/p>\n<h3>Alterar o texto do bot\u00e3o<\/h3>\n<p>Por padr\u00e3o, o WooCommerce usa &#8220;Adicionar ao Carrinho&#8221; como texto do bot\u00e3o. Se quiser substituir por algo como &#8220;Comprar Agora&#8221; ou &#8220;Adicionar \u00e0 Sacola&#8221;, <a href=\"https:\/\/woocommerce.com\/document\/change-add-to-cart-button-text\/\">adicione este c\u00f3digo<\/a> ao arquivo <code>functions.php<\/code>\u00a0do seu tema filho (child theme):<\/p>\n<pre><code class=\"language-php\">function customize_add_to_cart_text( $text ) {  \n    return __( 'Buy Now', 'woocommerce' );  \n}  \nadd_filter( 'woocommerce_product_add_to_cart_text', 'customize_add_to_cart_text' );<\/code><\/pre>\n<p>Substitua <strong>Buy Now<\/strong> pelo texto que voc\u00ea preferir.<\/p>\n<p>Salve o arquivo e atualize sua loja para ver o texto atualizado do bot\u00e3o.<\/p>\n<h3>Alterar o estilo do bot\u00e3o<\/h3>\n<p>Para combinar melhor com sua marca, modifique a apar\u00eancia do bot\u00e3o, incluindo cores, fontes e tamanhos, usando CSS personalizado.<\/p>\n<p>Aqui est\u00e1 um <a href=\"https:\/\/wedevs.com\/blog\/413458\/how-to-change-button-color-in-woocommerce\/\" target=\"_blank\" rel=\"noopener noreferrer\">exemplo de CSS<\/a> para personalizar o bot\u00e3o Adicionar ao carrinho:<\/p>\n<pre><code class=\"language-css\">.button.single_add_to_cart_button {  \n    background-color: #ff6600;  \n    color: #ffffff;  \n    font-size: 18px;  \n    padding: 12px 24px;  \n    border-radius: 8px;  \n    text-transform: uppercase;  \n}  \n\n.button.single_add_to_cart_button:hover {  \n    background-color: #e65c00;  \n    color: #ffffff;  \n}<\/code><\/pre>\n<p>Para aplicar esse CSS, v\u00e1 para <strong data-start=\"2917\" data-end=\"2961\">Apar\u00eancia &gt; Personalizar &gt; CSS Adicional<\/strong> no painel do WordPress. Cole o c\u00f3digo acima e clique em <strong>Publicar<\/strong> para salvar as altera\u00e7\u00f5es.<\/p>\n<figure id=\"attachment_189980\" aria-describedby=\"caption-attachment-189980\" style=\"width: 800px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-189980 size-full\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2025\/01\/additional-css.jpg\" alt=\"css\" width=\"800\" height=\"571\"><figcaption id=\"caption-attachment-189980\" class=\"wp-caption-text\">Adicione CSS personalizado para alterar o estilo do bot\u00e3o Adicionar ao carrinho.<\/figcaption><\/figure>\n<h3>Redirecione os usu\u00e1rios ap\u00f3s clicar no bot\u00e3o<\/h3>\n<p>Ao clicar no bot\u00e3o &#8220;Adicionar ao carrinho&#8221;, voc\u00ea geralmente mant\u00e9m os clientes na mesma p\u00e1gina. Se voc\u00ea quiser redirecionar os usu\u00e1rios para uma p\u00e1gina espec\u00edfica, como o carrinho ou a p\u00e1gina de checkout, adicione o <a href=\"https:\/\/gist.github.com\/JeroenSormani\/44c070d01dd34e20fb06\" target=\"_blank\" rel=\"noopener noreferrer\">seguinte snippet do GitHub<\/a> ao seu arquivo <code>functions.php<\/code>:<\/p>\n<pre><code class=\"language-php\">function redirect_after_add_to_cart() {  \n    global $woocommerce;  \n    $checkout_url = wc_get_checkout_url();  \n    return $checkout_url;  \n}  \nadd_filter( 'woocommerce_add_to_cart_redirect', 'redirect_after_add_to_cart' );<\/code><\/pre>\n<p>Este exemplo redireciona os usu\u00e1rios para a p\u00e1gina de checkout.<\/p>\n<p>Se desejar redirecionar para outra p\u00e1gina (como a p\u00e1gina do carrinho), substitua <code>$checkout_url<\/code> pela URL da p\u00e1gina desejada.<\/p>\n<h2>Resumo<\/h2>\n<p>O bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; no WooCommerce desempenha um papel fundamental para garantir uma experi\u00eancia de compra fluida e impulsionar convers\u00f5es. Neste guia, exploramos diferentes m\u00e9todos para adicionar, personalizar e solucionar problemas do bot\u00e3o de forma eficaz.<\/p>\n<p>Voc\u00ea pode usar shortcodes para uma solu\u00e7\u00e3o simples, editar arquivos do tema para obter controle total ou contar com plugins para uma abordagem sem c\u00f3digo. Tamb\u00e9m inclu\u00edmos um guia sobre como resolver problemas comuns e adicionar personaliza\u00e7\u00f5es para criar uma experi\u00eancia de usu\u00e1rio s\u00f3lida desde o in\u00edcio.<\/p>\n<p>Quer que sua loja tenha o melhor desempenho poss\u00edvel? Considere a <a href=\"https:\/\/kinsta.com\/pt\/hospedagem-wordpress\/\">hospedagem gerenciada<\/a> da Kinsta para WordPress. Recursos como ambientes de teste, backups autom\u00e1ticos e <a href=\"https:\/\/kinsta.com\/pt\/blog\/seguranca-ecommerce\/\">seguran\u00e7a de alto n\u00edvel<\/a> garantem que seu site funcione sem problemas, permitindo que voc\u00ea se concentre no crescimento da sua loja e na entrega de excelentes produtos. O que poderia ser melhor que isso?<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Se voc\u00ea tem uma loja WooCommerce, o bot\u00e3o adicionar ao carrinho \u00e9 uma de suas ferramentas mais poderosas para gerar convers\u00f5es. Ele conecta a navega\u00e7\u00e3o do &#8230;<\/p>\n","protected":false},"author":259,"featured_media":71163,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[],"topic":[1026,1023],"class_list":["post-71162","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","topic-desenvolvimento-wordpress","topic-woocommerce"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v24.6 (Yoast SEO v24.6) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Como Adicionar um Bot\u00e3o &quot;Adicionar ao Carrinho&quot; \u00e0 sua Loja WooCommerce<\/title>\n<meta name=\"description\" content=\"Aprenda como adicionar um bot\u00e3o &quot;Adicionar ao Carrinho&quot; ao WooCommerce, dicas de personaliza\u00e7\u00e3o e como otimizar ao m\u00e1ximo o processo de checkout.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/\" \/>\n<meta property=\"og:locale\" content=\"pt_PT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Como Adicionar um Bot\u00e3o &quot;Adicionar ao Carrinho&quot; \u00e0 sua Loja WooCommerce\" \/>\n<meta property=\"og:description\" content=\"Aprenda como adicionar um bot\u00e3o &quot;Adicionar ao Carrinho&quot; ao WooCommerce, dicas de personaliza\u00e7\u00e3o e como otimizar ao m\u00e1ximo o processo de checkout.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/\" \/>\n<meta property=\"og:site_name\" content=\"Kinsta\u00ae\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/kinstapt\/\" \/>\n<meta property=\"article:published_time\" content=\"2025-02-17T08:19:37+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-02-24T14:51:16+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2025\/02\/how-to-add-a-woocommerce-add-to-cart-button.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1470\" \/>\n\t<meta property=\"og:image:height\" content=\"735\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Steve Bonisteel\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:description\" content=\"Aprenda como adicionar um bot\u00e3o &quot;Adicionar ao Carrinho&quot; ao WooCommerce, dicas de personaliza\u00e7\u00e3o e como otimizar ao m\u00e1ximo o processo de checkout.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2025\/02\/how-to-add-a-woocommerce-add-to-cart-button-1024x512.png\" \/>\n<meta name=\"twitter:creator\" content=\"@kinsta_pt\" \/>\n<meta name=\"twitter:site\" content=\"@kinsta_pt\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Steve Bonisteel\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tempo estimado de leitura\" \/>\n\t<meta name=\"twitter:data2\" content=\"15 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/\"},\"author\":{\"name\":\"Steve Bonisteel\",\"@id\":\"https:\/\/kinsta.com\/pt\/#\/schema\/person\/d84ceff87bd64a4368a581fc8aa8bd6f\"},\"headline\":\"Como Adicionar um Bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; \u00e0 sua Loja WooCommerce\",\"datePublished\":\"2025-02-17T08:19:37+00:00\",\"dateModified\":\"2025-02-24T14:51:16+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/\"},\"wordCount\":2816,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/pt\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2025\/02\/how-to-add-a-woocommerce-add-to-cart-button.png\",\"inLanguage\":\"pt-PT\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/\",\"url\":\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/\",\"name\":\"Como Adicionar um Bot\u00e3o \\\"Adicionar ao Carrinho\\\" \u00e0 sua Loja WooCommerce\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/pt\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2025\/02\/how-to-add-a-woocommerce-add-to-cart-button.png\",\"datePublished\":\"2025-02-17T08:19:37+00:00\",\"dateModified\":\"2025-02-24T14:51:16+00:00\",\"description\":\"Aprenda como adicionar um bot\u00e3o \\\"Adicionar ao Carrinho\\\" ao WooCommerce, dicas de personaliza\u00e7\u00e3o e como otimizar ao m\u00e1ximo o processo de checkout.\",\"breadcrumb\":{\"@id\":\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#breadcrumb\"},\"inLanguage\":\"pt-PT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-PT\",\"@id\":\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#primaryimage\",\"url\":\"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2025\/02\/how-to-add-a-woocommerce-add-to-cart-button.png\",\"contentUrl\":\"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2025\/02\/how-to-add-a-woocommerce-add-to-cart-button.png\",\"width\":1470,\"height\":735},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/kinsta.com\/pt\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"WooCommerce\",\"item\":\"https:\/\/kinsta.com\/pt\/topicos\/woocommerce\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Como Adicionar um Bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; \u00e0 sua Loja WooCommerce\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kinsta.com\/pt\/#website\",\"url\":\"https:\/\/kinsta.com\/pt\/\",\"name\":\"Kinsta\u00ae\",\"description\":\"Solu\u00e7\u00f5es de hospedagem Premium, r\u00e1pida e segura\",\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/pt\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kinsta.com\/pt\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-PT\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kinsta.com\/pt\/#organization\",\"name\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/pt\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-PT\",\"@id\":\"https:\/\/kinsta.com\/pt\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2023\/12\/kinsta-logo.jpeg\",\"contentUrl\":\"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2023\/12\/kinsta-logo.jpeg\",\"width\":500,\"height\":500,\"caption\":\"Kinsta\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/pt\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/kinstapt\/\",\"https:\/\/x.com\/kinsta_pt\",\"https:\/\/www.instagram.com\/kinstahosting\/\",\"https:\/\/www.linkedin.com\/company\/kinsta\/\",\"https:\/\/www.pinterest.com\/kinstahosting\/\",\"https:\/\/www.youtube.com\/c\/Kinsta\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/kinsta.com\/pt\/#\/schema\/person\/d84ceff87bd64a4368a581fc8aa8bd6f\",\"name\":\"Steve Bonisteel\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-PT\",\"@id\":\"https:\/\/kinsta.com\/pt\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/0adffb3f9c86a6ec8245f8399d540823?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/0adffb3f9c86a6ec8245f8399d540823?s=96&d=mm&r=g\",\"caption\":\"Steve Bonisteel\"},\"description\":\"Steve Bonisteel is a Technical Editor at Kinsta who began his writing career as a print journalist, chasing ambulances and fire trucks. He has been covering Internet-related technology since the late 1990s.\",\"url\":\"https:\/\/kinsta.com\/pt\/blog\/author\/stevebonisteel\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Como Adicionar um Bot\u00e3o \"Adicionar ao Carrinho\" \u00e0 sua Loja WooCommerce","description":"Aprenda como adicionar um bot\u00e3o \"Adicionar ao Carrinho\" ao WooCommerce, dicas de personaliza\u00e7\u00e3o e como otimizar ao m\u00e1ximo o processo de checkout.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/","og_locale":"pt_PT","og_type":"article","og_title":"Como Adicionar um Bot\u00e3o \"Adicionar ao Carrinho\" \u00e0 sua Loja WooCommerce","og_description":"Aprenda como adicionar um bot\u00e3o \"Adicionar ao Carrinho\" ao WooCommerce, dicas de personaliza\u00e7\u00e3o e como otimizar ao m\u00e1ximo o processo de checkout.","og_url":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/kinstapt\/","article_published_time":"2025-02-17T08:19:37+00:00","article_modified_time":"2025-02-24T14:51:16+00:00","og_image":[{"width":1470,"height":735,"url":"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2025\/02\/how-to-add-a-woocommerce-add-to-cart-button.png","type":"image\/png"}],"author":"Steve Bonisteel","twitter_card":"summary_large_image","twitter_description":"Aprenda como adicionar um bot\u00e3o \"Adicionar ao Carrinho\" ao WooCommerce, dicas de personaliza\u00e7\u00e3o e como otimizar ao m\u00e1ximo o processo de checkout.","twitter_image":"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2025\/02\/how-to-add-a-woocommerce-add-to-cart-button-1024x512.png","twitter_creator":"@kinsta_pt","twitter_site":"@kinsta_pt","twitter_misc":{"Escrito por":"Steve Bonisteel","Tempo estimado de leitura":"15 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#article","isPartOf":{"@id":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/"},"author":{"name":"Steve Bonisteel","@id":"https:\/\/kinsta.com\/pt\/#\/schema\/person\/d84ceff87bd64a4368a581fc8aa8bd6f"},"headline":"Como Adicionar um Bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; \u00e0 sua Loja WooCommerce","datePublished":"2025-02-17T08:19:37+00:00","dateModified":"2025-02-24T14:51:16+00:00","mainEntityOfPage":{"@id":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/"},"wordCount":2816,"commentCount":0,"publisher":{"@id":"https:\/\/kinsta.com\/pt\/#organization"},"image":{"@id":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2025\/02\/how-to-add-a-woocommerce-add-to-cart-button.png","inLanguage":"pt-PT","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/","url":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/","name":"Como Adicionar um Bot\u00e3o \"Adicionar ao Carrinho\" \u00e0 sua Loja WooCommerce","isPartOf":{"@id":"https:\/\/kinsta.com\/pt\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#primaryimage"},"image":{"@id":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2025\/02\/how-to-add-a-woocommerce-add-to-cart-button.png","datePublished":"2025-02-17T08:19:37+00:00","dateModified":"2025-02-24T14:51:16+00:00","description":"Aprenda como adicionar um bot\u00e3o \"Adicionar ao Carrinho\" ao WooCommerce, dicas de personaliza\u00e7\u00e3o e como otimizar ao m\u00e1ximo o processo de checkout.","breadcrumb":{"@id":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#breadcrumb"},"inLanguage":"pt-PT","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/"]}]},{"@type":"ImageObject","inLanguage":"pt-PT","@id":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#primaryimage","url":"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2025\/02\/how-to-add-a-woocommerce-add-to-cart-button.png","contentUrl":"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2025\/02\/how-to-add-a-woocommerce-add-to-cart-button.png","width":1470,"height":735},{"@type":"BreadcrumbList","@id":"https:\/\/kinsta.com\/pt\/blog\/botao-adicionar-ao-carrinho-woocommerce\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kinsta.com\/pt\/"},{"@type":"ListItem","position":2,"name":"WooCommerce","item":"https:\/\/kinsta.com\/pt\/topicos\/woocommerce\/"},{"@type":"ListItem","position":3,"name":"Como Adicionar um Bot\u00e3o &#8220;Adicionar ao Carrinho&#8221; \u00e0 sua Loja WooCommerce"}]},{"@type":"WebSite","@id":"https:\/\/kinsta.com\/pt\/#website","url":"https:\/\/kinsta.com\/pt\/","name":"Kinsta\u00ae","description":"Solu\u00e7\u00f5es de hospedagem Premium, r\u00e1pida e segura","publisher":{"@id":"https:\/\/kinsta.com\/pt\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kinsta.com\/pt\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-PT"},{"@type":"Organization","@id":"https:\/\/kinsta.com\/pt\/#organization","name":"Kinsta","url":"https:\/\/kinsta.com\/pt\/","logo":{"@type":"ImageObject","inLanguage":"pt-PT","@id":"https:\/\/kinsta.com\/pt\/#\/schema\/logo\/image\/","url":"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2023\/12\/kinsta-logo.jpeg","contentUrl":"https:\/\/kinsta.com\/pt\/wp-content\/uploads\/sites\/3\/2023\/12\/kinsta-logo.jpeg","width":500,"height":500,"caption":"Kinsta"},"image":{"@id":"https:\/\/kinsta.com\/pt\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/kinstapt\/","https:\/\/x.com\/kinsta_pt","https:\/\/www.instagram.com\/kinstahosting\/","https:\/\/www.linkedin.com\/company\/kinsta\/","https:\/\/www.pinterest.com\/kinstahosting\/","https:\/\/www.youtube.com\/c\/Kinsta"]},{"@type":"Person","@id":"https:\/\/kinsta.com\/pt\/#\/schema\/person\/d84ceff87bd64a4368a581fc8aa8bd6f","name":"Steve Bonisteel","image":{"@type":"ImageObject","inLanguage":"pt-PT","@id":"https:\/\/kinsta.com\/pt\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/0adffb3f9c86a6ec8245f8399d540823?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/0adffb3f9c86a6ec8245f8399d540823?s=96&d=mm&r=g","caption":"Steve Bonisteel"},"description":"Steve Bonisteel is a Technical Editor at Kinsta who began his writing career as a print journalist, chasing ambulances and fire trucks. He has been covering Internet-related technology since the late 1990s.","url":"https:\/\/kinsta.com\/pt\/blog\/author\/stevebonisteel\/"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/kinsta.com\/pt\/wp-json\/wp\/v2\/posts\/71162","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kinsta.com\/pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kinsta.com\/pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kinsta.com\/pt\/wp-json\/wp\/v2\/users\/259"}],"replies":[{"embeddable":true,"href":"https:\/\/kinsta.com\/pt\/wp-json\/wp\/v2\/comments?post=71162"}],"version-history":[{"count":8,"href":"https:\/\/kinsta.com\/pt\/wp-json\/wp\/v2\/posts\/71162\/revisions"}],"predecessor-version":[{"id":71253,"href":"https:\/\/kinsta.com\/pt\/wp-json\/wp\/v2\/posts\/71162\/revisions\/71253"}],"alternate":[{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/71162\/translations\/en"},{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/71162\/translations\/it"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/71162\/translations\/pt"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/71162\/translations\/fr"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/71162\/translations\/de"},{"embeddable":true,"hreflang":"ja","title":"Japanese","href":"https:\/\/kinsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/71162\/translations\/jp"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/71162\/translations\/nl"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/71162\/translations\/es"},{"href":"https:\/\/kinsta.com\/pt\/wp-json\/kinsta\/v1\/posts\/71162\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinsta.com\/pt\/wp-json\/wp\/v2\/media\/71163"}],"wp:attachment":[{"href":"https:\/\/kinsta.com\/pt\/wp-json\/wp\/v2\/media?parent=71162"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinsta.com\/pt\/wp-json\/wp\/v2\/tags?post=71162"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinsta.com\/pt\/wp-json\/wp\/v2\/topic?post=71162"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}