A página de entrada apresenta informações em uma imagem inicial arrojada. Ela é ótima para mostrar a página de site em construção, anunciar o lançamento de um produto ou coletar o endereço de e-mail dos visitantes.

Na versão 7.0, a Página de Entrada vem incluída em qualquer plano de cobrança do Website e do Commerce. Se o seu plano abrange apenas a Página de Entrada, ela ficará no ar enquanto o pagamento estiver ativo. Após mudar para o site completo, não é mais possível voltar ao plano de cobrança da Página de Entrada.

A página de entrada não está disponível na versão 7.1. Para criar um visual parecido, você pode ocultar o cabeçalho e o rodapé em determinadas páginas. Você não pode adicionar nem editar páginas de entrada no app do Squarespace.

Assistir a um vídeo

Adicionar uma página de entrada

Siga estas instruções para adicionar uma Página de Entrada e personalizar o conteúdo dela:

1. Abra o painel "Páginas" e clique em +; depois, selecione Página de entrada. Confira mais ajuda em "Adição de páginas à navegação".
2. Escolha um layout.
3. Adicione marca, texto e mídia.
4. Adicione ações, como botões, links ou formulários.
5. Estilize a página.

Lembre-se:

• Para definir a Página de Entrada como a primeira página que os visitantes veem quando visitam o site, defina-a como sua página inicial.
• Para excluir a Página de Entrada dos menus de navegação, transfira-a para a seção Não Vinculada no painel Páginas. Isso serve para que os visitantes vejam essa página apenas uma vez antes de entrar no site ou para usá-la como una página de landing separada.
• Se você estiver usando o plano Somente Página de Entrada, não terá um painel Páginas e não será possível adicionar mais páginas. Seu Menu Inicial exibe os painéis para editar sua Página de Entrada autônoma.

Layouts da Página de Entrada

Cada layout da Página de Entrada funciona como um template de uma página, com seus próprios recursos e configurações de estilo distintos. As Páginas de Entrada não usam blocos, e elementos de design como texto e botões são exibidos em uma posição fixa. Isso ajuda a manter sua Página de Entrada bonita e ágil.

Atenção: a Página de Entrada não aceita formatação HTML e Markdown.

Para alterar seu layout:

1. No menu Página de Entrada, clique em Alterar layout.
2. Use o menu suspenso para classificar layouts por categoria ou escolha Todos os layouts para exibir todos.
3. Passe o mouse sobre um layout e clique em Selecionar para defini-lo como seu novo layout.
4. Clique em Salvar na parte superior da página para aplicar a alteração.

Embora seja possível adaptar os layouts da Página de Entrada para qualquer finalidade, o design deles foi pensado para temas gerais. Saiba mais sobre cada categoria de layout abaixo.

Adicionar identidade visual e texto

Use o painel de Identidade Visual e Texto para adicionar:

• Um logotipo ou texto de marca
• Um cabeçalho para a página
• Texto principal

Essas configurações funcionam com o estilo do layout para ajudar a maximizar o impacto das informações apresentadas.

Lembre-se:

• A identidade visual e a exibição de texto variam conforme o layout
• Não é possível exibir um logotipo e o texto da marca ao mesmo tempo.
• Veja se o logotipo segue nossas melhores práticas; ou crie um novo logotipo com o Squarespace Logo.
• Ao contrário de outras páginas, os títulos e os logotipos do site nas Páginas de Entrada não têm links para a página inicial do site.
• Seu texto de marca pode ser diferente do título de SEO, que serve como o nome da página nas guias do navegador e nos resultados do mecanismo de pesquisa.

Adicionar mídia

Use o painel Mídia para:

• Fazer upload de imagens de fundo
• Adicione imagens de acervo
• Reutilizar imagens já carregadas
• Adicionar um vídeo em loop ao plano de fundo
• Definir a cor de fundo

Lembre-se:

