Como Criar um Website de Uma Página no WordPress

Muitos websites de sucesso são assuntos grandes e complexos, com muitas páginas e conteúdo. No entanto, às vezes, mais verdadeiramente é menos no mundo do web design. E é por isso que, em vez de adoptar uma abordagem tradicional, pode valer a pena criar um website de uma página no WordPress.

Neste artigo, vamos aprofundar mais os benefícios e aplicações deste tipo de site. Depois mostraremos a você como criar um site de uma página no WordPress em apenas três passos. Vamos começar!

📚 Índice:

Por que você pode querer criar um site de uma página

A maioria dos sites tem várias páginas. No mínimo, geralmente há uma página inicial, página de contato, sobre a página e páginas para qualquer conteúdo ou serviços que você esteja oferecendo.

Um website de uma página, por outro lado, condensa todas as informações importantes em uma única página inicial, muitas vezes incluindo uma série de seções dedicadas. O design de uma página oferece uma série de benefícios, tais como:

• Simplicidade, o que torna mais fácil para os visitantes navegar no seu site e encontrar o que precisam.
• Facilidade de manutenção, uma vez que há muito pouco conteúdo para manter.

Obviamente, um design de uma página não é a escolha certa para cada site. Sites grandes e complexos têm o seu lugar. No entanto, se estiver a gerir um site de pequenas empresas, um portfolio, ou uma simples montra, pode querer considerar este formato.

Os elementos essenciais de um site de uma página

Quando o seu site abrange apenas uma página, precisa de ser muito deliberado sobre o que inclui. É importante fornecer toda a informação que o seu público vai precisar, sem desorganizar a página ou sobrecarregá-los. Tudo o que você adicionar à sua página deve estar lá por uma razão.

Aqui estão alguns dos elementos essenciais se você estiver procurando criar um website de uma página:

• Uma Chamada à Ação (CTA) proeminente, como assinatura, contato, ou botão de compra.
• Uma seção Sobre quem você, sua empresa, ou sua organização é.
• Elementos de marca, como seu logotipo e tagline.
• Uma lista de produtos ou serviços, se relevante.
• Links para seus outros lugares e conteúdos na web, incluindo perfis de mídias sociais.
• Informações de contato, incluindo vários canais, se possível.

É também importante prestar atenção à ordem desses elementos. Em geral, você vai querer colocar as informações mais cruciais e os CTAs logo no início, com detalhes de contato e links mais próximos ao final da página. Pense no que seu público precisará ver e em que ordem, e isso o ajudará a determinar quais elementos incluir e como organizá-los.

Finalmente – só porque você está usando um site de uma página, isso não significa necessariamente que você não possa ter um blog. Se você ainda quiser incluir um blog, o WordPress ainda lhe deixará um link para o seu blog a partir da sua página inicial de uma página.

Como criar um site de uma página (PASSOS EXATOS)

Agora, vamos falar sobre como realmente desenhar o seu site. A primeira coisa que vai querer fazer é verificar alguns exemplos existentes de sites de uma página para se inspirar. Depois prossiga para o primeiro passo.

Passo 1: Determine o foco do seu site

Como já discutimos, escolher criar um site de uma página significa que você terá que ser muito deliberado sobre o seu design. Isso inclui ser claro quanto aos seus objectivos. Quando você estiver limitado a uma única página, você vai querer escolher uma ou duas coisas chave para focar.

Para fazer isso, considere a CTA primária que o seu site será projetado ao redor. O que você quer que os visitantes façam – inscrever-se para uma associação, comprar um produto, participar de um evento, ou contratá-lo para um trabalho? Tudo na sua página deve encorajar as pessoas a tomar essa acção. Isso significa fornecer as informações que elas precisarão, explicando os benefícios e deixando os próximos passos claros.

Passo 2: Selecione um tema de uma página de qualidade

Se você decidiu criar um site de uma página no WordPress, você pode usar qualquer tema que você gostaria. No entanto, uma estratégia inteligente é muitas vezes escolher um tema de uma página que tenha sido construído especificamente para ajudá-lo a desenhar este tipo de site. Estes temas simplificam a inclusão de todas as informações necessárias, mantendo um design atraente.

Ao escolher um tema de uma página, eis o que você vai querer procurar:

