Central de Ajuda Wix
    Início
  1. Crie o seu site
  2. Recursos avançados
  3. CMS
  4. Conecte elementos de entrada do usuário ao CMS
    5. CMS: adicionar e configurar um controle deslizante

CMS: adicionar e configurar um controle deslizante

4 min de leitura
Ofereça aos visitantes uma maneira de filtrar os itens que aparecem no seu site ao arrastar os sliders para selecionar um intervalo de valores. Por exemplo, se você tiver uma loja online, você pode usar um slider para permitir que os clientes filtrem os produtos por preço, fazendo com que eles encontrem com maior facilidade itens dentro do seu orçamento. 

Após adicionar um controle deslizante, conecte-o a um conjunto de dados que se conecta ao repetidor ou galeria que você deseja que os visitantes filtrem. Em seguida, escolha um tipo de campo de número a ser usado para o filtro e a condição. A condição determina se deseja mostrar itens que têm valores de campo entre o intervalo selecionado ou fora do intervalo. Por fim, personalize o título do campo e o layout e o design do elemento. 
 
Quaisquer filtros ou classificações que você aplica ao conjunto de dados também se aplica aos elementos conectados. Isso significa que você pode adicionar filtros ao conjunto de dados para excluir itens da exibição e adicionar classificações para controlar sua ordem. 
Uma captura de tela mostrando um elemento de controle deslizante com o título
Importante:
O controle deslizante não está disponível no Editor X ou no Editor do Wix Studio. 
Antes de começar:

Para adicionar e configurar um controle deslizante:

  1. Vá para o seu editor.
  2. Adicione o elemento de entrada Controle deslizante: 
    1. Vá para a página ou seção onde você deseja que os visitantes filtrem conteúdo por um valor numérico. 
    2. Clique em Elementos  no lado esquerdo do editor.
    3. Clique em Entrada.
    4. Clique em Slider.
    5. Role para baixo até Controles deslizantes, clique e arraste o controle deslizante relevante para a página.  
Captura de tela de um controle deslizante sendo adicionado no Editor Wix.
  1. Conecte o controle deslizante ao CMS:
    1. Clique no ícone Conectar ao CMS  no controle deslizante. 
    2. Selecione Filtrar conteúdo no painel Conectar controle deslizante à direita. 
    3. Clique no dropdown Escolha um conjunto de dados e selecione o mesmo conjunto de dados que se conecta aos elementos (por exemplo: repetidor, galeria, tabela) que você deseja que os visitantes filtrem. 
    4. Clique no dropdown Filtrar conteúdo por e escolha o campo de número que os visitantes usarão para filtrar o conteúdo.
      Dica: para adicionar um novo campo à sua coleção e usá-lo para filtrar conteúdo, selecione Adicionar novo campo, insira o nome do campo e clique em Adicionar. Você pode adicionar conteúdo ao campo na sua coleção do CMS posteriormente. 
    5. Clique no dropdown Condição e selecione a condição relevante:
      • Entre: mostra itens que têm um valor de campo numérico conectado que está entre as alças do controle deslizante.
      • Fora: mostra itens que têm um valor de campo numérico conectado que está fora das alças do controle deslizante.
Captura de tela de um controle deslizante sendo conectado a um conjunto de dados e campo da coleção.
  1. Personalize o elemento do controle deslizante: 
    • Clique em Configurações para personalizar o seguinte: 
      • Título do campo: edite o nome que é exibido no controle deslizante e permite que os visitantes saibam o que ele faz.
      • Tipo de slider: escolha um tipo de slider (contínuo ou etapa por etapa): 
        • Contínuo: os usuários podem selecionar qualquer valor dentro do intervalo definido. 
        • Etapa por etapa: os visitantes podem selecionar valores incrementais específicos dentro do intervalo definido. Configure as seguintes opções: 
          • Definir etapas por: clique no dropdown e escolha como deseja definir as etapas:
            • Número de etapas: você escolhe quantas etapas aparecem no controle deslizante. Insira o número de etapas no campo Etapas. 
            • Valor da etapa: você escolhe os incrementos de valor de cada etapa, até 100. Insira o valor dos incrementos no campo Valor. 
          • Etiquetas de valor: (opcional) insira um prefixo no campo Prefixo para que ele apareça antes do valor (por exemplo: R$). Você também pode inserir um sufixo no campo Sufixo para que ele apareça após o valor.  
    • Clique no ícone Layout  para ajustar:
      • O tamanho e a forma das alças do controle deslizante.
      • A altura (espessura) da faixa na qual as alças deslizam.
      • Escolha uma direção de exibição do intervalo Esquerda para direita ou Direita para esquerda.
      • O alinhamento, o deslocamento e o espaço ao redor do título do campo.
      • (Apenas para etapas) Escolha um layout: Linhas ou Pontos. 
    • Clique no ícone Design  para escolher um design predefinido e personalizá-lo ainda mais. 
Captura de tela das configurações do controle deslizante sendo ajustadas.
  1. Clique em Visualizar para testar seu controle deslizante. 
  2. Clique em Publicar se as alterações estiverem prontas para ser publicadas. 

Esse artigo foi útil?

|