Como Personalizar Sua Página de Agradecimento do WooCommerce (3 Métodos) 

Um dos momentos mais negligenciados em uma loja online é o que acontece logo após uma venda. Essa página final não é apenas uma confirmação. Esta é sua primeira chance de construir sobre a confiança que um novo cliente acabou de depositar em você.

Neste guia, vou mostrar três maneiras de criar uma página de agradecimento personalizada do WooCommerce: um construtor sem código, um redirecionamento de plugin e o método de código e hooks. Vamos começar com o mais fácil.

Por que Personalizar sua Página de Agradecimento no WooCommerce?

A página de agradecimento padrão do WooCommerce não foi criada para vender nada. Depois que os compradores finalizam sua página de checkout, eles chegam a uma tela de confirmação simples como esta:

Como sua página de agradecimento se parece depende do seu tema do WordPress. De qualquer forma, essa tela padrão não é otimizada para conversões ou engajamento do cliente.

Substitua-a por um design personalizado e você poderá transformar essa página em uma tela de alta conversão que o ajuda a:

• Adicionar um upsell ou cross-sell pós-checkout
• Exibir itens mais vendidos ou novidades
• Oferecer um cupom para compras futuras
• Link para guias de produtos, ajuda de configuração ou conteúdo bônus
• Adicionar botões de compartilhamento social para aumentar o alcance

Como Criar uma Página de Agradecimento Personalizada no WooCommerce no WordPress

Usaremos o SeedProd para criar uma página de agradecimento personalizada no WooCommerce para sua loja online.

SeedProd é um construtor de sites WordPress de arrastar e soltar usado por mais de 1 milhão de sites WordPress. É um dos melhores construtores de sites para WordPress.

Ele permite que você crie páginas de destino de alta conversão, temas personalizados do WordPress e layouts responsivos sem código. Você pode até usá-lo para criar sites WooCommerce sem contratar um desenvolvedor.

Siga os passos abaixo para construir uma página de agradecimento personalizada no WooCommerce com o SeedProd.

Tutorial em Vídeo

Passo 1. Instale o Plugin SeedProd

Primeiro, baixe o plugin SeedProd e instale-o em seu site WordPress. Aqui está um guia sobre como instalar um plugin do WordPress se precisar de ajuda.

Você pode obter uma versão gratuita do SeedProd, mas usaremos o SeedProd Elite para os blocos do WooCommerce. Os blocos Adicionar ao Carrinho e Produtos Mais Vendidos exigem o nível Elite, portanto, verifique seu plano antes de começar.

Após instalar e ativar o plugin, vá para SeedProd » Configurações no seu painel do WordPress e insira sua chave de licença.

Você pode encontrar sua chave de licença na seção da conta do site do SeedProd.

Em seguida, vá para SeedProd » Páginas de Destino. É aqui que você ativa qualquer um dos modos de página do SeedProd e cria uma nova página de agradecimento.

Selecione o botão Adicionar Nova Landing Page para criar sua página de agradecimento.

Passo 2. Escolha um Modelo de Página de Agradecimento no SeedProd

Você pode escolher um modelo de landing page na próxima tela, e centenas de modelos estão disponíveis.

Clique na aba Obrigado para mostrar apenas os modelos de página de agradecimento. Em seguida, passe o mouse sobre um modelo que você goste e clique no ícone de visto para ativá-lo.

Usaremos a 'Página de Agradecimento Pós-Pedido Concluído' para este tutorial.

Após escolher seu modelo, insira um nome e uma URL para a página. Em seguida, clique no botão Salvar e Começar a Editar a Página.

Etapa 3. Personalize sua Página de Agradecimento com Upsells

Agora você pode começar a editar sua página de agradecimento com o construtor de arrastar e soltar. O editor visual mostra uma prévia ao vivo da sua página à direita.

Para editar qualquer elemento, clique nele e um menu de configurações aparecerá no lado esquerdo.

O painel esquerdo tem elementos chamados Blocos que você pode arrastar e soltar na página.

Começaremos alterando as fontes da página para combinar com nosso tema WooCommerce. Clique no ícone Configurações Globais no canto inferior esquerdo e expanda a aba Fontes.

Você pode então escolher fontes personalizadas do Google e aplicá-las globalmente. O mesmo painel gerencia cores globais, plano de fundo e CSS personalizado.

Em seguida, você pode transformar sua página de agradecimento do WooCommerce em uma tela de pós-checkout otimizada para conversão usando o construtor de arrastar e soltar.

Adicionando um Upsell do WooCommerce

Adicionar um upsell de produto relacionado à sua página de agradecimento ajuda a aumentar o valor médio do pedido e a impulsionar mais vendas na loja.

Veja como criar um upsell na página de confirmação de pedido da sua loja.

Clique na aba Seções no painel esquerdo para abrir uma tela de seções de conteúdo pré-fabricadas. Selecione a aba Hero, depois a seção Hero 2 clicando no ícone de mais laranja para inseri-la.

Agora clique no bloco de Imagem na nova seção e adicione uma imagem do produto que você deseja promover.