• Um construtor de páginas com os elementos pré-construídos que você vai precisar, como uma seção de contato.
• Um método para dividir a sua página em várias secções que podem ser visualmente distinguidas.
• Navegação que permite aos visitantes saltar para várias secções dentro da sua página.
• Uma forma fácil de adicionar botões CTA e personalizá-los.

Existem muitos temas de uma página disponíveis. Neve, por exemplo, é um tema multiuso que é perfeito para sites concisos mas abrangentes de uma página. É compatível com muitos construtores de páginas populares, inclui um personalizador ao vivo e ajuda a configurar rapidamente o seu site de uma página. Também inclui seções pré-construídas para informações de contato, sua bio, uma vitrine e muito mais.

Passo 3: Desenhe seu site

A partir do momento que você sabe o que quer incluir no seu site, que está claro sobre o seu foco e escolheu um tema forte, você pode começar realmente a desenhar a página. Você vai querer que ela seja apropriada ao seu público, refletiva do seu estilo, e otimizada para cumprir seus objetivos – o que significa que você não deve simplesmente seguir uma fórmula.

No entanto, aqui estão algumas sugestões para ter em mente ao montar seu site:

• Calme sua página simples, e não inclua nada que não sirva a um propósito distinto
• Distinguir claramente entre seções diferentes com uma variedade de cabeçalhos, fundos, e assim por diante.
• Crie uma navegação que salte rapidamente os visitantes para as seções que eles precisam.
• Faça seus CTAs primários proeminentes e persuasivos.

Seguir este conselho, você será capaz de criar um site incrível de uma página em pouco tempo.

Agora, vamos falar sobre ferramentas. Então como você pode construir um ótimo site de uma página da maneira mais eficiente e rápida possível?

Criar seu site de uma página com Elementor

Elementor é um construtor de páginas fácil de usar e rico em recursos que facilita a criação de qualquer número de páginas dentro de um site WordPress. Isto faz dele a ferramenta perfeita para criar um ótimo site de uma página com.

Nas seções seguintes, nós mostraremos a você como fazer isso. O exemplo que estamos usando é um site para uma loja de frutas e legumes. O site terá:

• uma página com muitas secções que albergam o conteúdo
• um menu em que os visitantes podem clicar para ir directamente às secções relevantes
• um cabeçalho que alberga o logótipo e o menu
• um rodapé

Aqui está uma pré-visualização de como será o site no final:

Passaremos cada passo em detalhe, mas aqui está o processo básico:

1. Instalar o tema Neve livre.
2. Instale o plugin Elementor se ainda não o fez.
3. Configure a “tela” do seu website – o cabeçalho, rodapé e menu.
4. Adicione o seu conteúdo com o Elementor.
5. Ligue o menu a diferentes secções do seu design, para criar o efeito de navegação de uma página.
6. Configure o seu design como página inicial do seu site.

Instale o tema gratuito Neve

• Vá para Appearance → Temas → Adicione Novo no seu dashboard do WordPress.
• Procure por “Neve”
• Clique no botão Instalar
• Ace WordPress instala o tema, click Activate to make it live

Install the free Elementor plugin

• Go para Plugins → Add New
• Search for “Elementor”
• Install and activate the free Elementor Page Builder plugin.

Agora, com uma instalação limpa do WordPress, tema Neve ativo, e o construtor de páginas Elementor, você está pronto para construir seu site de uma página.

Configure o cabeçalho, rodapé e menu

Você vai usar o tema Neve para configurar o cabeçalho, rodapé e menu do seu site de uma página.

Header

Head to the WordPress dashboard and click Appearance → Themes → Customize para personalizar o tema Neve:

Primeiro, você selecionará as cores e o fundo do site

Próximo, no painel Personalizador, clique em Cabeçalho → Alterar Logotipo e adicione o logotipo do seu site. Ajuste a largura do logotipo, adicione o título do site, o ícone do site e uma tagline. Escolha se deseja exibir ou ocultar o nome do site e a tagline no cabeçalho.

Abaixo da guia Layout, escolha um layout para o cabeçalho, bem como a cor, e defina o estofamento e as margens. Alternativamente, escolha uma das predefinições do cabeçalho.

Menu

Next, você precisa criar o menu de navegação que será exibido no seu cabeçalho. Para fazer isso, clique em Menus → Create New Menu (Criar Novo Menu). Dê-lhe um nome e defina a sua Localização de Menu igual ao Menu Principal.

