WooCommerce: Alterar Texto do Botão com JavaScript

Este snippet de código adiciona um script JavaScript personalizado à página do carrinho do WooCommerce Blocks para alterar o texto do botão de “Finalizar compra” para “Comprar Agora”.

0
				
					// Adicionar JavaScript personalizado para alterar o texto do botão no carrinho do WooCommerce Blocks
add_action( 'wp_footer', 'custom_woocommerce_cart_button_text_script' );

function custom_woocommerce_cart_button_text_script() {
    // Só adicionar o script se estivermos na página do carrinho
    if ( is_cart() ) {
        ?>
        
            document.addEventListener('DOMContentLoaded', function() {
                var interval = setInterval(function() {
                    var buttonText = document.querySelector('.wc-block-cart__submit-button .wc-block-components-button__text');
                    if (buttonText) {
                        buttonText.textContent = 'Comprar Agora';
                        clearInterval(interval); // Parar o intervalo após encontrar o botão
                    }
                }, 500); // Verificar a cada 500ms
            });
        
        <?php
    }
}
				
			

Quer ajuda de um especialista para implementar?

Instruções de Uso

Como funciona:

  1. Adicionar Ação ao Rodapé:
    • add_action( 'wp_footer', 'custom_woocommerce_cart_button_text_script' );: Adiciona a função custom_woocommerce_cart_button_text_script ao gancho wp_footer, que é executado no rodapé de todas as páginas do site.
  2. Definição da Função:
    • function custom_woocommerce_cart_button_text_script() { ... }: Define a função custom_woocommerce_cart_button_text_script que adiciona o script JavaScript à página do carrinho.
  3. Verificação da Página do Carrinho:
    • if ( is_cart() ) { ... }: Verifica se a página atual é a página do carrinho do WooCommerce.
  4. Adicionar o Script:
    • <script type="text/javascript"> ... </script>: Adiciona o script JavaScript diretamente na página.
      • document.addEventListener('DOMContentLoaded', function() { ... });: Garante que o script será executado após o carregamento completo do DOM.
      • var interval = setInterval(function() { ... }, 500);: Define um intervalo que verifica a cada 500ms se o botão está presente na página.
      • var buttonText = document.querySelector('.wc-block-cart__submit-button .wc-block-components-button__text');: Seleciona o elemento do botão no carrinho usando seletores CSS.
      • if (buttonText) { ... }: Verifica se o botão foi encontrado.
        • buttonText.textContent = 'Comprar Agora';: Altera o texto do botão para “Comprar Agora”.
        • clearInterval(interval);: Interrompe o intervalo após encontrar e modificar o botão, evitando verificações adicionais desnecessárias.

Instruções de Uso

Este código pode ser adicionado ao arquivo functions.php do seu tema ou, preferencialmente, em um plugin específico para o site. Utilizar um plugin para essas customizações mantém o código organizado e seguro contra atualizações do tema.

Conclusão

Este snippet permite que você personalize o texto do botão “Finalizar compra” na página do carrinho do WooCommerce Blocks, alterando-o para “Comprar Agora”. Isso pode ser útil para melhorar a clareza ou ajustar a linguagem para melhor atender ao público-alvo do seu site.

Outros Snippets

WooCommerce
Este snippet cria um shortcode que exibe os detalhes de uma reserva do WooCommerce com base no ID do pedido fornecido na URL.
WordPress
Este snippet redireciona todos os visitantes do site que não estejam logados para uma página específica (não a página de login).
WordPress
Este snippet redireciona todos os visitantes do site que não estejam logados para a página de login do WordPress. Isso é útil se você deseja restringir o acesso ao conteúdo do seu site apenas para usuários autenticados.

Últimos Posts

Como configurar uma tarefa cron no servidor para executar o wp-cron.php

Como configurar uma tarefa cron no servidor para executar o wp-cron.php?

Configurações Essenciais para um Ambiente Avançado no WordPress

Configurações Essenciais para um Ambiente Avançado no WordPress

Configuração Avançada de Ambiente de Desenvolvimento para WordPress

Configuração Avançada de Ambiente de Desenvolvimento para WordPress

Diferenças entre Temas, Plugins, Widgets e Custom Post Types no WordPress

Diferenças entre Temas, Plugins, Widgets e Custom Post Types no WordPress

Como Resolver o Erro “register_rest_route foi chamada incorretamente” no WordPress

Se você trabalha com APIs REST no WordPress, pode ter encontrado o aviso: “A função register_rest_route foi chamada incorretamente”.

PHP Notice: Function _load_textdomain_just_in_time was called incorrectly (RESOLVIDO)

PHP Notice: Function _load_textdomain_just_in_time was called incorrectly (RESOLVIDO)

Comentários

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Esse site utiliza o Akismet para reduzir spam. Aprenda como seus dados de comentários são processados.

Você precisa estar logado para ver esta informação.

Adicione seu Snippet

Título *
Resumo *
Descrição Completa *
Código *
Instruções de uso *

Solicitar Orçamento

Torne-se um Assinante e Eleve seu Conhecimento do WordPress!

Acesso Exclusivo, Suporte Especializado e Muito Mais.

Se você está aproveitando nosso conteúdo gratuito, vai adorar os benefícios exclusivos que oferecemos aos nossos assinantes! 

Não perca a oportunidade de maximizar seu potencial no WordPress. Clique no botão abaixo para se tornar um assinante e leve suas habilidades ao próximo nível!