Centro de Ayuda Wix
    Inicio
  1. Crear tu sitio
  2. Funciones avanzadas
  3. CMS
  4. Conectar elementos de entrada del usuario al CMS
    5. CMS: agregar y configurar un deslizador de rango

CMS: agregar y configurar un deslizador de rango

5 min de lectura
Ofrece a los visitantes una forma de filtrar los ítems que aparecen en tu sitio arrastrando los controles deslizantes para seleccionar un rango de valores. Por ejemplo, si tienes una tienda online, puedes usar un deslizador de rango para permitir que los clientes filtren los productos por precio, lo que les facilita encontrar los artículos que se ajusten a su presupuesto. 

Después de agregar un deslizador de rango, conéctalo a un conjunto de datos que se conecte al repetidor o a la galería que deseas que filtren los visitantes. Luego, elige un tipo de campo numérico para usar para el filtro y la condición. La condición determina si se muestran ítems que tienen valores de campo dentro del rango seleccionado o fuera del rango. Por último, personaliza el título del campo y el estilo y el diseño del elemento deslizante. 
 
Cualquier filtro o clasificación que aplicas al conjunto de datos también se aplica a los elementos conectados. Esto significa que puedes agregar filtros al conjunto de datos para excluir ítems y agregar clasificaciones para controlar su orden. 
Captura de pantalla que muestra un elemento de deslizador de rango con el título
Importante:
El deslizador de rango no está disponible en el Editor X ni en el Editor de Wix Studio. 
Antes de comenzar:

Para agregar y configurar un deslizador de rango:

  1. Ve al editor.
  2. Agrega el elemento de entrada Deslizador de rango: 
    1. Ve a la página o la sección donde deseas que los visitantes filtren el contenido por un valor numérico. 
    2. Haz clic en Agregar elementos  a la izquierda del editor.
    3. Haz clic en Elementos de entrada.
    4. Haz clic en Control deslizante.
    5. Desplázate hacia abajo hasta Deslizador de rango, luego haz clic y arrastra a la página el deslizador de rango correspondiente.  
Captura de pantalla que muestra cómo agregar un deslizador de rango en el Editor de Wix.
  1. Conecta el deslizador de rango al CMS:
    1. Haz clic en el icono Conectar a CMS  en el deslizador de rango. 
    2. Selecciona Filtrar contenido en el panel Conectar deslizador de rango a la derecha. 
    3. Haz clic en el menú desplegable Elige un conjunto de datos y selecciona el mismo conjunto de datos que se conecta a los elementos (por ejemplo, repetidor, galería, tabla) que deseas que filtren los visitantes. 
    4. Haz clic en el menú desplegable Filtrar contenido por y elige el campo numérico que los visitantes usarán para filtrar el contenido.
      Consejo: Para agregar un nuevo campo a la colección y usarlo para filtrar contenido, selecciona Agregar nuevo campo, luego ingresa el nombre del campo y haz clic en Agregar. Puedes agregar contenido al campo en tu colección del CMS más tarde. 
    5. Haz clic en el menú desplegable Condición y selecciona la condición correspondiente:
      • Dentro del rango: muestra los ítems que tienen un valor de campo numérico conectado que se encuentra entre las manillas del deslizador de rango.
      • Fuera del rango: muestra los ítems que tienen un valor de campo numérico conectado que está fuera de las manillas del deslizador de rango.
Captura de pantalla que muestra cómo conectar un deslizador de rango a un conjunto de datos y un campo de colección.
  1. Personaliza el elemento Deslizador de rango: 
    • Haz clic en Ajustes para personalizar lo siguiente: 
      • Título del campo: edita el nombre que se muestra en el deslizador de rango y permite que los visitantes sepan lo que hace.
      • Tipo de control deslizante: elige un tipo de control deslizante continuo o escalonado: 
        • Continuo: los visitantes pueden seleccionar cualquier valor dentro del rango establecido. 
        • Escalonado: los visitantes pueden seleccionar valores incrementales específicos dentro de un rango establecido. Configura las siguientes opciones: 
          • Escalonar por: haz clic en el menú desplegable y elige cómo deseas configurar los pasos:
            • Número: tú eliges cuántos pasos aparecen en el deslizador de rango. Ingresa el número de pasos en el campo Número de pasos. 
            • Valor: eliges los incrementos de valor de cada paso, hasta 100. Ingresa el valor de los incrementos en el campo Valor del paso. 
          • Etiquetas de valor: (opcional) ingresa un prefijo en el campo Prefijo para que aparezca antes del valor (por ejemplo, $). También puedes ingresar un sufijo en el campo Sufijo para que aparezca después del valor.  
    • Haz clic en el icono Estilo  para ajustar lo siguiente:
      • El tamaño y la forma de las manillas del deslizador de rango.
      • La altura (grosor) de la pista por el que se deslizan las manillas.
      • Elige una dirección de visualización del rango de Izquierda a derecha o de Derecha a izquierda.
      • Ajusta la alineación, la delimitación y el espacio alrededor del título del campo.
      • (Solo pasos) Elige un estilo: Líneas o Puntos. 
    • Haz clic en el icono Diseño  para elegir un diseño preestablecido y personalizarlo aún más. 
Captura de pantalla que muestra cómo ajustar la configuración del deslizador de rango.
  1. Haz clic en Vista previa para probar el deslizador de rango. 
  2. Haz clic en Publicar si lo tienes todo listo para publicar los cambios. 

¿Te ha sido útil?

|