Você pode fazer o mesmo para o título do produto e a descrição do produto.

Agora adicionaremos um novo botão de call-to-action. Passe o mouse sobre o botão existente e clique no ícone de lixeira para removê-lo.

Em seguida, role para baixo até os blocos do WooCommerce e arraste o botão Adicionar ao Carrinho. Ele substitui seu botão antigo por um que se conecta aos seus produtos WooCommerce.

Clique no botão para abrir o painel de configurações e insira o ID do Produto desse item. Isso adiciona automaticamente o item ao carrinho do seu cliente.

Você pode encontrar o ID do seu produto acessando Produtos » Todos os Produtos na sua área de administração do WordPress e encontrando seu produto.

Após adicionar o ID do Produto, ative o seletor Ir Direto para o Checkout. O bloco Adicionar ao Carrinho mais o Ir Direto para o Checkout é a parte que a maioria dos iniciantes perde, e é o que transforma o upsell em uma compra de um toque em vez de uma etapa extra.

Você também pode clicar na aba Avançado para personalizar a cor do seu botão, preenchimento, alinhamento e muito mais.

Agora vamos adicionar um título para promover seu upsell. Arraste o bloco de título para cima do seu upsell e adicione um título atraente para incentivar os compradores a comprar.

Adicionando uma Grade de Produtos Mais Vendidos

Adicionar produtos mais vendidos à sua página de agradecimento é uma maneira fácil de aumentar as vendas. Como esses produtos são comprovadamente vendidos, seus clientes provavelmente estarão prontos para comprá-los.

Para fazer isso, role até a seção Blocos do WooCommerce e arraste a grade de Produtos Mais Vendidos para sua página.

Você pode configurar o bloco para mostrar vários produtos, colunas, paginação e muito mais. Na aba Avançado, você pode personalizar as cores da grade, estilo, alinhamento e espaçamento.

Existem muitas outras maneiras de personalizar sua página de agradecimento com o SeedProd, como adicionar:

• Produtos recentes
• Produtos em promoção
• Produtos em destaque
• Produtos mais bem avaliados

Você pode até mesmo adicionar um cronômetro para incentivar os compradores a aproveitar os itens em promoção antes que a oferta termine.

Lembre-se de clicar no botão Salvar no canto superior direito para salvar suas alterações.

Etapa 4. Publique sua página de agradecimento do WooCommerce

Quando estiver satisfeito com a aparência da sua página de confirmação de pedido, você pode publicá-la. Clique na seta suspensa do botão Salvar e selecione Publicar.

Agora você pode visitar sua página de agradecimento para ver como ela ficou.

Como Editar a Página de Agradecimento do WooCommerce com Código

Se você preferir editar a página nativa de recebimento de pedidos em vez de criar uma separada, você pode fazer isso com código. Serei honesto que essa rota é para desenvolvedores, mas ela mantém os detalhes do pedido em tempo real do WooCommerce no lugar enquanto você adiciona seu próprio conteúdo.

A página de agradecimento no WooCommerce não é uma página normal com um shortcode. Ela é renderizada a partir do template thankyou.php no endpoint order-received, que se parece com seusite.com/checkout/order-received/.

Existem duas maneiras de alterar o que aparece lá:

• O hook woocommerce_thankyou: Adicione conteúdo abaixo da confirmação do pedido sem editar arquivos de template. Insira um snippet em um plugin de snippets de código ou no seu tema filho.
• Um override de template: Copie o templates/checkout/thankyou.php do WooCommerce para o seu tema filho em woocommerce/checkout/thankyou.php, descartando a pasta templates, e então edite a cópia. O WooCommerce só carrega sua versão se o caminho corresponder exatamente.

O hook é a opção mais segura das duas. Um snippet curto como este adiciona uma mensagem personalizada sob a confirmação:

add_action( 'woocommerce_thankyou', 'custom_thankyou_message' );
function custom_thankyou_message( $order_id ) {
    $order = wc_get_order( $order_id );
    echo '<p>Thanks, ' . esc_html( $order->get_billing_first_name() ) . '! Your order is on its way.</p>';
}

Uma coisa a saber é que um override de template sobrevive a atualizações de plugins, mas nem sempre a atualizações de temas, então sempre edite a cópia dentro de um tema filho. Se você editar o arquivo original do WooCommerce ou o seu tema pai, a próxima atualização apagará suas alterações.

Como Substituir a Página de Agradecimento Padrão do WooCommerce

Após publicar sua página SeedProd, você precisará redirecionar a página de agradecimento padrão para que os compradores cheguem à sua nova tela em vez disso. A maneira mais fácil é um plugin de redirecionamento gratuito.

Recomendamos o plugin Thanks Redirect for WooCommerce. É gratuito no repositório de plugins do WordPress e adiciona o redirecionamento rapidamente. Veja como configurá-lo:

1. Instale e ative o plugin Thanks Redirect for WooCommerce.
2. Vá para WooCommerce » Configurações e clique na aba Produtos.
3. Clique no link Thanks Redirect e, em seguida, marque a caixa Enable Global Thanks Redirect.
4. Cole a URL da sua nova página de agradecimento no campo Thanks Redirect URL e clique em Salvar Alterações.

