MultiLipi Le brinda control total sobre cómo se ve y se comporta su conmutador de idioma, tanto en la vista de escritorio como en la vista móvil. Ya sea que esté buscando una integración de diseño perfecta o una accesibilidad más visible, la personalización de su conmutador puede mejorar la experiencia del usuario y mantener la coherencia del diseño en páginas multilingües.

Guía de configuración paso a paso

1. Vaya a la configuración del conmutador de idioma

Para empezar a personalizar el selector de idiomas:

  • Vaya a su Panel de control MultiLipi

  • Escoger Conmutador de idioma del Configuración en el menú de la izquierda.
    Navegación en la barra lateral que resalta la opción de configuración del conmutador de idioma

2. Edite el diseño y la apariencia del conmutador

Una vez dentro del Editor de Switches, verás un panel de control dedicado con opciones de personalización para ambos Escritorio y Móvil Interfaces. Cambiar el panel Editor que muestra las opciones de alternancia de escritorio y móvil

3. Plantilla (estilo conmutador)

Elija entre los estilos de conmutador predefinidos que mejor se adapten a la interfaz de usuario de su sitio web: Menú desplegable de estilo de conmutador de idioma con plantillas prediseñadas

4. Colocación del conmutador

Establezca la posición del selector de idioma en la pantalla:

  • Flotante (posicionamiento basado en esquinas como abajo a la izquierda)
  • Incrustado (insertado en un elemento HTML específico)

La lógica de reserva garantiza que el conmutador vuelva a flotar si no se encuentra el punto incrustado.

Opciones de posición para el conmutador de idioma, incluida la ubicación flotante e integrada

5. Personaliza los colores del conmutador

Elige tu propia paleta de colores para que coincida con tu marca. Poner:

  • Color de fondo
  • Color del texto

Utilice valores RGB o el selector de color incorporado. Panel de personalización de color para el conmutador de idioma

6. CSS personalizado avanzado (opcional)

Para un control total, inyecta tus propias reglas CSS para diseñar el conmutador exactamente como quieras.

Ejemplo:

Css- CopiarEditar

#lang-switcher-selected-lang .fi {

radio del borde: 0px;

}

#dynamicDropdown {

/* tus estilos */

}

Área de texto CSS personalizada para una personalización avanzada del conmutador de idioma

7. Guardar o restablecer

  • Clic Salvar para aplicar los cambios.

  • Clic Restablecimiento para volver al diseño predeterminado.

Vista previa final

Todas las personalizaciones se previsualizan instantáneamente en tiempo real, lo que le permite alternar entre los modos de escritorio y móvil para garantizar la coherencia en todos los tipos de dispositivos.

Terminando

El editor de conmutadores de idiomas de MultiLipi te permite:

  • Elige tu estilo de pantalla ideal
  • Ajustar la posición exacta
  • Haz coincidir los colores con el tema de tu sitio web
  • Utilice CSS personalizado para una flexibilidad total

Perfecciona tu experiencia de usuario para audiencias multilingües, todo con unos pocos clics.