Como não alterar nenhum produto na mensagem do carrinho

Não é nenhum segredo que personalizar sua loja online permite que você se destaque de seus concorrentes. Existem algumas coisas óbvias que você pode editar, como as páginas do produto, a página da loja, a página do carrinho ou as páginas de checkout. No entanto, outras coisas são muitas vezes esquecidas e que têm um enorme impacto no seu site. Neste guia, mostraremos diferentes maneiras de alterar a mensagem "Nenhum produto no carrinho" .

Já vimos como você pode personalizar alguns elementos da sua loja virtual que não são tão óbvios. Por exemplo, vimos como você pode alterar as mensagens de erro no checkout ou exibir categorias na página da loja. O mesmo acontece com a mensagem “Nenhum produto no carrinho”. A maioria das lojas deixa as opções padrão, portanto, otimizando-as, você se destacará e obterá uma vantagem sobre seus concorrentes.

Antes de vermos como alterar essa mensagem, vamos dar uma olhada no que é essa mensagem e por que você deve alterá-la.

O que é a mensagem "Nenhum produto no carrinho"?

Quando você abre uma loja de comércio eletrônico pela primeira vez, seu carrinho estará vazio, pois você ainda não adicionou nenhum item ao carrinho. Da mesma forma, também estará vazio se você adicionar alguns itens ao carrinho, mas depois removê-los ou comprá-los.

Nesses casos, por padrão, você será saudado com a seguinte mensagem ao abrir a página do carrinho: “Seu carrinho está vazio no momento”. Isso geralmente é chamado de mensagem "Nenhum produto no carrinho".

Além de ver esse alerta na página Carrinho, você também pode encontrá-lo no minicarrinho se tiver adicionado o widget de carrinho a qualquer área de widget de sua loja como um minicarrinho.

Por que alterar a mensagem “Nenhum produto no carrinho”?

Pode haver vários motivos pelos quais você pode querer alterar esta mensagem. Primeiro, você pode personalizar o texto para torná-lo mais acolhedor para seus clientes. Um texto que diz “ Seu carrinho está vazio! Por favor, considere verificar nossos produtos em destaque! ” por exemplo, tem um tom mais quente que o padrão. Dessa forma, você está convidando seus visitantes a visitar outras páginas de sua loja. Apenas algumas lojas online fazem isso, então você também estará se destacando de seus concorrentes.

Além disso, você pode traduzir toda a sua loja para um idioma específico, mas seu plug-in de tradução pode não traduzir essa mensagem corretamente. Nesse caso, personalizar manualmente a mensagem “Nenhum produto no carrinho” oferece um melhor controle.

Apesar de ter muitas opções de personalização, o WooCommerce não permite que você personalize essa mensagem por padrão. No entanto, neste guia, mostraremos como você pode personalizar a mensagem “Nenhum produto no carrinho”.

Como alterar a mensagem “Nenhum produto no carrinho”

Existem 3 maneiras principais de editar esta mensagem:

1. Programaticamente
   1. Editando o arquivo function.php
   2. Editando o arquivo mini-cart.php
2. Com um plug-in

Nas seções a seguir, veremos todas as etapas que você deve seguir para alterar a mensagem "Nenhum produto no carrinho". Esses métodos envolvem a configuração de seus arquivos do WordPress/WooCommerce, por isso recomendamos criar um backup completo antes de iniciar.

1.1) Personalize a mensagem “Nenhum produto no carrinho” editando o arquivo functions.php

Para o primeiro método, usaremos um gancho WooCommerce em seu arquivo functions.php . Este processo simplesmente requer que você abra seu editor de arquivos de tema e adicione algumas linhas de código ao seu arquivo function.php .

Antes de prosseguir, recomendamos que você crie um tema filho do WordPress, se ainda não tiver um. Os temas filho são uma ótima maneira de adicionar ganchos e scripts personalizados aos seus arquivos de tema, garantindo que você possa reverter as alterações a qualquer momento. Essas alterações persistem mesmo se você atualizar seu tema ou os arquivos de tema originais. Se você não quiser criar um manualmente, também poderá usar qualquer um desses plugins de tema filho.

Vamos começar abrindo seu painel de administração do WordPress e indo para Aparência > Editor de Temas. Em seguida, clique no arquivo functions.php na barra lateral direita dos arquivos de tema, conforme mostrado abaixo.

Usando o editor no meio, você pode adicionar o seguinte script ao seu arquivo functions.php :

 remove_action( 'woocommerce_cart_is_empty', 'wc_empty_cart_message', 10 );
add_action( 'woocommerce_cart_is_empty', 'custom_empty_cart_message', 10 );

function custom_empty_cart_message() {
$html = '<div class="col-12 offset-md-1 col-md-10"><p class="cart-empty">';
$html .= wp_kses_post( apply_filters( 'wc_empty_cart_message', __( 'Inserir mensagem de carrinho vazio aqui', 'woocommerce' ) ) );
echo $html. '</p></div>';
}