Clique em Seguinte e Adicione itens. Aqui, adicione os nomes das seções que você estará criando. Por exemplo, Main, About Us, Products, and Contact. Para fazer isso, clique no botão Links personalizados.

No campo URL, digite uma hashtag seguida do nome dessa seção. Mais tarde, quando você configurar o Elementor, você irá configurá-lo para que esses links vão para seções específicas no seu design. Por exemplo:

• #about-us
• #products
• #contact

Footer

Move on to the Footer e adicione texto e cor de fundo. Você pode adicionar qualquer conteúdo que quiser aqui:

Hit Publish para salvar todas as alterações

Neste estágio, seu site tem um cabeçalho, rodapé e menu. Ele deve se parecer com o que está abaixo. Agora, você está pronto para usar Elementor para adicionar o conteúdo que vai entre o cabeçalho e o rodapé:

Criar uma nova página e adicionar conteúdo com Elementor

Para começar, vá para Páginas → Adicionar Novo para criar uma nova página. Dê um nome à página. Se o tema fornecer barras laterais, isso também irá aparecer. Mas você pode recortar as barras laterais ajustando os Atributos de Página à largura total.

Na nova página que se abre, clique em Edit with Elementor. Abre-se um painel à esquerda. No lado direito, há a área de edição onde você verá o site tomando forma.

Uma rápida introdução à interface Elementor

Antes de continuarmos, vamos dar uma olhada no painel da Elementor. Ele tem muitos elementos criativos ou widgets como cabeçalhos, parágrafos, imagens ou vídeos. Você pode adicioná-los ao seu conteúdo arrastando-os sobre.

Na parte superior esquerda do painel está o menu de hambúrgueres que abre muitas opções. Aqui, você será capaz de ajustar cores, fontes e estilo do tema em um nível global. Escusado será dizer que isto poupa muito tempo enquanto adiciona novas páginas.

A partir desta aba, você também pode sair para o painel do WordPress a qualquer momento.

Na parte inferior do painel, há opções para ajustar as configurações da página, nomear a página, ver o histórico de edição e alternar entre os modos responsivos. Além disso, há um navegador que mostra uma visão organizada da página.

Ao clicar no ícone do olho, você pode Pré-visualizar a página, e quando estiver pronto para ir ao ar, pressione o botão Publicar.

Agora, é hora de começar a adicionar algum conteúdo.

Duas maneiras de criar um website de uma página com a Elementor

Neste estágio, você pode escolher ir construindo o website de uma página com a Elementor de duas maneiras:

1. Insira um dos modelos pré-construídos da Elementor e depois personalize-o conforme desejado. Para isso, clique no ícone da pasta na pré-visualização ao vivo do seu design e ele abrirá uma série de templates, alguns gratuitos e muitos profissionais. Na aba Páginas, você encontrará designs completamente acabados para páginas inteiras. Na aba Blocos, você encontrará modelos pré-construídos para seções específicas de uma página maior (este é o mais útil para um site de uma página).

Você pode inserir qualquer modelo clicando sobre ele. Depois, você poderá personalizar completamente cada elemento.

2. Alternativamente, você pode começar do zero, clicando no botão mais para adicionar uma seção e construir seu design a partir de uma tela em branco.

Para os propósitos deste tutorial, vamos adotar uma combinação de ambos os métodos – vamos construir a primeira seção do nosso site a partir do zero e, em seguida, escolher a partir de blocos de template para preencher as seções restantes.

Como criar secções do website de uma página com Elementor

Elementor usa secções, colunas e widgets para criar o layout de qualquer página. As seções são os maiores blocos de construção e você pode adicionar colunas dentro delas. Dentro dessas seções ou colunas, você será capaz de adicionar os widgets que você quiser.

Clique no sinal ‘+’ para adicionar uma seção e escolha a estrutura da coluna.

Quando você pairar sobre uma seção, uma borda azul aparece com uma alça na parte superior. Esta alça permite adicionar uma nova seção em branco acima da seção existente, ou editar/eliminar uma seção. Clicando nos pontos do meio, você pode acessar os controles da seção – layout, estilo e avançado. Além disso, você pode mover as seções para cima ou para baixo arrastando os pontos, e clicar com o botão direito para trazer mais opções como duplicar ou excluir.

