Adicionando suporte para vários idiomas (internacionalização) no tema Wordpress

Em resumo o que devemos fazer é criar vários pacotes de idioma para que o tema possa ser apresentado em vários idiomas, conforme a configuração do sistema.

Nós fazemos isso por meio de algumas configurações no arquivo functions.php, por chamadas de funções PHP no html do site e com a ajuda de um plugin que irá gerar as tabelas de tradução numa pasta do tema que definiremos para isto.

Configurações no functions.php

Até agora, eu já criei uma função no arquivo functions.php que carrega configurações de suporte do Wordpres no tema. Você pode verificar isso aqui. Dentro desta função, eu vou adicionar uma outra função padrão que dirá para o Wordpress qual é o domínio do meu tema. Ele deve ser uma palavra exclusiva que identifique o tema que estamos fazendo para o Wordpress.

Para isso vou começar fazendo um ajuste no style.css da pasta raiz do tema. No comentário que colocamos neste arquivo tem uma entrada Text Domain: que eu vou ajustar para phototricks. Já vai ficar claro o porquê disso.

Agora, vou adicionar a função de internacionalização no carregamento do tema. Ela ficou assim:

load_theme_textdomain( 'phototricks', get_template_directory() . '/languages' );

A função load_theme_textdomain informa ao Wordpress qual é o domínio do tema e vincula o tema à sua pasta de traduções. A função get_template_directory trás o caminho da pasta raiz do tema, assim eu concatenei com a pasta /languages que eu criei para guardar as traduções. Veja como ficou a função:

Para mais informações eu criei esta função na página de hooks.

Aplicando as traduções

Vamos traduzir o texto que eu inseri no rodapé do site: "Tema de estudo Wordpress | Desenvolvido por Phototricks".

No lugar onde está o texto que eu quero que haja várias traduções, no arquivo index.php, vou substituir pelo seguinte código:

<?php _e( 'Wordpress Study Theme | Developed by', 'phototricks' ); ?> // O texto default em inglês, seguido do domínio do tema (o mesmo em functions.php e style.css)

Agora, no rodapé do site, eu já verei o texto default, em inglês. Veja:

Adicionando os pacotes de tradução

Vou usar o plugin Loco Translate para gerar automaticamente os pacotes de tradução. 

Após instalado eu entro na página do plugin, seleciono temas e seleciono o meu tema. Daí, eu clico em Criar modelo. Veja abaixo:

Isso vai fazer com que ele crie um modelo de tradução na pasta que já configuramos, a pasta /language. Veja:

Agora, voltamos às configurações deste plugin e escolhemos a opção Novo idioma.

Escolhemos o idioma que vamos inserir, e no local do arquivo escolhemos a opção de tema, pois dessa forma, quando o tema for finalizado, as opções de idioma estarão dentro de sua pasta. Quando ele for instalado em outro local, levará junto estas configurações.

Agora eu posso procurar os textos que marcamos com o domínio 'phototricks' e criar as traduções. Veja que o texto do rodapé já aparece aqui, agora, basta inserir o texto traduzido:

Agora, para todos os trechos de texto que eu quero que estejam sincronizados com a tradução do Wordpress, eu tenho que seguir o mesmo padrão que eu usei no texto do rodapé do site.