Arraste e solte diferentes tipos de blocos em suas páginas para personalizar o estilo e a estrutura do conteúdo.
Blocos são recursos de arrastar e soltar que mostram o conteúdo do site. Eles personalizam as páginas com conteúdos variados, como texto, imagens, botões e formulários. Este guia explica os diferentes tipos de blocos disponíveis e como adicioná-los a uma área de conteúdo, como Página de Layout ou publicação do blog.
Dica: para deixar o conteúdo do seu site acessível ao maior público possível, confira "Recursos de acessibilidade no Squarespace".
Assista a este vídeo
Adicionar um bloco
A forma de adicionar blocos depende da versão do Squarespace do site e se você está editando no computador ou no app do Squarespace.
Para adicionar um bloco:
- Abra o painel "Páginas".
- Selecione a página que você quer editar e clique em Editar no canto superior esquerdo.
- Passe o cursor sobre a seção à qual adicionar o bloco e clique em ponto de inserção e clique em Adicionar bloco no canto superior esquerdo. Para adicionar blocos, a página precisa ter pelo menos uma seção de blocos.
Dica: se não aparecer nenhum botão Adicionar bloco, é porque você está usando o editor clássico do Squarespace, que é ligeiramente diferente e usado em determinadas áreas do seu site. Para adicionar blocos no editor clássico, clique num ponto de inserção.
- No menu, clique em um bloco. Você também pode procurar um bloco no topo do menu.
- O novo bloco aparecerá na página com o conteúdo do marcador. Dependendo do bloco, será aberto um editor para você fazer a personalização.
- Abra o painel "Páginas" (se esse painel não estiver visível, recolha a prévia do site - basta clicar na seta no canto superior esquerdo do site).
- No painel "Páginas", clique na página a ser editada ou adicione uma página nova.
- Passe o cursor sobre a área à qual o bloco será adicionado e clique em Editar.
Dica: se você estiver trabalhando com uma página de layout em branco, verá uma mensagem que diz "Esta página está vazia. Comece a editar e adicione blocos de conteúdo." Quando blocos forem adicionados à página, esta mensagem não será mais exibida. Para os visitantes, a página estará em branco e não conterá texto.
- Clique no botão + no canto superior direito ou em um ponto de inserção para abrir o menu de blocos.
- No menu, clique em um bloco. Você também pode procurar um bloco no topo do menu - use palavras como imagem, texto ou formulário.
- O novo bloco será exibido na página com o conteúdo de espaço reservado. Dependendo do bloco, você poderá personalizá-lo em um editor que será aberto para isso.
No app, as opções de bloco funcionam de diferentes formas dependendo da versão do Squarespace do site.
- Na versão 7.1, você pode adicionar blocos às publicações do blog, a eventos específicos e a outras informações sobre um produto. Você não pode adicionar blocos nas seções do Editor Intuitivo.
- Na versão 7.0, você pode adicionar blocos a uma Página de Layout vazia e nas publicações do blog.
Para adicionar um bloco:
- Toque no ícone de Páginas.
- Toque na página que deseja editar.
- Toque em Editar ou no ícone de lápis, no canto superior direito.
- Toque num bloco existente para editá-lo ou toque em + para adicionar um bloco.
- Para adicionar conteúdo e personalizar o bloco, use as configurações do bloco na parte inferior da tela.
- Quando terminar, toque em OK ou ✓ no canto superior esquerdo, para salvar as alterações.
Arraste e solte
Você também pode arrastar e soltar um bloco para posicioná-lo onde quiser na página:
- Arraste um bloco do menu. As linhas guias mostrarão onde o bloco pode ser posicionado.
- Solte o bloco para colocá-lo na página. Dependendo do bloco, será aberto um editor para você fazer a personalização.
Adicionar blocos a outras áreas
Você pode adicionar blocos a:
- Páginas de Layout
- Seções de bloco
- Postagens de blog
- Descrições de eventos
- Rodapés
- Cabeçalhos e rodapés de página (versão 7.0)
- Informações adicionais do produto
- Barras laterais (versão 7.0)
Não é possível adicionar blocos a:
Para incluir um bloco na mesma página de uma seção que não aceita blocos, adicione uma seção de bloco acima ou abaixo dessa seção.
- Páginas de Álbum
- Páginas do Blog
- Páginas de Entrada
- Páginas de Eventos
- Páginas de Galeria
- Páginas Índice
- Páginas da loja
- Banners na maioria dos templates
- Cabeçalhos de todo o site na maioria dos templates
Banners e cabeçalhos
- Para adicionar um bloco sobrepondo um banner, adicione uma imagem de fundo a uma seção de blocos.
- Não é possível adicionar blocos a cabeçalhos de todo o site.
- Altere o título do seu site e o slogan no editor de cabeçalho.
- Altere os links de navegação nas Configurações de Página.
Na maioria dos templates, não é possível adicionar blocos a um banner ou cabeçalho.
- Altere o título e o slogan do site no painel "Título e logotipo".
- Altere os links de navegação nas Configurações de Página.
- A maioria dos banners aceito texto em sobreposição.
Nas seguintes famílias de templates, você pode adicionar blocos ao cabeçalho geral do site:
- Montauk - adicione blocos ao cabeçalho quando o ajuste Subtítulo do cabeçalho: personalizado for selecionado.
- Skye - adicione blocos na sobreposição da navegação.
- Wells - adicione blocos à área de conteúdo da barra lateral da navegação.
- Alguns templates têm cabeçalhos de página que aceitam blocos. Na família Brine, por exemplo, é possível adicionar blocos à área de introdução que aparece sobre o banner das páginas.
Editar um bloco existente
Alguns conteúdos de bloco, como texto em blocos de Texto, podem ser editados diretamente na página, mas a maioria dos blocos tem um editor em que você pode adicionar, editar e gerenciar o conteúdo.
Para abrir o editor do bloco:
- Clique em Editar na página com o bloco desejado.
- Clique no bloco para selecioná-lo e, depois, no ícone de lápis. Como alternativa, clique duas vezes no bloco.
Pontos de inserção
Pontos de inserção são os ícones + no editor clássico que mostram onde você pode adicionar blocos ao editar seu site no computador. Eles aparecem acima e abaixo do bloco para você escolher o posicionamento do bloco antes de adicioná-lo.
No Editor Intuitivo, clique em Adicionar bloco. No app do Squarespace, clique no ícone + (canto superior direito).
Por que não consigo encontrar os botões +?
Se você não achar o botão Adicionar bloco ou os ícones + ao editar no computador, primeiro veja se você está editando uma área onde é possível adicionar blocos. Confira a lista acima.
Em seguida, veja se o editor foi aberto. Para abrir um editor:
- Versão 7.1 - clique em Editar no canto superior esquerdo da página onde o bloco deve ser adicionado; a página precisa ter pelo menos uma seção de blocos.
- Versão 7.0 - Passe o mouse sobre onde você deseja adicionar o bloco e, em seguida, clique emEditar .
Se nenhum botão Adicionar bloco aparecer no canto superior esquerdo, você está usando o editor clássico. Se o editor clássico estiver aberto, mas nenhum ícone + aparecer quando você passar o cursor sobre ou abaixo de um bloco, outro bloco pode já ter sido selecionado. Clique em outro lugar na página para desmarcar o bloco e, em seguida, passe o cursor sobre onde o novo bloco deve ser adicionado.
Se você ainda estiver com problemas, tente limpar o cache do browser, desativar uma extensão do browser ou atualizar a versão do browser. Se o ícone + não aparecer quando você clicar em "Editar" no app do Squarespace, talvez o app não aceite a adição de novos blocos a essa página.
Tipos de blocos
Use estes blocos para adicionar conteúdo ao site:
- 500px - adiciona imagens da sua conta 500px.
- Amazon (recurso Premium) - Link para itens da Amazon. Isso será útil se você participar do programa de afiliados da Amazon.
- Arquivo - mostra uma lista organizada de links para os itens de coleção.
- Áudio - Adicione tocadores para arquivos de áudio.
- Bandsintown - Exiba datas de turnês no seu perfil Bandsintown.
- Button - Adicione botões e chamadas à ação.
- Calendário - mostra os itens das páginas, como eventos, em forma de calendário, ordenado por dia.
- Gráfico - Adicionar gráficos de barras, linhas e pizza.
- Código - adiciona um código personalizado ou mostra trechos de código. O uso de código JavaScript e iframe no Bloco de Código é um recurso Premium.
- Link de conteúdo - adiciona um link com prévia visual para outra página do site.
- Doação (recurso Premium) - Colete doações para sua causa ou organização. Exige uma conta vinculada do Stripe ou do PayPal.
- Incorporar - adiciona conteúdo externo ao site, com links para tweets, vídeos e outros.
- Flickr - adiciona imagens da sua conta do Flickr.
- Foursquare - adiciona um feed dos seus check-ins no Foursquare.
- Formulário - adiciona um formulário para coletar informações dos visitantes.
- Galeria - Adicione galerias de imagens ou vídeos em layouts de Carrossel, Grade, Slideshow ou Pilha.
- Imagem - Adicione imagens com legendas em layouts de Cartão, Colagem, Inline, Sobreposição, Pôster ou Pilha.
- Instagram - adiciona publicações da sua conta do Instagram.
- Linha - adiciona uma linha horizontal para quebrar textos ou separar conteúdos visualmente.
- Mapa - adiciona um mapa do Google Maps com um pino de localização.
- Markdown - Adicionar texto com a linguagem Markdown.
- Menu (recurso Premium) - Exibir menus de restaurantes.
- Newsletter - adiciona um formulário de assinatura de newsletter.
- OpenTable (recurso Premium) - Adicionar reserva de restaurante. Você precisará de um ID de restaurante do OpenTable.
- Produto – Exiba produtos de Páginas da loja.
- Citação - adiciona citações e depoimentos estilizados.
- Reservas - adicione um botão para fazer reservas ou vender ingressos para eventos com o Tock.
- RSS - Adicione links de feeds RSS de páginas de blogs.
- Scheduling - adiciona a opção de agendamento on-line com o programa Acuity Scheduling.
- Rolagem – Adicione texto de rolagem como uma marquee ou uma barra de notícias.
- Bloco de forma (somente Editor Intuitivo) - adicione uma forma com cores sólidas.
- Pesquisa - Adicione campos de pesquisa.
- Links Sociais - Adicione ícones que vinculam a perfis de redes sociais.
- SoundCloud - Insira tocadores do SoundCloud.
- Espaço - adiciona um espaço ajustável ou uma margem entre os blocos.
- Resumo - Exiba itens de coleção no site em layouts de Carrossel, Grade, Lista ou Parede.
- Nuvem de Tags - mostra tags ou categorias em formato de nuvem gráfica.
- Texto - adiciona texto ao site, incluindo títulos, citações, textos pré-formatados, links e listas.
- Vídeo - adiciona um vídeo hospedado externamente.
- Zola – adiciona um registro de casamento.
O aplicativo Squarespace não aceita todos os blocos. Para adicionar ou editar blocos não aceitos, faça login no site em um computador.
- Button - Adicione botões e chamadas à ação.
- Galeria - adiciona uma galeria de imagens ou de vídeos com layout de carrossel, grade, slideshow ou pilha.
- Imagem - Adicione imagens com legendas em layouts de Cartão, Colagem, Inline, Sobreposição, Pôster ou Pilha.
- Linha - adiciona uma linha horizontal para quebrar textos ou separar conteúdos visualmente.
- Texto - adiciona texto ao site, incluindo títulos, citações, textos pré-formatados, links e listas.
- Vídeo - adiciona um vídeo hospedado externamente.
No app do Squarespace, não é possível adicionar ou editar blocos nas seções do Editor Intuitivo.
Blocos descontinuados
Use o bloco de arquivos em vez dos seguintes blocos descontinuados:
- Lista de autores
- Lista de categorias
- Lista de meses
- Lista de tags
Mais ajuda em Recursos descontinuados.
Próximos passos
Agora que já adicionou um bloco, você pode:
Visite o guia do seu bloco para saber mais sobre suas opções de estilo e edição.