[Snippet de código tirado daqui.]

Este snippet removerá o texto padrão do WooCommerce Empty Cart e usará outra função para adicionar um texto personalizado. Basta substituir a mensagem “ Inserir mensagem de carrinho vazio aqui ” pelo texto que você deseja para sua mensagem “Nenhum produto no carrinho”.

Por exemplo, se você quiser que a mensagem diga “ Seu carrinho está vazio no momento, recomendamos verificar nossos produtos em destaque!”, você pode usar este código:

 remove_action( 'woocommerce_cart_is_empty', 'wc_empty_cart_message', 10 );
add_action( 'woocommerce_cart_is_empty', 'quadlayers_empty_cart_message', 10 );

function quadlayers_empty_cart_message() {
$html = '<div class="col-12 offset-md-1 col-md-10"><p class="cart-empty">';
$html .= wp_kses_post( apply_filters( 'wc_empty_cart_message', __( 'Seu carrinho está vazio, recomendamos verificar nossos produtos em destaque!', 'woocommerce' ) ) );
echo $html. '</p></div>';
} 

Lembre-se de atualizar o arquivo e você deverá ver este resultado no front-end:

Vimos que a mensagem “Nenhum produto no carrinho” também pode aparecer no minicarrinho. Vamos ver como mudar isso.

1.2) Altere o texto “Nenhum produto no carrinho” editando o arquivo mini-cart.php

Você também pode optar por personalizar a mensagem “Nenhum produto no carrinho” que aparece no minicarrinho . Em vez de usar uma função para isso, você pode simplesmente substituir o texto do minicarrinho vazio em seus arquivos de modelo do WooCommerce .

Para fazer isso, você precisa configurar seus arquivos de modelo do WooCommerce acessando Plugins> Editor de plug-ins em seu painel de administração do WP.

Em seguida, use a opção Selecionar plugin para editar para selecionar WooCommerce e pressione Selecionar . Depois disso, clique em Templates > Cart > mini-cart.php em Plugin Files.

Por padrão, na parte inferior do carrinho, você deve ver as seguintes linhas de código:

 <?php mais: ?>

<p class="woocommerce-mini-cart__empty-message"><?php esc_html_e( 'Nenhum produto no carrinho.', 'woocommerce' ); ?></p>

<?php endif; ?>

<?php do_action('woocommerce_after_mini_cart'); ?>

Você pode simplesmente editar este código substituindo o texto “ Nenhum produto no carrinho ” por um texto personalizado. Por exemplo, para alterar o texto para ' Por favor, considere adicionar novos produtos ', você deve usar este código:

 <?php mais: ?>

<p class="woocommerce-mini-cart__empty-message"><?php esc_html_e( 'Por favor, considere adicionar novos produtos', 'woocommerce' ); ?></p>

<?php endif; ?>

<?php do_action('woocommerce_after_mini_cart'); ?> 

Lembre-se de salvar as alterações e, em seguida, você deverá ver as alterações no front-end.

2. Como alterar a mensagem “Nenhum produto no carrinho” com um plugin

Mencionamos anteriormente que às vezes você traduz sua loja para um idioma específico, mas a mensagem "Nenhum produto no carrinho" não é traduzida. Vamos ver como você pode alterar esse texto com um plug-in de tradução.

Existem muitos plugins para habilitar traduções para strings personalizadas. Para esta demonstração, usaremos o plug-in Loco Translate . É um dos melhores plugins de tradução para WordPress e possui um editor de tradução embutido no painel. Isso pode ser muito conveniente ao personalizar a mensagem “Nenhum produto no carrinho” em sua loja.

1. Instale e ative o plug-in

Primeiro, instale o plugin, indo em Plugins > Adicionar Novo. Digite as palavras-chave do plugin, instale-o e ative-o.

Alternativamente, você pode instalá-lo manualmente. Se você não estiver familiarizado com esse processo, dê uma olhada em nosso guia sobre como instalar um plugin do WordPress manualmente.

Depois de ativar o plug-in, vá para a próxima etapa.

2. Traduza a mensagem "Seu carrinho está vazio no momento"

Agora é hora de traduzir algumas strings. Primeiro, vá para Loco Translate> Plugins no seu painel de administração do WP. Clique em WooCommerce na lista de plugins para mostrar todas as strings disponíveis para traduzir e escolha o idioma para o qual você traduzirá.

Você também pode adicionar o idioma necessário para sua mensagem de carrinho aqui. Basta clicar em Novo idioma e adicionar o idioma desejado.

Em seguida, use a opção Filtrar traduções para pesquisar a string certa que você deseja traduzir. Para alterar o texto “Nenhum produto no carrinho”, basta digitar “ Seu carrinho está vazio no momento” . Em seguida, clique no texto de origem nos resultados da pesquisa e adicione sua string personalizada à seção de tradução.

