Este guest post é trazido a você por Daan, do wplift.com. Ele lançou recentemente o EasyThemePacks, uma incrível biblioteca premium de modelos do Elementor. Ele vai mostrar a você exatamente como traduzi-los com o WPML.
Se você é um usuário regular do Elementor, provavelmente já está bem familiarizado com a forma como o Elementor permite que você crie designs lindos sem a necessidade de código. Mas o Elementor também pode ajudar você a criar lindos designs multilíngues?
Boa notícia: com o WPML, sim, ele pode!
Ao final deste tutorial, você saberá exatamente como começar a criar sites multilíngues construídos com o Elementor, mesmo se estiver usando a opção totalmente em branco Elementor Canvas.
O que você precisa para criar um site multilíngue com o Elementor
Aqui está tudo o que você precisará para acompanhar este tutorial:
- Uma página que você criou com o Elementor – estamos usando o modelo Barista Bluegrass do EasyThemePacks, que é um design completo de landing page baseado no modelo em branco Elementor Canvas.
- WPML Multilingual CMS – é isso que ajuda você a criar um site WordPress multilíngue, incluindo seu conteúdo do Elementor.
Você também precisará se certificar de instalar os outros componentes do pacote WPML Multilingual CMS, especialmente o WPML Tradução de Strings e o WPML Gerenciamento de tradução.
Depois de ter esses itens essenciais, vamos ver como você pode usar o WPML para criar um site multilíngue no Elementor!
Passo 1: Instale e ative o WPML CMS e seus componentes
Depois de instalar o WPML Multilingual CMS e seus componentes, você pode passar pelo Setup Wizard do WPML para definir suas configurações básicas de idioma (como para quais idiomas você quer traduzir seus designs do Elementor).
Para este exemplo, vamos traduzir nosso modelo para o alemão (com o Google Tradutor – desculpem por quaisquer erros, puristas da gramática alemã!):
Certifique-se de também ativar o gerente de tradução (o WPML solicitará que você faça isso no seu painel – é difícil não ver e você só precisa clicar em um botão).
Passo 2: Vá para a página do Elementor que você quer traduzir
Depois de definir as configurações básicas do WPML, vá para o editor do painel do WordPress para a página do Elementor que você quer traduzir (não abra o editor do Elementor – fique no editor normal do WordPress).
Aqui está a aparência do modelo Barista Bluegrass do EasyThemePacks em seu inglês nativo:
Em apenas alguns minutos, poderemos traduzi-lo para o alemão!
Passo 3: Crie uma nova tradução para o seu design do Elementor
No Editor do WordPress, clique no ícone + para criar uma nova tradução do seu design do Elementor:
Isso abrirá um prático editor lado a lado. No lado esquerdo, você verá todas as informações da tradução original em inglês. O WPML extrai cada string individual do seu design do Elementor, bem como outros atributos úteis (como o URL para o qual um botão aponta, para que você possa enviar os usuários para a tradução correta).
Para começar a traduzir seu modelo do Elementor, você só precisa inserir a tradução na caixa correspondente no lado direito:
Conforme você avança, certifique-se de marcar cada tradução como A tradução está concluída para que você possa saber rapidamente o que já foi feito e o que ainda precisa ser traduzido. Além disso, embora você sempre possa salvar o trabalho parcial, não será possível exibir sua tradução no front-end até que você tenha marcado tudo como concluído.
Quando você terminar suas traduções e salvá-las, estará pronto! Agora, você poderá editar sua tradução existente sempre que necessário:
E se você for para o front-end do seu site, poderá acessar a versão traduzida da sua página alterando o URL de acordo com as suas preferências (falaremos mais sobre como criar um seletor de idiomas em um segundo!).
Aqui está a aparência da versão traduzida do nosso modelo do EasyThemePacks, incluindo a estrutura do URL para que você possa ver como tudo está localizado:
E se você mudar o design original do Elementor?
Em algum momento, você provavelmente vai se deparar com uma situação em que vai querer mudar a versão original do design do Elementor.
Então, o que acontece depois? Você perderá seu conteúdo traduzido depois de fazer as alterações?
Não!
Se você usar a interface do Elementor para editar a tradução existente da sua página, o WPML simplesmente marcará essas traduções no editor e dará a você uma opção para mostrar as diferenças:
O WPML não fará nada com as strings já traduzidas que não foram alteradas. Então, tudo o que você precisa fazer é atualizar o texto editado e pronto!
E o seletor de idiomas com o modelo Elementor Canvas?
Todos os designs do EasyThemePacks são baseados no uso do modelo em branco Elementor Canvas. E se você estiver criando suas próprias páginas com o Elementor, há uma boa chance de você também usar o modelo em branco Elementor Canvas.
Quando você usa esse modelo, não há menu de navegação ou barra lateral do seu tema, que são os dois lugares onde você normalmente adicionaria um seletor de idiomas com o WPML.
Então... como você realmente permite que os visitantes acessem a versão traduzida do seu modelo do Elementor quando você está usando o Elementor Canvas?
Embora você possa criar seu próprio seletor de idiomas do WPML usando código, a maneira mais fácil é simplesmente incluir um shortcode de seletor de idiomas no seu modelo do Elementor.
Para fazer isso, coloque o widget Shortcode do Elementor onde você quer que ele seja exibido e inclua este shortcode:
{{wpml_language_selector_footer}}
Esse shortcode extrairá as configurações do seu seletor de idiomas de rodapé do WPML. Para definir essas configurações, vá para WPML → Idiomas no seu painel do WordPress e role para baixo até a seção Seletor de idiomas de rodapé :
Quando você clica no ícone de lápis, poderá configurar como o seu seletor de idiomas funciona. Você pode:
- Mudar o layout
- Escolher se quer ou não exibir nomes de idiomas e bandeiras
- Escolher um novo esquema de cores
- Configurar os estilos de elementos individuais
Como dica, usar o nome de um idioma é uma ótima opção, pois permite que as pessoas pesquisem por seu idioma local usando CTRL + F.
Considerações finais sobre como traduzir o Elementor
Com o pacote WPML Multilingual CMS, é fácil traduzir qualquer modelo de página do Elementor, incluindo aqueles baseados no Elementor Canvas, como os modelos premium disponíveis no EasyThemePacks. Você pode avançar string por string para traduzir todo o conteúdo que você constrói com o construtor de páginas visual do Elementor. E se você fizer qualquer alteração no seu design original do Elementor no futuro, o WPML ajudará você a encontrar essas alterações para garantir que você também atualize a versão traduzida.
Por fim, mesmo se você estiver usando o modelo em branco Elementor Canvas, ainda poderá incluir um seletor de idiomas fácil de usar por meio dos shortcodes do WPML ou do método de código personalizado que vinculamos.
Tem alguma outra dúvida sobre como traduzir seus designs do Elementor? Deixe um comentário!
