Como traduzir WooCommerce (todas as situações cobertas)

Publicados: 2022-01-26

Lutando para traduzir o WooCommerce para que você possa criar uma loja de comércio eletrônico multilíngue e amigável ao comprador?

Criar uma loja WooCommerce multilíngue tem muitos benefícios, sendo os dois maiores os seguintes:

  1. Os compradores podem navegar em sua loja em seus idiomas preferidos, o que cria uma experiência de compra muito melhor para eles. De fato, uma pesquisa da Gallup encomendada pela União Europeia descobriu que 42% dos compradores não compram em lojas que não estão disponíveis em seus idiomas nativos.
  2. Você pode alcançar mais compradores em primeiro lugar graças ao SEO multilíngue. Ou seja, você pode classificar seus produtos no Google para diferentes idiomas, o que ajuda a direcionar mais tráfego orgânico para sua loja.

No entanto, o WooCommerce não inclui funcionalidade multilíngue integrada, então você pode estar enfrentando alguns problemas quando se trata de como traduzir o WooCommerce.

Felizmente, com as ferramentas certas, você pode criar facilmente uma loja multilíngue com nenhum conhecimento técnico necessário. E neste guia, vamos mostrar como.

Quando terminar este tutorial, você poderá usar uma interface visual simples para traduzir totalmente sua loja para um número ilimitado de novos idiomas, incluindo seus produtos, páginas da loja, carrinho, checkout e tudo mais:

Ou, se você não quiser traduzir sua loja do zero, pode obter ajuda da tradução automática de máquina desenvolvida pelo Google Translate ou DeepL e refinar essas traduções por meio do editor visual.

No frontend, seus compradores poderão escolher seus idiomas preferidos usando um alternador de idioma flexível e você pode até redirecionar automaticamente as pessoas para seus idiomas locais com base na localização e nas preferências do navegador.

Pronto para aprender como configurar a tradução do WooCommerce? Vamos cavar!

O que você precisa para traduzir WooCommerce

WooCommerce inclui todos os recursos que você precisa para criar uma loja de comércio eletrônico totalmente funcional… mas apenas em um único idioma.

Então, como você pode traduzir sua loja em vários idiomas e permitir que os compradores escolham seus idiomas preferidos?

Bem, como costuma acontecer com o WordPress, você precisará da ajuda de um plugin.

Embora existam vários plugins multilíngues populares, vamos usar o plugin TranslatePress para este tutorial por alguns motivos:

  1. Ele oferece suporte pronto para o WooCommerce, para que você possa traduzir completamente o WooCommerce, incluindo as páginas de carrinho e checkout.
  2. Existe uma versão gratuita que permite criar uma loja totalmente multilíngue em um novo idioma. Ou seja, você pode seguir a maior parte deste tutorial usando apenas a versão gratuita.
  3. Você pode gerenciar suas traduções usando uma interface visual, como você viu acima.
  4. Ele suporta tradução automática via Google Translate ou DeepL se você quiser economizar tempo.

Como traduzir WooCommerce com TranslatePress

Agora que você sabe o que é o TranslatePress, vamos ver como traduzir o WooCommerce usando o plugin.

Para este tutorial, a única coisa que vamos supor é que você já tenha uma loja WooCommerce em funcionamento no idioma original da sua loja.

Além de definir as configurações do WooCommerce e adicionar conteúdo de produto/loja, você vai querer configurar totalmente o seu tema WooCommerce e quaisquer plugins WooCommerce que você esteja usando.

Para este exemplo, estamos usando o tema gratuito Unite, que oferece suporte total ao WooCommerce. No entanto, o TranslatePress funcionará literalmente com qualquer tema do WooCommerce, para que você possa escolher o tema que desejar.

Você poderá seguir a maior parte deste tutorial usando a versão gratuita do TranslatePress disponível em WordPress.org. No entanto, existem alguns recursos que exigem a versão paga do TranslatePress, que certamente observaremos no tutorial abaixo.

1. Instale o TranslatePress e escolha os idiomas

Para começar, instale e ative o plugin TranslatePress.

Você pode instalar a versão gratuita do WordPress.org. Ou, se você decidir comprar o TranslatePress premium, você pode baixar o plugin premium do seu painel do TranslatePress.

