Blocos de Citações

Destaque conteúdo importante com um texto exclusivo e diferente.

Ultima atualização 13 de Setembro de 2024

Use o Bloco de Citação para adicionar citações e depoimentos estilizados ao site.

Assista ao vídeo

Adicione um Bloco de Citação

Para adicionar um Bloco de Citação:

  1. Abra um editor de página ou publicação, clique em Adicionar bloco ou num ponto de inserção e, em seguida, clique em Citação.Confira as etapas detalhadas em Adição de conteúdo com blocos.
  2. Para abrir o editor do bloco, clique no ícone de lápis no bloco.
  3. Insira a cotação no primeiro campo.
  4. Digite sua origem no segundo campo.
  5. Clique em Design para adicionar uma animação ou ativar uma cor de fundo (somente sites da versão 7.1).

Editar um Bloco de Cotações existente

Para editar um Bloco de Cotações existente, clique duas vezes no bloco ou clique no bloco uma vez e, em seguida, clique no ícone de lápis ou Editar . Isso abre o editor de blocos. Não é possível editar a citação diretamente na página como faria com um Bloco de Texto.

Edite o estilo da citação

O estilo da citação depende do template e da versão.

Fontes

Para editar o estilo das fontes do Bloco de Citação:

  1. Ao editar uma página, abra "Estilos do site" e clique em > ao lado de "Fontes".
  2. Clique em Alocar estilos
  3. Role até a seção do bloco de citações para estilizar Texto e Origem.
  4. Para retornar aos estilos do site, clique em Voltar e em Estilos do site.Ou, se tiver terminado de fazer alterações, clique em Sair e em Salvar para fechar o editor.

Cores

Para editar o estilo das cores do Bloco de Citação:

  1. Ao editar uma página, abra "Estilos do site" e clique em > ao lado de "Cores".
  2. Passe o mouse sobre o tema de cores e clique no ícone do lápis.
  3. Role até a seção do bloco de cotações para alterar as cores Texto e Origem.
  4. Clique em Salvar para salvar as alterações e continuar editando ou clique em Sair e depois em Salvar para fechar o editor.
    .

Outras opções de estilo

Para personalizar como o bloco de citação aparece:

  1. No editor do bloco de citação, clique em Design.
  2. Ao lado de Riscado, deixe uma linha cheia ou pontilhada no contorno da forma. Nos dois casos, defina a cor e a espessura do riscado. 
  3. Clique no menu suspenso Combinado para configurar a transparência. Esse efeito é indicado ao deixar um bloco de citação na frente de uma imagem ou de outro conteúdo visual.
  4. Para desfocar o elemento ou o plano de fundo, ative a opção Desfoque e use o controle para ajustar o nível.

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.

A maioria dos templates tem opções de estilo para blocos de citação. Nos templates sem opções de estilo, o texto do bloco de citação usa o mesmo estilo do corpo de texto. Veja abaixo nossas dicas com outras formas de destacar as citações.

Nas seguintes famílias de templates, use os ajustes abaixo para alterar o visual do Bloco de Citação:

Família de template Nome do ajuste

Adirondack

Bloco de Citação

Avenue

n/d

Família Aviator

Fonte da citação, texto da citação 

Bedford

Fonte da citação, cor da citação 

Brine

Seção do Bloco de Citação (alinhamento, fonte da citação, fonte da fonte)

Farro

Seção do Bloco de Citação (alinhamento, fonte da citação, fonte da fonte)

Five

Bloco de Citação

Flatiron

Fonte da citação, cor da citação, tamanho da citação inline

Forte

Bloco de Citação 

Galapagos

n/d

Ishimoto

Citação, tamanho da citação

Momentum

Bloco de Citação

Montauk

n/d

Native

Citações, tamanho das citações

Pacific

Fonte da citação, cor da citação

Skye

Seção do Bloco de Citação (alinhamento, fonte da citação, tam mín da fonte, cor da citação)

Supply

n/d

Tremont

Fonte da citação, tam mín da fonte da citação 
Wells Citação, tamanho da citação
Wexley Fonte da citação

York

Fonte da citação, escala da citação, mín citação, cor do texto da citação, alinhamento da citação, mostrar marcas da citação, fonte da fonte da citação, cor da fonte da citação

Anime a citação

Acessando o recurso

As animações do bloco de citação não funcionam no Editor Intuitivo. O bloco de citação segue as configurações gerais para as animações do site.

Para animar um Bloco de Citações:

  1. No editor do bloco de citação, clique em Design.
  2. Selecione um efeito no menu suspenso. Ao selecionar uma opção, aparece uma prévia na página.

Escolha entre:

  • Nenhuma - sem animação, mesmo que haja configurações de animação gerais do site
  • Padrão do site - o texto segue as configurações de animação gerais do site
  • Fade In - o texto aparece gradualmente
  • Deslizar para cima - o texto desliza de baixo para cima
  • Foco - o texto aparece borrado e, em seguida, entra em foco
  • Revelar - o texto desliza do centro para fora

Confira um exemplo de bloco de citação com a animação Foco.

Quote_block_animations_appear_when_the_block_loads.gif

Outras formas de adicionar uma citação

Veja outras opções para adicionar ao site uma citação com formatação específica.

Formate como texto de citação

Para destacar uma citação dentro do bloco de texto, selecione o texto e clique no ícone de citação no editor do bloco de texto; isso recua a citação. Dependendo do template, uma linha aparecerá ao lado, e o texto aparecerá em itálico.

Molde o texto

Para deixar a cotação com estilo de revista e se destacar na página, molde um Bloco de Texto em torno do outro. Saiba mais em Moldando o texto para destacar uma citação.

pull-quote.png

pull-quote.png

Sobreponha blocos de citação e blocos de imagem

No Editor Intuitivo, você pode posicionar um bloco de citação sobre um bloco de imagem para criar um fundo de imagem na citação. O fundo do bloco deve estar desativado para que o bloco de imagem atrás dele não fique coberto.

No editor clássico, não é possível sobrepor blocos. Em vez disso, adicione um bloco de imagem com sobreposição de texto e ajuste o estilo desse texto para que ele se pareça com uma citação. O artigo Bloco de imagem dá exemplos para cada uma das diferentes opções de bloco de imagem. Confira um exemplo com o bloco de imagem de pôster:

image-block-as-quote.png

image-block-as-quote.png

Formate como texto de título

Para destacar o texto, adicione o texto da citação a um bloco de texto e depois o formate como título. No editor do bloco de texto, realce o texto e use o menu suspenso de formatação para selecionar Título 2 ou Título 3. Em seguida, use as opções para o título 2 ou título 3 no painel de estilos do site para alterar como o texto aparece.

Dica

uma vez que os motores de busca identificam o conteúdo no título como área rica em palavras-chave para indexação, mudar o estilo da citação para título pode interferir no SEO do site. Recomendamos essa alternativa apenas se o template não oferecer estilos de Bloco de Citação e se o objetivo principal for aprimorar o design da citação.

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.