• Formate corretamente suas imagens antes de enviar.
• Você pode usar o Editor de imagem integrado para editar as imagens originais.
• Você pode fazer upload de várias imagens para criar um slideshow ou um plano de fundo em grade.
• O upload de muitas imagens em alta resolução pode fazer com que a Página de Entrada demore mais para carregar.
• A maioria dos layouts aceita URLs do YouTube ou Vimeo para mostrar vídeos de fundo em loop e sem som.
• Não é possível adicionar controles de navegação nem controlar a velocidade de transição em slideshows da Página de Entrada.
• Devido ao design responsivo, os vídeos e imagens sempre são cortados, principalmente na versão móvel. O tamanho do corte depende da altura da imagem, da largura do browser e do layoutescolhido.

Definir a cor de fundo

Para exibir um plano de fundo liso, com uma só cor, em vez de uma imagem ou um vídeo, escolha Nenhum. A imagem desaparecerá da prévia. Altere a cor do plano de fundo no painel Estilo.

Adicionar ações

Use o painel Ação para adicionar botões, links de navegação e uma opção de inscrição de formulário ou boletim informativo. Se você não quiser nenhuma ação em sua Página de Entrada, deixe os campos em branco.

Lembre-se:

• Você pode adicionar botões ou links de navegação, mas não ambos.
• Você pode adicionar até dois botões ou cinco links de navegação.
• Você pode adicionar um formulário ou assinatura de newsletter.

Para adicionar uma ação:

1. Clique em Ação no menu Página de Entrada.
2. Em Selecionar tipo de ação, escolha uma ação.

Adicionar botões ou links de navegação

Os botões e links de navegação levam os visitantes a outra página no seu site do Squarespace, outro website ou a um arquivo para download. Para adicionar botões ou links de navegação:

1. Escolha Botões ou Navegação no menu Selecionar tipo de ação.
2. Adicione uma etiqueta ao primeiro campo. Para facilitar a formatação e a leitura, recomendamos um texto curto na etiqueta do link.
3. Clique no campo URL para digitar um endereço da web; ou clique em para abrir o editor de links. Você pode vincular sites externos, arquivos para download, endereços de e-mail, números de telefone ou o conteúdo do seu próprio site. Saiba mais em Adição de links ao seu site.
4. Clique em Salvar na parte superior do painel para publicar todas as alterações.

Adicionar um formulário ou inscrição de newsletter

Os visitantes podem clicar em um botão e preeencher o formulário ou a assinatura de newsletter exibidos em uma sobreposição. Para adicionar um formulário ou uma assinatura de newsletter:

1. Escolha Formulário ou Newsletter no menu Selecionar tipo de ação.
2. Adicione uma etiqueta para o botão no campo etiqueta do botão .
3. Para criar o conteúdo, clique em Editar formulário ou Editar cadastro na newsletter.
4. Para dar um nome ao formulário, use o campo Nome do formulário. O nome aparece aos visitantes quando o formulário é aberto em lightbox. Não é possível dar nome ao cadastros de newsletter nem apagar o título padrão "Formulário de newsletter" que aparece em lightbox aos visitantes.
5. No caso dos formulários, é possível apagar campos de marcador de posição. Para isso, clique no ícone da lixeira. Você também pode clicar em + na parte inferior para adicionar novos campos. Para exigir que os visitantes preencham um campo ao enviar o formulário, marque Obrigatório. As assinaturas de newsletter têm apenas um campo de Endereço de e-mail.
6. Clique na aba Armazenamento para nos informar para onde fazer envios. Se você usar uma lista de e-mails de Campanhas por e-mail como opção de armazenamento, os assinantes receberão um e-mail de confirmação quando se inscreverem. Não é possível desativar esse recurso.
7. Acesse a aba Avançado para personalizar a etiqueta do botão Enviar, configurar um redirecionamento pós-envio e editar a mensagem que aparece aos visitantes após o envio do formulário. Use texto comum ou HTML.
8. Clique em Salvar no editor, depois clique em Salvar na parte superior do painel para publicar todas as alterações.

Dica: após vincular o formulário ou o cadastro para newsletter ao armazenamento, recomendamos acessar a versão publicada da sua página e enviar um formulário de teste para ver como funciona.

Adicionar uma cor de fundo ao formulário

