¿Cómo cambiar el diseño del conmutador de idiomas?

En este artículo, aprenderá a personalizar el conmutador de idiomas y a cambiar su aspecto.


Con Weglot, puede cambiar el diseño de su conmutador de idiomas. Para ello, dispone de varias posibilidades:


1. Cambiar las opciones del conmutador de idiomas

Si va a su Weglot Dashboard > Proyectos > Seleccionar un proyecto >Configuración > Conmutador de idioma, tendrá la opción de cambiar algunos elementos y la visualización:

  • El nombre del idioma (como "en" para el inglés, por ejemplo)
  • El nombre completo de la lengua
  • Las banderas lingüísticas y el tipo de banderas (cuadrado, círculo, rectángulo)
  • El tipo de conmutador (lista/desplegable)

Si realiza algún cambio aquí, asegúrese de hacer clic en "Guardar cambios".

También puede encontrar la sección "Apariencia de los idiomas" más abajo en la página, donde puede arrastrar y soltar el idioma que desee y cambiar su posición en el conmutador de idiomas:

Esta sección le permite cambiar las banderas que aparecen en su conmutador de idiomas. Puede mostrar la bandera de otro país o su propia bandera. También puede modificar el aspecto del conmutador de lenguas cambiando los nombres de las lenguas y las banderas mostradas. (Véase: ¿Cómo puedo cambiar las banderas del conmutador de lenguas?)


2. Edite el nombre de la lengua y la bandera

Para cambiar el nombre y la bandera del idioma, puede ir a la misma página, es decir, a su Weglot Dashboard > Proyectos > Seleccionar un proyecto > Configuración > Conmutador de idioma.

Vaya a la sección "Apariencia de las lenguas" y utilice el bolígrafo de la derecha.

Allí, puede editar el nombre del idioma, para tener el nombre que desea que se muestre en su conmutador en su sitio web en vivo:

Una vez modificada la sección "Nombre de la lengua local", puede hacer clic en el botón "Editar".

Para cambiar la bandera, asegúrese de que ha activado la opción "Mostrar banderas de idioma en el botón" en los ajustes de su conmutador.

En la sección "Apariencia de las lenguas", haga clic en "Seleccionar una bandera" para seleccionar una bandera (1). También puede utilizar la barra de búsqueda (2) para ayudarle a encontrar una bandera:

Ahora, vuelva a su página web y podrá ver la bandera recién añadida en el conmutador de idiomas. Siguiendo nuestro ejemplo, a continuación tenemos la bandera de los Estados Unidos de América:

Además, si desea eliminar la bandera añadida anteriormente y volver a la bandera original, haga clic en"Seleccionar una bandera" en el selector de banderas, y debería eliminar la bandera:


3. Utilice el editor de conmutadores

Para el uso general del Editor de Conmutadores, consulte la siguiente documentación específica:

¿Cómo utilizar el editor de conmutadores?

En su interior encontrará varias secciones para crear su propio diseño de conmutador o utilizar algunas de las plantillas de Weglot.

Para utilizar uno, consulte la sección Estilo del conmutador:

Una vez dentro de la sección, encontrará un lote de plantillas que podrá utilizar para su sitio web.

Sólo tiene que hacer clic en él para seleccionarlo y colocarlo donde desee en su página web.


4. Añada custom CSS

En su Weglot Dashboard > Configuración > Conmutador de idiomas, tiene la opción de añadir algunos custom CSS:

Siéntase libre de inspirarse en diferentes estilos y añadir su propio CSS. Encontrará algunos ejemplos de custom CSS en la siguiente parte.


5. Cree su propio conmutador personalizado

Si prefiere tener su propio conmutador diseñado para que coincida con los códigos CSS de su sitio web, puede crear un conmutador personalizado.

Tendrá que configurar usted mismo su diseño y utilizar las funciones de Weglot para que los enlaces se dirijan a las lenguas que elija.

Para ello, eche un vistazo a nuestra documentación para desarrolladores sobre las funciones JavaScript útiles que puede utilizar:

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


¿Tiene algún comentario sobre este artículo? ¡Háganoslo saber!

¿Responde esto a su pregunta? Gracias por sus comentarios Ha habido un problema al enviar su comentario. Vuelva a intentarlo más tarde.

¿Aún necesita ayuda? Contacte con nosotros Contacte con nosotros