Como tornar um site multilíngue construído pelo JetEngine
Preparando o site para funcionar em vários idiomas
Comece comprando o pacote Multilingual CMS WPML. Ele contém WPML String Translation, WPML Media Translation e o plugin principal WPML Multilingual CMS necessário para traduzir o site construído pelo Crocoblock. Depois de carregá-lo no WordPress, conclua a configuração básica do idioma .
Configuração WPML
Execute o assistente de configuração do WPML. Na primeira etapa, escolha os idiomas padrão e de tradução do site. Além disso, você pode criar um idioma personalizado, se necessário.
A segunda etapa permite formatar a URL do site traduzido e oferece três opções de escolha:
- “Diferentes idiomas em diretórios”;
- “Um domínio diferente por idioma”;
- “Nome do idioma adicionado como parâmetro.”
Na terceira etapa, você deve registrar o WPML. Сlique no link “ Obter uma chave para este site ” se ainda não o fez. Isso o levará à conta WPML, onde você poderá registrar o WPML no site necessário e gerar uma chave do site.
Depois de fazer isso, cole a chave recebida no campo Chave do site na janela Configuração do WPML.
Prosseguindo para a próxima etapa, você precisa decidir como gostaria de traduzir o site.
Ao escolher o modo “Traduzir tudo automaticamente”, o WPML começará a traduzir o conteúdo em segundo plano. Você pode verificar o progresso da tradução acessando WordPress Dashboard > WPML > Translation Management ou pressionando o logotipo do WPML na barra de ferramentas.
À medida que o novo conteúdo for publicado ou editado, ele será traduzido automaticamente.
Para tradução automática, serão utilizados créditos WPML .
Porém, se for escolhido “Traduzir o que você escolher”, você deverá definir quem irá traduzir o conteúdo na etapa seguinte.
Se você não definiu todas as funções de tradução necessárias ao configurar o WPML, você pode fazer isso no Painel do WordPress > WPML > Gerenciamento de tradução > guia Tradutores. Você pode atribuir todas as funções imediatamente ou uma de cada vez – basta retornar a esta página mais tarde.
Observe que você pode alternar entre os modos posteriormente acessando WordPress Dashboard > WPML > Settings .
A quinta etapa, chamada Suporte , permite enviar dados de temas e plugins para o suporte WPML. Desta forma, você receberá alertas de compatibilidade que diminuirão os possíveis problemas de tradução de sites.
Na sexta etapa dos Plugins , instale os plugins recomendados com base nos temas do site ou pule se não estiver interessado.
A etapa final exibe informações adicionais que podem ajudá-lo a personalizar ainda mais o processo de tradução. Clique no botão “ Concluir ” para concluir a configuração.
Depois, vá para WordPress Dashboard > WPML > guia Configurações e defina o método de tradução para o novo conteúdo e as traduções criadas anteriormente na seção Editor de Tradução . Escolha “Clássico” ou “Avançado” para cada recurso.
Observe que sugerimos usar o “Editor de tradução avançado” para novos conteúdos e o “Clássico” para conteúdos antigos. Desta forma, não afetará as traduções antigas.
Depois de tudo feito, vamos traduzir o conteúdo gerado pelo JetEngine .
Traduzir metacaixas e metacampos
Inicialmente, você terá que tornar as Meta Boxes e Meta Fields traduzíveis. Para fazer isso, vá para a página WordPress Dashboard > WPML > Settings e role para baixo até Custom Fields Translation .
Uma barra de pesquisa no topo da lista permite encontrar metacampos rapidamente.
Por padrão, a opção “Não traduzir” está definida para todos os campos personalizados. Você pode selecionar uma das quatro opções de tradução para os campos personalizados usando botões de opção:
- Não traduza – o sistema produzirá os campos personalizados fornecidos “como estão”;
- Copiar – o valor do campo personalizado sempre será copiado para os idiomas secundários, independentemente de você decidir modificar o campo personalizado do idioma padrão ou não;
- Copiar uma vez – o valor do campo personalizado será copiado para a versão do site no idioma secundário durante o processo inicial de tradução. No entanto, você pode definir um valor diferente para ele que não será substituído pelo valor do campo personalizado do idioma padrão;
- Traduzir – você poderá traduzir esses campos onde quer que eles apareçam.
Quando todos os botões de opção estiverem marcados, clique no botão “ Salvar ”. Para ir ainda mais fundo, pressione o botão “ Mostrar campos do sistema ” (localizado sob o nome da seção Tradução de campos personalizados ) e você verá os componentes do sistema que podem ser traduzidos ou não.
No entanto, brincar com os campos do sistema pode ser complicado. Tenha cuidado e sempre faça um backup do conteúdo do seu site antes de alterar qualquer coisa no backend.
Devido a problemas de integração, alguns campos personalizados podem não ser selecionados pelo editor de tradução WPML. Veja a versão do site em segundo idioma no front-end e, se detectar uma falha, corrija-a manualmente executando as seguintes etapas:
- Vá para Painel do WordPress > Páginas > Todas as páginas e use o alternador de idioma da barra de administração para visualizar as páginas que pertencem a um determinado idioma;
- Clique para editar a página/post necessária;
- Você verá um aviso. Pressione o botão “ Editar mesmo assim ”;
- Insira as traduções ausentes manualmente e clique no botão “ Atualizar ” para salvar as alterações.
As equipes de desenvolvimento do Crocoblock e do WPML estão cientes desse problema e estão trabalhando para corrigi-lo.
Com relação aos metacampos, lembre-se de que você não deseja alterar nenhum atributo Field , exceto o Label . Se você alterar qualquer outra coisa, existe a possibilidade de o site não funcionar corretamente.
Traduzir campos multiopcionais
Já os metacampos que guardam diversas opções dentro, como Checkbox , Select ou Radio , eles precisam ser traduzidos de forma diferente.
Para traduzi-los, precisamos usar a funcionalidade Glossários do JetEngine .
Crie um glossário que será definido como fonte do metacampo.
Vá para a página onde seu editor de metacampo está localizado. Por exemplo, pode ser uma página de edição CPT ou uma meta box.
Nas configurações de metacampo necessárias, certifique-se de que a opção Obter opções do glossário esteja habilitada e o Glossário esteja selecionado.
Além disso, ative a opção Salvar como array .
Vá para o diretório WordPress Dashboard > WPML > String Translation e localize o rótulo do meta que você precisa. Você pode encontrá-lo manualmente ou usando a barra de pesquisa localizada acima dos itens.
Pressione o botão em forma de adição próximo ao rótulo do meta-campo necessário para adicionar sua tradução.
Em seguida, adicione a tradução às opções do metacampo Labels .
Traduza apenas os rótulos e não os valores .
Agora, o metacampo e suas opções podem ser verificados tanto para a versão original quanto para a traduzida.
Traduza o filtro JetSmartFilters com base no glossário criado com JetEngine
Vá para WordPress Dashboard > JetEngine > JetEngine e abra a guia Glossários .
Pressione o botão “ Novo Glossário ”.
Defina o Nome do glossário e defina sua Fonte de Dados . Pode ser “Definir itens manualmente” ou “Obter itens do arquivo carregado”.
Caso queira adicionar um novo item, pressione o botão “ Novo campo ”.
Cada item adicionado tem as seguintes configurações de personalização:
- Valor do campo — um valor exclusivo do item que deve conter apenas letras latinas minúsculas, sem espaços e pode conter números e símbolos “-” e “_”;
- Rótulo do campo — um nome do item exibido como seu rótulo;
- Está marcado (selecionado) — um botão de alternância que deve ser ativado se você quiser que o item seja selecionado por padrão.
Terminada a personalização do glossário, pressione o botão “ Salvar ”.
Em seguida, precisamos adicionar os metadados à fonte que queremos conectar ao filtro.
Isso pode ser feito no diretório WordPress Dashboard > JetEngine > Post Types se você deseja anexar o filtro a Custom Post Types ou WordPress Dashboard > JetEngine > Meta Boxes para ajustar uma meta box para outras fontes.
Por exemplo, vamos para WordPress Dashboard > JetEngine > Post Types e abrimos a página de edição de tipo de post existente.
Na seção Metacampos , clique no botão “ Novo Metacampo ” para criar um novo metacampo.
Preencha o rótulo e altere o nome/ID do campo, se necessário.
Em seguida, defina seu tipo de campo como “Checkbox” e selecione “Glossário” como fonte . Além disso, escolha um glossário que você acabou de criar.
Isso é tudo com a edição de metadados, então clicamos no botão “ Atualizar tipo de postagem ”.
Vá para as postagens do CPT editado e preencha o metacampo “Caixa de seleção” recém-adicionado.
A próxima etapa é garantir que você ativou a tradução para a origem atual e o campo personalizado. Para fazer isso, navegue até Painel do WordPress > WPML > Configurações .
Primeiro, rolamos para baixo até a seção Tradução de tipos de postagem , pois trabalhamos com CPT e precisamos garantir que ele possa ser traduzido. Encontramos o tipo de postagem necessário, definimos como “Traduzível” e pressionamos o botão “ Salvar ”.
Repita a mesma etapa com a fonte à qual o metacampo “Caixa de seleção” foi aplicado.
Em seguida, vá para a seção Campos personalizados . Encontre o campo “Caixa de seleção” que você criou (você pode fazer isso com a barra de pesquisa Pesquisar :), defina seu status como “Copiar” e clique no botão “ Salvar ”.
Depois de aplicar as alterações, vá para WordPress Dashboard > WPML > String Translation .
Aqui, encontre os rótulos dos campos do glossário e clique no botão “ mais ” ao lado deles para adicionar a tradução.
Traduza apenas os rótulos dos campos do glossário. Os valores devem ser deixados originais.
Conclua a tradução de todos os itens necessários.
Vá para Painel do WordPress > Filtros Inteligentes > Adicionar Novo para criar um novo filtro.
Defina o nome do filtro e selecione a opção “Lista de caixas de seleção” como tipo de filtro .
Em seguida, selecione sua fonte de dados como “Glossário JetEngine” e escolha o glossário necessário no campo Selecionar glossário correspondente .
Ative a alternância do campo Is Checkbox Meta (Jet Engine) enquanto trabalhamos com o campo “Checkbox” do JetEngine .
No campo Variável de Consulta , coloque o Nome/ID do metacampo “Checkbox” construído.
Preencha a seção Etiquetas de filtro e pressione o botão “ Atualizar ” para salvar o filtro.
Vá ao editor preferido para adicionar o conteúdo; pode ser Block Editor, Elementor ou Bricks. Por exemplo, trabalhamos em Elementor.
Na página, coloque o widget Language Switcher para poder alternar entre os idiomas posteriormente.
Adicione o widget Filtro de caixas de seleção à página de edição. Selecione o filtro necessário e defina seu provedor no campo Este filtro para .
Adicione o provedor à página. Por exemplo, adicionamos o widget Listing Grid .
Ajuste ainda mais a página, se necessário, e quando estiver pronto, pressione o botão “ Publicar/Atualizar ”.
Volte à lista de postagens do CPT e traduza o item clicando no botão “ mais ”.
Conclua a tradução de todos os itens do CPT .
Prossiga para o front-end para verificar o resultado. A princípio, vemos a versão original da página.
Assim que clicarmos na bandeira ucraniana, mudamos para a versão ucraniana da página.
Como você pode observar, o conteúdo já foi traduzido.
Vamos verificar como funciona o filtro selecionando as opções no Checkbox Filter .
A Grade de Listagem agora é filtrada pelas opções de Filtro de Caixa de Seleção .
Traduzir taxonomias
Vá para Painel do WordPress > WPML > Configurações . Role para baixo até Tradução de taxonomias e clique nos botões de opção “ Traduzir ” ao lado das taxonomias que você precisa para serem traduzidas. Pressione o botão “ Salvar ”.
Agora, siga o diretório WordPress Dashboard > WPML > Taxonomy Translation e escolha aquele para editar na lista suspensa. Aqui você pode ver o conteúdo que esta taxonomia inclui. Para adicionar uma tradução, pressione o ícone “ + ”.
Na janela recém-exibida, envie as traduções necessárias. O slug será gerado automaticamente. Tenha em mente que se houver slugs idênticos no site, o sistema adicionará um sufixo como “-uk”, onde “uk” é a abreviação do segundo (terceiro, quarto, etc.) idioma. Não se esqueça de pressionar o botão “ Salvar ” toda vez que editar o conteúdo da taxonomia.
Repita o mesmo processo para cada taxonomia que você definiu para ser traduzida.
Traduzir tipos de postagem personalizados e itens de listagem
Reconheça que, no momento, é impossível traduzir CCTs com WPML.
Vá para a página Painel do WordPress > WPML > Configurações e encontre a seção Tradução de tipos de postagem . Torne os tipos de postagem personalizados traduzíveis. Em seguida, clique no botão “ Salvar ” .
Aqui, os itens da listagem também podem ser definidos como traduzíveis.
Existem três opções disponíveis para você aqui:
- Traduzível – mostrar apenas itens traduzidos – marque este botão de opção para exibir no front end apenas os itens que você traduziu;
- Traduzível – use tradução se disponível ou retorne ao idioma padrão — esta opção produzirá a tradução do conteúdo se você a tiver fornecido, e os itens sem traduções ativas serão mostrados “como estão”;
- Não traduzível — uma opção autoexplicativa.
Depois, abra a guia Tipos de postagem no painel de administração e você verá pequenos ícones “+” aparecerem ao lado dos títulos dos tipos de postagem.
Pressione um desses botões para ser redirecionado para a janela do WPML Advanced Translation Editor. Traduza você mesmo toda a seção ou use a tradução automática. Não esqueça de confirmar cada linha separadamente; a escala inferior não permitirá que você desista até que esteja 100% cheia.
Você pode traduzir os itens da listagem exatamente da mesma maneira:
- Torne-os traduzíveis na seção Tradução de tipos de postagem ;
- Vá para Painel WordPress > JetEngine > Listagens ;
- Abra o Item de Listagem desejado clicando no ícone “+”;
- Insira a tradução manualmente ou automaticamente;
- Pressione “ Concluído ”.
Alguns tipos de postagem/itens de listagem podem não ter traduções na frente devido à má integração do plugin. Se você estiver usando um widget de plug-in de terceiros cuja compatibilidade com WPML não foi confirmada, não há garantia de que o conteúdo será traduzido. Você deve inserir as traduções que faltam manualmente na página de edição de postagem do Elementor ou do WordPress.
Traduzir lesmas CPT
Siga o caminho Painel do WordPress > WPML > Configurações .
Vá para a seção Traduções de slug para certificar-se de ter marcado a opção Traduzir postagem personalizada e slugs de base de taxonomia (via WPML String Translation) para permitir a tradução do slug.
Não se esqueça de apertar o botão “ Salvar ”.
Role para baixo até a seção Tradução de tipos de postagem e certifique-se de que o CPT necessário esteja definido para a opção “Traduzível” (funciona para ambas as opções disponíveis “Traduzível”).
Traduza os slugs pressionando “ Definir diferentes slugs em diferentes idiomas para {Seu nome CPT} ”.
Após essas etapas, os links permanentes devem ser atualizados. Vá para Painel do WordPress> Configurações> Links permanentes e pressione o botão “ Salvar alterações ”.
Links permanentes e regras de reescrita agora foram liberados.
Traduzir formulários JetEngine (legado)
Os formulários JetEngine podem ser traduzidos. Para fazer isso, vá para Painel do WordPress > WPML > Configurações , role para baixo até Tradução de tipos de postagem e ative o botão de opção “Traduzível” na linha Formulários .
Para traduzir qualquer formulário para o idioma de sua escolha, siga o diretório WordPress Dashboard > JetEngine > Forms e pressione o botão de adição ao lado do formulário desejado para adicionar uma tradução a ele.
Preencha a tradução do nome do formulário e pressione o botão “ Concluir ” para salvar o resultado.
Agora volte ao Formulários e clique no botão “ Editar ” para abrir o editor da versão traduzida do formulário.
Como o formulário traduzido não possui campos originais, crie-os novamente. Desta vez, complete seus rótulos com versões traduzidas e salve-os clicando no botão “ Aplicar alterações ”.
Depois que os campos estiverem concluídos, navegue até as seções Configurações de mensagens e traduza as notificações.
Em seguida, pressione o botão “ Atualizar ” para salvar o formulário.
Vá para Painel do WordPress > Páginas e abra o editor de versão traduzida da página onde o formulário foi adicionado originalmente.
Adicione um formulário à página e, no campo Selecionar formulário , escolha a versão traduzida do formulário.
Quando a página estiver pronta, você poderá atualizá-la.
Observe que os formulários JetBooking e JetAppointment não podem ser traduzidos. Iremos abordá-los nos próximos tutoriais. Além disso, os formulários do Profile Builder não podem ser traduzidos com WPML. Portanto, como o WPML não consegue traduzir a página da conta com o Profile Builder , os formulários não funcionam corretamente. A única opção é duplicá-los para o idioma secundário necessário e traduzi-los conforme descrito acima.
Configurar cabeçalho e rodapé baseados em idioma para páginas geradas dinamicamente
Por último, mas não menos importante, você precisa traduzir os modelos de cabeçalho e rodapé, pois eles estarão sempre presentes nas páginas do site no idioma secundário.
A funcionalidade a seguir funciona se o plugin JetThemeCore estiver instalado e ativado.
Em primeiro lugar, vá para Painel do WordPress > WPML > Configurações e role para baixo até a seção Tradução de tipos de postagem . Encontre a linha Theme Parts e defina-a como “Traduzível”. Salve as alterações.
Em segundo lugar, vá para a guia WordPress Dashboard> Crocoblock> JetPlugins Settings no painel de administração do WordPress e abra as configurações do plugin JetThemeCore .
Ative a alternância de registro de locais do Prevent Pro na guia Configurações gerais . Isso evitará que os modelos de cabeçalho e rodapé desapareçam nas páginas do site no segundo idioma.
Em terceiro lugar, traduza os modelos de cabeçalho e rodapé correspondentes para outros idiomas do site. Para fazer isso, siga o caminho WordPress Dashboard > Crocoblock > Theme Builder . Localize o modelo necessário e pressione o ícone “ + ” a seguir.
Adicione as traduções como faria normalmente para um modelo de página normal no Advanced Translation Editor . Feito isso, clique no botão “ Concluir ”. Repita o procedimento para os modelos de cabeçalho e rodapé.
A tradução do cabeçalho é complicada, pois geralmente contém widgets de outros plugins e um menu de navegação. Para traduzi-lo completamente, você terá que sincronizar todas as versões do site em todos os idiomas.
Siga o caminho WordPress Dashboard > WPML > WP Menus Sync . Pressione o botão “ Sincronizar ” para criar primeiro um menu no idioma secundário. Confirme a ação clicando no botão “ Aplicar alterações ” assim que vê-lo.
Uma vez feito isso, prossiga para traduzir as strings do menu. Abaixo do botão “ Sincronizar ”, há algumas informações adicionais. O primeiro ponto contém um link para as sequências de menu necessárias. Clicar nele o levará ao módulo String Translations WPML. Adicione as traduções que faltam, uma por uma, incluindo links.
Lembre-se de fornecer os links para as páginas reais do idioma secundário. Caso contrário, os itens de menu traduzidos ainda levarão os usuários às páginas do site no idioma padrão.
Por exemplo, o slug de URL em inglês se parece com isto: /properties/ocean-star-luxury-cottage/ . E este é o seu contratipo ucraniano: /properties-uk/ocean-star-luxury-cottage/?lang=uk .
Quando terminar de traduzir as sequências de menu, retorne à guia WP Menus Sync . Você verá que agora existem traduções disponíveis em idiomas secundários. Pressione novamente os botões “ Sincronizar ” e “ Aplicar alterações ” para finalizar o processo de tradução do menu.
Confira o resultado no front-end. O modelo de cabeçalho é exibido corretamente; além disso, todos os itens do menu aparecem no idioma secundário necessário.
Traduzir campos meta da página de opções
Prossiga para Painel do WordPress > WPML > Tradução de strings . Pressione o botão “ Traduzir textos nas telas de administração ”.
Encontre o metacampo necessário na lista. Na barra de pesquisa, escreva o nome do campo (não slug) e pressione o botão de pesquisa.
Сlique no botão em forma de adição para adicionar uma tradução.
Adicione a tradução correspondente e pressione “ Enter ”no teclado.
O resultado pode ser verificado no front-end. O nome do metacampo agora é traduzido para o outro idioma clicando no botão correspondente.
Traduzir Relações
Para traduzir as conexões de relacionamento do JetEngine com o WPML , você deve recriar as etapas a seguir.
Inicialmente, você deve traduzir os itens que serão definidos como itens filho e pai.
Vá para Painel do WordPress > WPML > Configurações e defina dois elementos necessários como “Traduzível”.
Por exemplo, podem ser dois tipos de postagem como no caso descrito. Então, rolamos para baixo até a seção Tradução de tipos de postagem e definimos dois tipos de postagem como “Traduzíveis”.
Em seguida, navegamos até um dos Post Types e traduzimos todos os seus itens clicando no botão em forma de adição ao lado deles.
Em seguida, repetimos o mesmo passo para o segundo tipo de postagem: traduza seus itens.
Agora podemos criar uma relação .
Uma vez construída a relação, os itens podem ser conectados.
Agora você sabe como usar o WPML para traduzir metacaixas e campos do JetEngine , formulários, taxonomias, CPTs e itens de listagem e sincronizar os menus do site em diferentes idiomas.