Na maioria dos layouts, é possível usar o ajuste Cor da sobreposição personalizada no painel Estilo para adicionar uma cor ao fundo do formulário ou da assinatura de newsletter. Para ocultar essa sobreposição do restante da página, use o controle deslizante de opacidade e deixe-a transparente. Os visitantes verão a sobreposição após clicar no formulário ou no botão de assinatura de newsletter.

Lembre-se:

• O layout Harbor não tem uma configuração para Cor da Sobreposição Personalizada ou Cor Por Trás do Texto. No Harbor, o plano de fundo do formulário ou da assinatura de newsletter é sempre cinza claro.
• Em alguns layouts, a opção Cor de sobreposição personalizada só aparece após se adicionar uma imagem ao painel Mídias.

Nesses layouts, o plano de fundo de inscrição do formulário ou do boletim corresponde à configuração Cor por trás do texto :

• Backstory
• Cartão
• Flagship
• Flash
• Focus
• Monocle
• Sessão
• Destacado
• Vignette

Ocultar o formulário

Para ocultar um formulário ou uma assinatura de newsletter, remova todo o texto da Etiqueta do botão e deixe o campo em branco. Os campos do formulário continuarão intactos se você voltar a ativá-lo mais tarde.

Adicione ícones sociais

Para mostrar os ícones de redes sociais, clique em Links de redes sociais no menu da Página de Entrada e marque Mostrar ícones de redes sociais. Os ícones de redes sociais mostram as contas que você adicionou ao painel Links de redes sociais. A distribuição dos ícones varia de acordo com o layout, mas eles normalmente ficam no fim da página.

Estilizar a Página de Entrada

Use o painel Estilo no menu da Página de Entrada para personalizar o design. Cada Página de Entrada tem opções de estilo exclusivas, independentemente do template do site e de outras Páginas de Entrada.

Lembre-se:

• Se você alterar o layout, todas as configurações de fonte, cor e tamanho voltarão para os padrões do layout. Se você voltar para um layout usado antes, os ajustes de estilo também voltarão para o original.
• Como a Página de Entrada é criada com design responsivo, ela fica um pouco diferente na versão móvel. Para ver como a página aparece na versão móvel, use Prévia por aparelho.

Alterar ajustes de estilo

No menu Página de Entrada, clique em Estilo. Use os ajustes de estilo para personalizar sua Página de Entrada. À medida que você fizer alterações, a visualização da página será atualizada. Recomendamos fazer testes para encontrar um design que você goste.

Aqui está uma lista de ajustes comuns na Página de Entrada:

• Posicionamento - posicione o conteúdo na página. Dependendo do layout, as opções são Esquerda, Centro, Direita ou Superior, Meio, Inferior.
• Marca - Defina a fonte e a cor.
• Título - Defina a fonte e a cor.
• Corpo - Defina a fonte e a cor.
• Fundo - Defina a cor de fundo (visível se não estiver usando uma imagem ou um vídeo) e as opções de borda da página.
• Imagens (não disponíveis em layouts de localização) - Defina Estilo como Completo ou Grade e personalize a aparência da grade com ajustes de estilos como Densidade da Galeria de Grade e Taxa de Galeria de Grade. Marque Cor de sobreposição automática e Cor de carregamento automático ou desmarque e defina cores para cada um. Veja mais sobre Carregar Cores abaixo.
• Botões - Defina a fonte, o estilo e a cor de todos os botões.
• Ícones sociais - Defina o estilo e a cor dos ícones sociais.
• Controles de áudio (apenas layouts de áudio) - Defina o estilo do reprodutor e a fonte e a cor das faixas.
• Controles de vídeo (somente layouts de vídeo) - Defina o estilo e a cor do reprodutor.
• Mapa (somente layouts de localização) - Defina o estilo do mapa.

Imagens de fundo

A maioria dos layouts contém opções de imagens Completa e Grade:

• Selecione Completa para preencher todo fundo da Página de Entrada com uma única imagem. Se você carregar várias imagens, aparecerá uma de cada vez como em slideshow.
• Selecione Grade para criar uma grade de fundo com imagens repetidas. Se você tiver apenas uma imagem, a grade a repetirá para preencher o espaço.
  
  • A opção Grade não está disponível nos layouts Foco, Flagship, Harbor ou Monóculo.
  • No layout Montagem, a barra de conteúdo pode cobrir algumas das suas imagens.
