Bloco de rolagem

Adicione um fluxo horizontal dinâmico de texto à sua página para capturar a atenção dos visitantes.

Ultima atualização 10 de Abril de 2024

Use o bloco de rolagem para adicionar um texto que rola horizontalmente pela página, como uma marquise de cinema ou um ticker de notícias. Uma ótima opção para dar um toque visual ao seu texto ou para atrair os olhos dos visitantes para informações importantes.

Assista a este vídeo

Adicione um bloco de rolagem

Para adicionar um bloco de rolagem:

  1. Edite uma página ou publicação, clique em Adicionar bloco ou num ponto de inserção e, em seguida, clique em Rolagem. Para ajuda, confira "Adição de conteúdo com blocos".
  2. Para abrir o editor do bloco, clique no ícone de lápis no bloco.
  3. Na aba Conteúdo, adicione ou edite itens de texto.
  4. Para transformar o bloco de rolagem num link clicável, adicione um endereço da web no campo Link; ou clique em "a para adicionar outro tipo de link. Ao clicar no bloco de rolagem, o visitante é levado para o link que você adicionou.
  5. Clique em Design para personalizar o bloco.
A_scrolling_block_with_the_text_Dream_It.gif

Anotação

nos aparelhos iOS, os blocos de rolagem não funcionarão se o visitante estiver com o recurso de acessibilidade "Reduzir movimento" ativado.

Adicione e edite itens de texto

Quando você adiciona um bloco de rolagem, já vêm incluídos dois itens. Um inclui o texto Sonhe e o outro inclui um emoji de “til” que funciona como divisor.

Você pode adicionar novos itens ou editar os itens existentes com um texto seu.

Adicione um novo item

Para adicionar um novo item:

  1. Clique em Editar na página com o bloco de rolagem, clique no bloco e, em seguida, clique no ícone de lápis ou em Editar.
  2. Na aba Conteúdo, clique em Adicionar item.
  3. Isso cria um novo item com o texto padrão. Para editar o texto, clique no item na lista e depois clique no campo Texto.

Edite um item

Para editar, duplicar ou apagar um item, clique nesse item na aba Conteúdo do editor do bloco. Edite o texto no campo; ou clique em Duplicar ou em Apagar.

Você também pode apagar o item diretamente na aba Conteúdo - basta clicar no ícone da lixeira.

Reorganize os itens

A lista de itens na aba Conteúdo define a ordem da rolagem do texto. Para reorganizar os itens:

  1. Clique em Editar na página com o bloco de rolagem, clique no bloco e, em seguida, clique no ícone de lápis.
  2. Na aba Conteúdo, clique e segure o ícone:: à esquerda do título do item.
  3. Arraste o item para a posição desejada na lista.
  4. Repita o procedimento com os outros itens até que a lista fique na ordem desejada.

Personalizar o design

Na aba Design do editor do bloco, você pode personalizar o visual do bloco de rolagem de várias formas. Recomendamos testar diferentes configurações até achar uma combinação do seu gosto.

Cada bloco de rolagem tem as próprias configurações de design. Não é possível aplicar automaticamente uma configuração a todos os blocos de rolagem no site.

Texto em ondas

Para adicionar uma onda ao texto, do modo que ele suba e desça no bloco, use os seguintes ajustes:

  • Intensidade da onda - fixe a altura da onda. A extrema esquerda do texto não tem onda, e a extrema direita tem a maior altura de onda.
  • Largura da onda - selecione P, M, G ou, para uma configuração personalizada, ... . Na largura menor, a onda aparece com mais picos e vales no bloco de rolagem. Na largura maior, a onda pode aparecer só subindo, e o pico pode não ficar visível.

Confira o exemplo de um bloco de rolagem com onda de intensidade média e largura pequena:

A_scrolling_block_with_the_text_Dream_It_that_goes_up_and_down_in_waves_.gif

Estilo e tamanho do texto

Defina o estilo e o tamanho do texto com estes ajustes:

  • Estilo do texto - selecione Parágrafo ou Título. O texto segue os estilos gerais de parágrafo ou título que você escolheu. Este ajuste define a fonte do texto e outras configurações de estilo, mas não o tamanho.
  • Tamanho do texto - selecione P, M, G ou, para uma configuração personalizada, ... .

Altere a cor do texto nos estilos do site. A cor do texto segue os ajustes Cor do parágrafo ou Cor do título em Rolagem no tema de cores da seção, dependendo do que estilo selecionado para o texto.

Ao adicionar uma cor ao fundo do bloco de rolagem, o texto seguirá a Cor do parágrafo no fundo ou a Cor do título no fundo em Rolagem.

O emoji de “til” tem uma cor definida, que não pode ser personalizada.

Estilo de rolagem

Personalize o comportamento e o visual da rolagem com estes ajustes:

  • Direção - defina o bloco para rolar para a esquerda ou para a direita.
  • Velocidade - fixe a velocidade da rolagem em 0,5x, 1x ou 2x.
  • Pausar ao passar o cursor - ative esta opção para a rolagem pausar quando o visitante passar o cursor sobre o bloco. A animação não será pausada enquanto você estiver no modo Edição.
  • Esmaecer nas bordas - Ative esta opção para deixar o texto semitransparente nas bordas laterais do bloco.
  • Espaçamento entre itens - fixe a distância entre os itens de texto na rolagem.

Outras opções de estilo

Para personalizar como o bloco de rolagem aparece:

  • Combinado - deixe uma linha cheia ou pontilhada no contorno do bloco. Nos dois casos, defina a cor e a espessura do riscado. 
  • Combinado - use o menu suspenso para configurar a transparência. Esse efeito é indicado ao deixar um bloco de rolagem na frente de uma imagem ou de outro conteúdo visual.
  • Desfoque - ative essa opção para desfocar o elemento ou o plano de fundo; depois, use o controle para ajustar o nível do desfoque.

Acessando o recurso

As personalizações Riscado, Combinado e Desfoque estão disponíveis nas seções do Editor Intuitivo. As seções que usam o editor clássico contam apenas com a opção Riscado.

Footer Image
  • Peça ajuda à nossa comunidade

  • Peça ajuda à nossa comunidade sobre personalizações avançadas.

  • Contrate um Squarespace Expert

  • Ganhe destaque on-line com a ajuda de um designer ou desenvolvedor experiente.