Se você não tiver certeza de qual versão é a melhor para você, sempre poderá começar com a versão gratuita e atualizar mais tarde sem perder nenhuma de suas configurações e traduções.

Depois de ativar o plug-in, vá para Configurações → TranslatePress para escolher os idiomas que deseja usar em sua loja:

  • Idioma padrão – o idioma no qual todo o conteúdo atual da sua loja existe.
  • Todos os idiomas – um ou mais novos idiomas para os quais você deseja traduzir o conteúdo da sua loja. A versão gratuita do TranslatePress permite adicionar um novo idioma ( dois idiomas no total ). Para adicionar dois ou mais novos idiomas, você precisará da versão premium do TranslatePress, que suporta idiomas ilimitados.

Por exemplo, se sua loja existe atualmente em inglês e você deseja traduzi-la para o espanhol, configure as configurações do TranslatePress da seguinte forma:

O TranslatePress oferece suporte pronto para uso para centenas de idiomas e localidades, portanto, você poderá encontrar todos os idiomas desejados usando o menu suspenso.

No entanto, se você não vir o idioma que deseja usar, o TranslatePress também permite adicionar idiomas personalizados.

Você pode configurá-los indo para a guia Avançado da área de configurações do TranslatePress e rolando para baixo até a seção Idioma personalizado .

2. Configure a tradução automática (opcional)

Esta etapa é totalmente opcional. No entanto, se você quiser economizar algum tempo, poderá usar a tradução automática automática para gerar as traduções de linha de base da sua loja, em vez de traduzir tudo do zero.

Mesmo se você usar tradução automática, ainda poderá editar totalmente todas as traduções que o serviço gera, para ter controle total sobre cada tradução em sua loja WooCommerce.

Se você não quiser usar a tradução automática, basta pular para a próxima etapa para começar a traduzir seu conteúdo manualmente.

Se você deseja usar a tradução automática, o TranslatePress oferece suporte a dois serviços diferentes:

  • API do Google Translate – você pode usar isso com a versão gratuita do TranslatePress;
  • DeepL – este serviço requer a licença premium do TranslatePress Business.

O Google Tradutor deve ser bom para usos básicos, mas muitas pessoas acham as traduções do DeepL um pouco mais precisas, especialmente quando se trata de contexto e linguagem informal.

No entanto, a desvantagem do DeepL é que ele não suporta tantos idiomas quanto o Google Tradutor, portanto, verifique se ele suporta o idioma escolhido.

Você pode configurar esses serviços acessando a guia Tradução automática da área de configurações do TranslatePress.

Primeiro, defina a lista suspensa Ativar tradução automática igual a Sim para expandir opções adicionais.

Em seguida, escolha seu mecanismo de tradução preferido. Em seguida, você precisará inserir uma chave de API para esse serviço, que permite conectar seu site WordPress a esse serviço.

O TranslatePress tem documentação passo a passo sobre como obter a chave de API para ambos os serviços:

Por fim, você também tem a opção de definir um limite de quantos caracteres de tradução automática realizar por dia, o que ajuda a controlar seu orçamento.

O plugin TranslatePress não cobra nada com base no uso da tradução automática. No entanto, pode ser necessário pagar diretamente ao Google Translate ou DeepL, dependendo do seu uso.

Tanto o Google Translate quanto o DeepL oferecem planos gratuitos que permitem traduzir 500.000 caracteres por mês gratuitamente, o que equivale Se você precisar traduzir mais de 500.000 caracteres em um único mês, precisará pagar:

  • O Google Tradutor cobra US$ 20 por milhão de caracteres acima do limite gratuito.
  • O DeepL cobra uma taxa fixa de US$ 5,49 por mês, mais US$ 25 por milhão de caracteres, o que o torna um pouco mais caro que o Google Tradutor.

Se você está preocupado com seu orçamento, você pode usar os limites diários de tradução do TranslatePress para garantir que você permaneça dentro do nível gratuito ou limitar o quanto você pode precisar pagar pelo acesso à API.

Depois de fazer suas escolhas, certifique-se de clicar no botão Salvar alterações . Em seguida, o TranslatePress começará a traduzir seu conteúdo.

3. Traduza o conteúdo do WooCommerce

Agora, você está pronto para começar a traduzir o conteúdo da sua loja WooCommerce.