• Use os ajustes que aparecem abaixo para especificar a proporção, a orientação da imagem e outros ajustes.

Carregamento de cor

A maioria dos layouts de Página de Entrada oferece uma opção de cor de carregamento para que você possa exibir uma cor de fundo separada, enquanto a cor de fundo normal ou a imagem é carregada. Você pode também ver essa cor ao fazer a transição por meio de imagens em uma apresentação de slides.

Observação: os layouts Flagship, Focus, Harbor e Monóculo não oferecem cor de carregamento.

Como padrão, o layout usa a Carregamento automático de cor. Isso significa que a cor é baseada na cor de fundo da imagem ou do vídeo. Se você tiver várias imagens de fundo, a cor será baseada na primeira imagem no painel Mídias.

Para escolher sua própria cor, desmarque a opção Carregamento Automático de Cor e defina outra clicando em Cor de Carregamento Personalizado.

Para desativar a cor de carregamento, clique em Cor de carregamento personalizado e marque a opção Transparente.

Cor de sobreposição

Todos os layouts, exceto Harbor, oferecem uma opção de cor de sobreposição, que adiciona uma tonalidade à sua imagem de fundo ou cor. Por padrão, seu layout usa a Cor de Sobreposição Automática. A cor automática é geralmente um tom de cinza complementando a imagem demo.

Para usar uma cor de sobreposição personalizada, desmarque a opção Cor de sobreposição automática, clique em Cor de sobreposição personalizada e escolha outra cor.

Para usar a Cor de Sobreposição Personalizada como uma cor de fundo do formulário, mas ocultá-la do resto da página, use o controle deslizante de opacidade para tornar a cor transparente.

Perguntas frequentes

Por que não consigo aumentar o tamanho do texto além de um determinado ponto?

Só é possível ampliar texto, logotipos e botões da Página de Entrada até a largura máxima aceita em cada layout. Esse limite impede a sobreposição de conteúdos e garante o design responsivo.

Mais especificamente, corpo de texto exibe o tamanho da fonte definido quando a largura do navegador é maior que 1800 pixels. Em navegadores com 1800 pixels de largura ou menor, a fonte do corpo atinge um tamanho máximo dependendo da largura:

• 1800 pixels de largura: 27px
• 1600 pixels de largura: 22px
• 1020 pixels de largura: 18px
• 760 pixels de largura: 17px
• 600 pixels de largura: 16px

Por exemplo, se você definir o tamanho da fonte do corpo do texto como 30 pixels, ele será exibido desse tamanho somente se a janela do navegador do visitante tiver pelo menos 1801 pixels de largura. Caso contrário, o tamanho será reajustado de acordo com a lista acima. Da mesma forma, se você definir o tamanho da fonte do corpo do texto para 13 pixels, ele será exibido sempre com 13 pixels, pois esse tamanho é menor do que qualquer limite.

O texto da marca e do título funciona de forma diferente. O tamanho da fonte funciona mais como um destino, e o texto é dimensionado com base na altura e na largura do navegador. Essa escala varia entre os layouts.

Posso adicionar código personalizado a uma Página de Entrada?

As Páginas de Entrada têm designs muito intencionais e não são construídas para adicionar CSS personalizado. Para ajustar o estilo da Página de Entrada (como fontes e cores), use o painel Estilo.

Se, mesmo assim, você precisar adicionar HTML ou scripts, use as configurações da Página de Entrada para adicionar uma Injeção de código por página. Busque ajuda em Adição de código personalizado ao site.

O botão de reprodução muda de posição no layout do projetor.

A localização do botão Reproduzir no layout Projector depende da quantidade de texto no campo Corpo:

• Com uma pequena quantidade de texto, o botão de reprodução permanece centralizado.
• Quando o texto ultrapassa uma determinada largura, o botão de reprodução vai para o canto superior esquerdo.
• A posição varia de acordo com o tamanho do navegador.