Uma ressalva antes de redirecionar: uma página de destino totalmente separada não carrega os dados do pedido ativo do cliente, como o número do pedido, itens e totais, a menos que você os insira dinamicamente. Portanto, o redirecionamento funciona melhor como uma tela de marketing ou de upsell. Se os compradores precisarem ver os detalhes da confirmação, mantenha os detalhes do pedido visíveis ou use o método de hook acima.

Você também pode definir uma página de agradecimento diferente por produto. O plugin Thanks Redirect tem uma configuração de redirecionamento por produto, e o método de hook pode ramificar com base no ID do produto no pedido. Vale a pena fazer isso quando cada produto exige um upsell diferente.

O que Torna uma Boa Página de Agradecimento do WooCommerce?

As melhores páginas de agradecimento que já vi fazem algumas coisas bem ao mesmo tempo. Elas confirmam o pedido claramente e, em seguida, usam a atenção restante para direcionar o comprador para uma próxima ação.

Se você deseja uma página que justifique seu lugar, crie estes elementos:

• Uma confirmação clara: O número do pedido, os itens e o total, para que o comprador saiba que a compra foi realizada.
• Um upsell relevante: Um único produto relacionado ao lado da confirmação, não uma grade confusa que compete pela atenção.
• Um motivo para voltar: Um cupom para o próximo pedido ou um link para um guia de configuração do que eles acabaram de comprar.
• Um prompt para compartilhar ou seguir: Botões sociais que transformam um comprador em alcance, já que eles estão mais felizes logo após a compra.

Mantenha o foco. Uma página de agradecimento que tenta fazer tudo acaba não convertendo em nada.

O que Fazer Depois que Sua Página de Agradecimento Estiver no Ar

Construir a página é apenas metade do trabalho. Assim que estiver no ar, configure uma maneira de medir se ela está realmente funcionando.

• Acompanhe a compra: Adicione um evento de compra do GA4 ou seu pixel de anúncio à página de recebimento do pedido para que as conversões sejam registradas.
• Observe a taxa de adoção do upsell: Verifique quantos compradores adicionam o produto de upsell e, em seguida, teste uma oferta diferente se ela estiver baixa.

Comece com o evento de compra. Sem ele, você está adivinhando se algo disso fez diferença.

Perguntas Frequentes sobre a Página de Agradecimento do WooCommerce

Como edito a página de agradecimento do WooCommerce sem um plugin?

Você pode editá-la com código. Adicione um snippet usando o hook de ação `woocommerce_thankyou` para inserir conteúdo abaixo da confirmação do pedido, ou copie o template `thankyou.php` para o seu tema filho e edite a cópia.

O método de hook é mais seguro porque sobrevive a atualizações de tema e plugin. Editar o arquivo de template original não.

Qual é o URL da página de agradecimento do WooCommerce?

A página de agradecimento padrão fica no endpoint `order-received`, que se parece com `seusite.com/checkout/order-received/`. Você pode renomear esse endpoint em WooCommerce » Configurações » Avançado » Endpoints de checkout.

Posso definir uma página de agradecimento diferente para cada produto?

Sim. Um plugin de redirecionamento com uma configuração por produto pode enviar compradores de cada produto para uma página diferente. Você também pode ramificar o hook `woocommerce_thankyou` com base no ID do produto no pedido.

Vale a pena a configuração extra quando cada produto precisa de um upsell ou acompanhamento diferente.

Os clientes ainda verão os detalhes do pedido em uma página de agradecimento personalizada?

Somente se você as mantiver. Um redirecionamento para uma página separada descarta os dados do pedido em tempo real, a menos que você os importe dinamicamente.

Se os detalhes da confirmação forem importantes, use o hook ou o método de template na página nativa de recebimento do pedido, ou mantenha o bloco de detalhes do pedido do WooCommerce em sua página personalizada.

Comece a Personalizar Sua Página de Agradecimento do WooCommerce

Agora você tem uma página de agradecimento personalizada do WooCommerce que transforma uma simples confirmação em uma tela que vende. Com o SeedProd, você pode criá-la sem código e publicá-la em uma tarde.

Quer continuar melhorando sua loja WooCommerce? Confira estes tutoriais a seguir:

• Como Controlar Produtos Relacionados no WooCommerce
• Como Proteger Seu Site WooCommerce
• Como Ocultar Produtos Fora de Estoque no WooCommerce
• Personalize a Aba "Informações Adicionais" no WooCommerce
• Como Corrigir o Erro de Carrinho de Compras do WooCommerce Não Funciona
• Como Alterar o Título da Página da Loja no WooCommerce
• Melhore a Galeria de Imagens de Produtos no WooCommerce
• Como Adicionar Avaliações por Estrelas aos Produtos WooCommerce

Obrigado por ler! Adoraríamos saber sua opinião, então sinta-se à vontade para participar da conversa no YouTube, X e Facebook para mais conselhos e conteúdo úteis para expandir seus negócios.