Por exemplo, vamos definir uma tradução personalizada para espanhol para nosso site de teste:

Depois de terminar a tradução, pressione Salvar. Agora vá para o front-end, mude o idioma do seu site e você verá a nova mensagem traduzida.

3. Traduza a mensagem "Nenhum produto no carrinho"

Usando o mesmo método, você pode traduzir qualquer string simplesmente pesquisando o texto que deseja alterar. Nesta seção, vamos nos concentrar na string 'Nenhum produto no carrinho' , mas você pode definir uma tradução personalizada para o texto do mini-carrinho ou qualquer mensagem que desejar.

Como vimos antes, acesse Loco Translate > Plugins > WooCommerce e escolha o idioma para o qual deseja traduzir a string. Em seguida, procure por “Nenhum produto no carrinho”, selecione a string e adicione a tradução desejada.

Lembre-se de salvar suas alterações e você deverá ver o resultado no front-end:

Se você quiser mais informações sobre como alterar o idioma do seu site, confira nosso guia completo sobre como alterar os idiomas do WordPress.

Bônus: Como alterar o texto de Prosseguir para o Checkout

Além de personalizar a mensagem “Sem produtos no carrinho”, existem muitos outros textos que você pode alterar para aproveitar ao máximo todos os pontos de contato que os clientes têm em sua loja. Por exemplo, você pode editar textos adicionais, como Prosseguir para o checkout, Adicionar mensagens ao carrinho e muitos outros. Na seção, vamos nos concentrar em como alterar o texto Proceed to Checkout usando uma função simples do WooCommerce.

NOTA : Como editaremos alguns arquivos principais, recomendamos criar um backup completo do seu site e usar um tema filho.

Para personalizar o texto Proceed to Checkout, adicionaremos algumas linhas de código ao arquivo functions.php . Para fazer isso, vá para Appearance > Theme Editor e clique em functions.php na barra lateral de arquivos de tema.

Agora cole o seguinte código enquanto simplesmente altera a seção “ Insert-checkout-text-here ” com sua mensagem personalizada.

 function quadlayers_woocommerce_button_proceed_to_checkout() { ?>
<a href="<?php echo esc_url( wc_get_checkout_url() ); ?>" class="botão do botão de checkout alt wc-forward">
<?php esc_html_e( 'Inserir-Checkout-Text-Aqui', 'woocommerce' ); ?>
</a>
<?php
}

Por exemplo, se você quiser que a mensagem diga " Por favor, mova para o Checkout aqui ", use o seguinte snippet:

 function quadlayers_woocommerce_button_proceed_to_checkout() { ?>
<a href="<?php echo esc_url( wc_get_checkout_url() ); ?>" class="botão do botão de checkout alt wc-forward">
<?php esc_html_e( 'Por favor, mova para o checkout aqui', 'woocommerce' ); ?>
</a>
<?php
} 

Isso deve fornecer este resultado no front-end:

Este é um exemplo, mas há muito mais que você pode fazer para personalizar este texto. Para obter mais informações, confira nosso tutorial sobre como alterar o texto Proceed to Checkout . Este guia explica por que você deve considerar a alteração desse texto, bem como as diferentes maneiras de fazê-lo.

Existem muitas outras personalizações que você pode realizar em sua loja. Se isso é algo em que você está interessado, dê uma olhada em alguns de nossos guias para otimizar o checkout do WooCommerce, criar o checkout de uma página e até personalizar a página de checkout do WooCommerce. Da mesma forma, você pode usar plugins como WooCommerce Direct Checkout e WooCommerce Checkout Manager para ajudá-lo a melhorar o processo de checkout.

Conclusão

Em suma, personalizar a mensagem “Sem produtos no carrinho” permite personalizar a jornada do seu cliente e proporcionar uma melhor experiência de compra. Isso é muitas vezes esquecido pela maioria dos lojistas, por isso pode ajudá-lo a se destacar de seus concorrentes e aumentar suas vendas.

Neste guia, mostramos diferentes maneiras de alterar a mensagem “Nenhum produto no carrinho” no WooCommerce:

• Personalizando o arquivo function.php
• Editando o arquivo mini-cart.php
• Com um plug-in

Agora você deve poder editar a mensagem e também ajustar as traduções que estavam faltando.

Você editou o texto "Nenhum produto no carrinho"? Você teve algum problema ao seguir este guia? Deixe-nos saber nos comentários abaixo.

Por fim, se você quiser saber mais sobre como personalizar mais elementos da sua loja WooCommerce, confira alguns destes artigos:

• Como remover a guia Informações Adicionais no WooCommerce
• 3 métodos para personalizar a página do carrinho WooCommerce
• Alterando a moeda no WooCommerce: o guia completo
• Como personalizar a página da loja WooCommerce