Se você decidiu usar a tradução automática ou não, usará a mesma interface de tradução visual para gerenciar todas as suas traduções:

  • Se você usou tradução automática , as traduções da sua loja serão pré-preenchidas com as traduções do serviço. Mas você poderá editar totalmente essas traduções, se necessário.
  • not Se você não O TranslatePress usa um editor de tradução visual, como você viu acima. Começaremos mostrando como o editor funciona em alto nível e, em seguida, nos aprofundaremos em como traduzir partes específicas do WooCommerce.

    Para iniciar o editor de tradução, abra o conteúdo que você deseja traduzir no front-end do seu site. Em seguida, clique na nova opção Traduzir Página na barra de ferramentas do WordPress:

    No editor de tradução, você verá uma visualização ao vivo da página no lado direito da tela e uma barra lateral à esquerda, onde você pode gerenciar suas traduções.

    Para traduzir qualquer texto ou outro conteúdo, basta passar o mouse sobre ele na visualização ao vivo e clicar no ícone de lápis. Isso abrirá a tradução na barra lateral, onde você poderá fazer suas alterações usando o campo do editor:

    Você usará essa mesma abordagem para traduzir todo o conteúdo da sua loja, seja um produto, a página do carrinho, uma postagem no blog ou qualquer outra coisa.

    Para dar uma ideia melhor de como funciona, vamos ver como traduzir partes específicas da sua loja WooCommerce.

    Como traduzir produtos WooCommerce

    Para traduzir um produto WooCommerce, abra o produto que você deseja traduzir no frontend de sua loja. Em seguida, clique na opção Traduzir página na barra de ferramentas do WordPress para iniciar o editor.

    Você pode então traduzir todos os detalhes do produto como mostramos no GIF acima.

    Você também pode ir além de apenas traduzir o texto do produto e também “traduzir” as imagens do produto para que sua loja mostre imagens diferentes com base no idioma que um comprador selecionou.

    Isso é especialmente útil se algumas de suas imagens de produtos incluírem texto ou se você precisar apenas localizar uma imagem por algum motivo.

    Para traduzir uma imagem de produto, basta passar o mouse sobre ela e clicar no ícone de lápis. Você poderá então selecionar uma imagem diferente para usar na sua Biblioteca de Mídia do WordPress:

    Observação – se o seu tema WooCommerce usar um efeito lightbox ou zoom para imagens de produtos, talvez seja necessário clicar na imagem para abrir a lightbox antes de poder clicar no ícone de lápis.

    Como traduzir a página da loja WooCommerce

    Para traduzir as páginas da sua loja, você pode usar o mesmo editor visual. Basta abrir a página da loja ou o arquivo do produto que você deseja traduzir e clicar no botão Traduzir página .

    O bom aqui é que o TranslatePress detectará automaticamente todos os detalhes do produto que você já traduziu. Portanto, se você já traduziu todos os títulos do seu produto, essas traduções serão pré-preenchidas nas páginas da sua loja:

    Como traduzir a página do carrinho WooCommerce

    O TranslatePress também facilita a tradução da página do carrinho WooCommerce usando o editor visual.

    Por padrão, o TranslatePress tentará usar o pacote de idiomas existente do WooCommerce, se estiver disponível . No entanto, você pode editar totalmente todas as traduções em todos os idiomas da sua loja (incluindo o idioma original da sua loja).

    Seu carrinho de compras WooCommerce tem dois estados diferentes que precisam ser traduzidos:

    1. Vazio – o conteúdo do carrinho antes de um comprador adicionar itens.
    2. Cheio – o conteúdo do carrinho quando o comprador adicionou um ou mais itens.

    Para começar, vá até o front-end da sua loja e verifique se o carrinho de compras está vazio. Em seguida, abra a página do carrinho e inicie o editor TranslatePress.

    Agora, você pode usar a mesma abordagem de apontar e clicar para traduzir todo o conteúdo do carrinho vazio. Ao abrir uma tradução, você pode ver que ela está pré-preenchida com a tradução dos pacotes de idiomas do WooCommerce, mas você pode editar ambas as traduções conforme necessário:

    Quando terminar de traduzir a versão vazia do seu carrinho, volte ao front-end da sua loja e adicione um item ao seu carrinho. Qualquer item serve - a única coisa que importa é que há um produto no seu carrinho.

    Em seguida, volte para a página do carrinho e inicie o editor TranslatePress novamente. Agora, você pode usar a mesma abordagem para traduzir todo o conteúdo que aparecerá quando um comprador tiver itens no carrinho:

    Como traduzir a página de checkout do WooCommerce

    Você pode traduzir a página de checkout do WooCommerce assim como traduziu a página do carrinho.

    Para começar, inicie a página de checkout no front-end da sua loja. Isso significa que você precisará primeiro adicionar um item ao seu carrinho e, em seguida, clicar no botão para finalizar a compra.

    Depois de abrir a página de checkout, use o botão na barra de ferramentas do WordPress para iniciar o editor TranslatePress exatamente como você está fazendo.

    Agora, você pode traduzir o checkout do WooCommerce usando a mesma abordagem de apontar e clicar.

    Assim como na página do carrinho WooCommerce, o TranslatePress tentará pré-preencher as traduções importando-as do pacote de idiomas WooCommerce existente, se disponível. No entanto, você pode editar totalmente as traduções em todos os idiomas da sua loja, incluindo o idioma original.

    Como traduzir itens de menu, widgets e outros conteúdos de front-end

    Neste ponto, você sabe como traduzir todos os elementos importantes da sua loja WooCommerce. No entanto, é importante observar que você pode usar exatamente a mesma abordagem para traduzir outros elementos em sua loja, incluindo:

    • Itens do menu;
    • Widgets (ou widgets de bloco);
    • Conteúdo do editor do WordPress - funciona tanto com o novo editor de blocos (Gutenberg) quanto com o editor clássico TinyMCE;
    • Conteúdo que você criou com plugins do construtor de páginas;
    • Formulários de qualquer plugin do construtor de formulários;
    • Pop-ups de plugins de pop-up;
    • …e assim por diante.

    Por exemplo, se você quiser traduzir um dos itens de menu da sua loja, basta passar o mouse sobre o item de menu e clicar no ícone de lápis:

    Depois de traduzir o item de menu uma vez, o TranslatePress usará automaticamente essa tradução para cada ponto em que esse item de menu aparecer - não há necessidade de duplicar seu trabalho em outras páginas.

    Como traduzir metadados de SEO

    Se você quiser se beneficiar do SEO WooCommerce multilíngue, também precisará traduzir os detalhes de SEO de back-end da sua loja, como títulos de SEO, meta descrições, slugs de URL, informações do Open Graph e assim por diante.

    O TranslatePress também pode ajudá-lo a traduzir todos esses detalhes, mas você precisará do complemento SEO Pack para fazer isso, que está disponível na licença Personal premium do TranslatePress.

    Com este complemento, você pode traduzir todas as informações de SEO do seu site. Para fazer isso, o TranslatePress se integra automaticamente aos plugins de SEO mais populares, incluindo Yoast SEO, Rank Math e muito mais.

    Depois de instalar o complemento SEO Pack, você poderá traduzir esses detalhes selecionando-os usando o menu suspenso no editor de tradução.

    Por exemplo, se você já definiu seus detalhes de SEO usando o Yoast SEO, verá esses detalhes aparecerem no editor e poderá traduzi-los como qualquer outro conteúdo:

    Você também pode usar a mesma abordagem para traduzir o slug de URL para produtos individuais (e outras partes do conteúdo, como postagens de blog).

    Para slugs de URL de todo o site, como slugs de base de categoria de produto, você pode abrir a interface String Translation :

    4. Configure seu alternador de idioma WooCommerce

    Neste ponto, você tem uma loja WooCommerce multilíngue em funcionamento.

    No entanto, para facilitar a escolha dos idiomas preferidos pelos compradores, convém configurar o alternador de idiomas de front-end da sua loja.

    Por padrão, o TranslatePress adiciona um alternador de idioma flutuante no canto inferior direito da sua loja. No entanto, você também pode alterar a localização do alternador de idioma flutuante ou usar uma opção de posicionamento completamente diferente.

    Aqui estão suas opções para colocar o seletor de idioma da sua loja:

    • Alternador de idioma flutuante – exiba-o em todas as suas páginas, em qualquer canto da sua loja.
    • Item de menu – adicione seu seletor de idioma como um item de menu a qualquer menu em seu site acessando Aparência → Menus .
    • Shortcode – coloque manualmente seu seletor de idioma em qualquer lugar do seu site usando um shortcode.

    Você também obtém configurações para controlar o conteúdo e o comportamento do alternador de idioma. Por exemplo:

    • Nomes de idiomas – escolha se deseja exibir o nome completo do idioma ou apenas o código ISO de duas letras.
    • Bandeiras do país – escolha se deseja ou não mostrar as bandeiras do país. Se você habilitar sinalizadores, o TranslatePress mostrará o sinalizador para a localidade específica que você selecionou. Então, se você escolheu espanhol (Espanha), ele mostrará a bandeira espanhola. Mas se você escolher espanhol (México), mostrará a bandeira mexicana.

    Para definir essas configurações, vá para Configurações → TranslatePress e role para baixo até as configurações do Language Switcher :

    Agora, vamos ver alguns posicionamentos alternativos para o alternador de idioma flutuante padrão.

    Para adicionar o alternador de idioma do WooCommerce como um item de menu, vá para Aparência → Menus para acessar o editor de menu normal do WordPress e abra o menu que deseja editar.

    Em seguida, você pode usar as configurações do Language Switcher para configurar seu seletor de idioma.

    Você tem duas opções principais aqui…

    Primeiro, se você usar apenas dois idiomas em seu site, basta adicionar o item Idioma Oposto como um item de menu de nível superior. Com este item de menu, sua loja exibirá uma opção para as pessoas mudarem para o outro idioma que você oferece:

    Digamos que sua loja esteja disponível em inglês e espanhol. Se um comprador estivesse navegando em inglês, ele veria a opção de espanhol no seu menu. Mas se eles estiverem navegando em espanhol, eles verão a opção para inglês:

    A outra opção é usar o item de menu Idioma atual . Isso exibirá o idioma em que o comprador está navegando no momento. Você pode adicionar os idiomas específicos como itens de submenu do item de menu Idioma atual como este:

    Com essa configuração, os compradores verão o idioma selecionado no momento como o item de menu de nível superior. Eles podem então passar o cursor sobre isso para exibir uma lista suspensa com todos os idiomas disponíveis. O TranslatePress ocultará a lista suspensa para o idioma selecionado do usuário, para evitar duplicação :

    Se você oferece mais de dois idiomas, essa é provavelmente a melhor abordagem para sua loja.

    Como adicionar seu alternador de idioma WooCommerce como um código de acesso

    Se você quiser ainda mais controle sobre o posicionamento do seu seletor de idioma, poderá adicioná-lo manualmente em qualquer lugar da sua loja usando o seguinte código de acesso:

     [alterador de idioma]

    Você pode colocar esse código de acesso em widgets, blocos, conteúdo que você cria com o editor e assim por diante.

    Você também pode usar a função do_shortcode() do WordPress para colocar o seletor de idioma diretamente nos arquivos de modelo do seu tema.

    Crie uma loja WooCommerce multilíngue hoje

    Traduzir sua loja WooCommerce é uma ótima maneira de oferecer uma melhor experiência de compra para seus clientes existentes e, ao mesmo tempo, alcançar novos clientes graças ao SEO multilíngue e outras novas oportunidades de marketing.

    Embora o WooCommerce não suporte a funcionalidade multilíngue no plug-in principal, você pode criar facilmente uma loja multilíngue usando o plug-in TranslatePress.

    Usando o editor visual do TranslatePress, você poderá traduzir totalmente sua loja, incluindo suas páginas de produtos individuais, páginas de loja, página de carrinho, página de checkout, metadados de SEO e conteúdo não WooCommerce.

    Você pode adicionar um alternador de idioma de front-end para que os compradores possam escolher seus idiomas preferidos enquanto navegam em sua loja.

    Neste post, você aprendeu passo a passo como traduzir WooCommerce e criar sua loja multilíngue.

    Se você estiver pronto para começar, instale o plugin TranslatePress gratuito hoje mesmo para ver como ele funciona.

    E se você ainda estiver nos estágios de planejamento de sua loja, verifique os melhores temas WooCommerce e alguns outros ótimos plugins WooCommerce para configurar sua loja para o sucesso.

    Você ainda tem alguma dúvida sobre a tradução do WooCommerce? Deixe-nos saber nos comentários!

    Divulgação: Esta página contém links de afiliados externos que podem resultar no recebimento de uma comissão se você optar por comprar o produto mencionado. As opiniões nesta página são nossas e não recebemos bônus adicional por avaliações positivas.