Simplesmente, você pode clicar no handle do ícone da coluna no canto superior para escolher o layout da coluna dentro da seção. Você também pode ajustar a largura das colunas e o espaço entre elas. Clique com o botão direito do mouse sobre as caixas para adicionar mais colunas, duplicar as existentes, apagá-las e mais.

No painel Elementor, você pode arrastar qualquer elemento (chamado widget) para dentro da coluna. Uma vez adicionado um elemento a uma coluna ou seção, um ícone de Lápis aparece no canto superior direito. Clique neste ícone para trazer o conteúdo, estilo e opções avançadas de edição no painel Elementor.

Como criar a primeira secção

Usaremos a primeira secção para que os visitantes saibam a natureza do negócio e um pouco mais sobre ele. Para este fim, você pode usar toda a largura da seção para transportar uma imagem de fundo. Enquanto edita o layout da seção, você pode ajustar a largura do conteúdo e esticar a seção até a largura total da página, simplesmente comutando um botão.

Para adicionar a imagem de fundo, escolha a opção editar a secção clicando nos pontos do punho. Visite o separador Estilo que aparece no painel e carregue a imagem a partir da Biblioteca multimédia. Ajuste o tamanho da imagem assim como a sobreposição.

Adicionaremos uma única coluna dentro da secção e centrá-la-emos dentro da secção. Dentro da coluna, vamos usar três widgets – Heading que diz aos visitantes que você está vendendo frutas e vegetais frescos, um editor de texto que chama a atenção para as opções de entrega ao domicílio, e um botão de onde os visitantes podem fazer um pedido.

Adicionando um widget de Título:

Dragando um widget de texto:

Adicionando o widget de Botão:

Agora você pode personalizar cada widget usando as opções de edição.

Se desejar, você também pode adicionar os widgets em três colunas separadas, adicionando colunas clicando no ícone da coluna. O que é importante notar aqui é que cada widget pode ser ajustado minuto a minuto para layout, estilo e muito mais.

Criar as restantes secções

Agora que a primeira secção seja feita, pode passar para as três restantes – About Us, Products and Contact.

Como mencionado anteriormente, vamos usar blocos de modelos prontos da biblioteca Elementor para construir estas três secções. A Elementor tem muitos blocos de modelos gratuitos sob cada uma destas categorias e a biblioteca é pesquisável.

Para a secção Sobre Nós, vamos escolher um bloco de modelos simples com um cabeçalho, um editor de texto e um widget de vídeo. Você pode substituir tudo isto pelo seu próprio conteúdo.

O bloco de template com o conteúdo substituído:

Da mesma forma, você pode usar blocos de template para a seção Produtos e Contato. O modelo utilizado para a seção Contato vem com ícones de mídias sociais. Clique na guia Estilo para controlar a cor do ícone, tamanho, preenchimento e mais.

Since Elementor permite uma grande quantidade de personalização, você pode fazer essas seções parecerem diferentes dos modelos importados.

Quando terminar de fazer as alterações desejadas, clique no botão verde Publicar e as alterações estarão em directo no site.

Ligue o menu às secções de uma página

Para ter um menu de navegação clicável, precisa de ligar as várias secções do seu design Elementor com o menu de navegação que criou no passo #3. Para fazer isso, abra o ID de uma seção e vá para a guia Avançado. No campo CSS ID do Painel do Elementor na seção correspondente, preencha o nome correto da seção sem a hashtag.

Por exemplo, se o seu menu conecta a #about-us, você adicionaria o CSS ID como about-us. Então, repita o processo para todas as seções que você deseja linkar:

Configure seu design como a página inicial

Como último passo, você pode configurar a página que você acabou de criar como a página inicial do site de uma página criada com Elementor. Para fazer isso, vá para Configurações → Leitura. Clique em Select a static page under Your homepage displays, e selecione o design que você criou. Finalmente, clique em Save Changes.

Se você estiver confuso com qualquer passo, temos um guia completo sobre como configurar uma página inicial estática do WordPress.

Finalmente, seu website de uma página agora está pronto. Aqui está um exemplo do que pode parecer:

Conclusão

Aqui estão três passos simples que lhe permitirão criar um site de uma página hoje:

1. Determine o foco do seu site.
2. Selecione um tema de uma página de qualidade, como Neve.
3. Crie o seu site usando Elementor se necessário.