Como alterar o design do alternador de idioma?

Neste artigo, aprenderá a personalizar o seletor de idioma e a alterar o seu aspeto.

Com o Weglot, pode personalizar o aspeto do seu seletor de idiomas. Existem várias formas de o fazer:

1. Alterar as opções do alternador de idiomas

Para personalizar o seletor de idiomas, aceda ao Painel de Controlo do Weglot > Projetos > Selecione um projeto > Definições > Seletor de idiomas.

A partir daí, pode personalizar várias opções de visualização, incluindo:

• O nome do idioma (por exemplo, «en» para o inglês)
• O nome completo da língua
• As bandeiras linguísticas e o tipo de bandeiras (quadrado, círculo, retângulo)
• O tipo de comutador (lista/deslocação)

Se efetuar quaisquer alterações aqui, certifique-se de que clica em "Guardar alterações".

Mais abaixo na página, encontrará a secção «Idiomas e Aparência». Aqui, pode arrastar e largar os idiomas para alterar a ordem em que aparecem no seletor de idiomas.

Esta secção permite-lhe personalizar as bandeiras e os nomes dos idiomas apresentados no seletor de idiomas.

2. Editar o nome e a bandeira da língua

Para alterar o nome e a bandeira do idioma, pode aceder à mesma página, ou seja, ao seu Painel de Controlo do Weglot > Projetos > Selecionar um projeto > Definições > Seletor de idioma.

Vá à secção "Aparência das línguas" e utilize a caneta à direita.

Aí, pode editar o nome do idioma para que seja exibido o nome que deseja no seletor do seu site ativo:

Depois de alterar a secção «Nome do idioma local», pode clicar no botão «Guardar».

Para alterar a bandeira, certifique-se de que ativou a opção «Mostrar bandeiras de idioma no botão» nas definições do seletor.

Também pode clicar em «Selecionar uma bandeira» para selecionar uma bandeira. Pode utilizar a barra de pesquisa para o ajudar a encontrar uma bandeira:

Agora, volte ao seu site e poderá ver a bandeira recém-adicionada no seletor de idiomas.

Além disso, se quiseres remover a bandeira adicionada anteriormente e voltar à bandeira original, clica em«Selecionar uma bandeira» no seletor de bandeiras, e a bandeira será removida:

3. Utilizar o Switcher Editor

Para uma utilização geral do Switcher Editor, consulte a seguinte documentação específica:

Como utilizar o Switcher Editor?

Encontrará várias secções para criar o seu próprio design de comutador ou para utilizar alguns dos modelos Weglot.

Para utilizar um, consulte a secção Estilo do Switcher:

Uma vez dentro da secção, encontrará uma série de modelos para utilizar no seu sítio Web.

Basta clicar nele para selecionar um e colocá-lo onde quiser na sua página Web.

4. Adicionar algumas CSS personalizadas

NoPainel de Controlo doWeglot > Definições > Seletor de idioma, tem a opção de adicionar algum CSS personalizado:

Sinta-se à vontade para se inspirar em diferentes estilos e adicionar as suas próprias CSS. Encontrará alguns exemplos de CSS personalizadas na próxima parte.

5. Criar o seu próprio comutador personalizado

Se preferir ter o seu próprio comutador concebido para corresponder aos códigos CSS do seu sítio Web, pode criar um comutador personalizado.

Terá de ser você a configurar o seu design e utilizar as funções Weglot para que as ligações sejam direcionadas para as línguas escolhidas.

Para o fazer, consulte a nossa documentação para programadores sobre as funções JavaScript úteis a utilizar:

https://developers.weglot.com/javascript/link-hooks

Tem alguma opinião sobre este artigo? Diga-nos!