O meu objetivo número um, é ajudar os leitores a melhorar as suas vidas financeiras, e faço parcerias regularmente com empresas que partilham a mesma visão. Se a compra ou inscrição for feita através dos links dos nossos parceiros, recebo uma compensação pela indicação.

Neste vídeo, você aprenderá como criar e usar o Elementor num site WordPress completamento do zero, passo a passo, do início ao fim.

Existem muitos vídeos explicando como criar um site WordPress.

O que torna este único é que eu lhe mostro um método infalível para criar um site realmente bonito.

Esse é um ponto que muitas vezes é esquecido pelas pessoas que começam e criam seu primeiro site.

Vamos fazer isso sem codificação e sem a ajuda de um web designer.

Vou mostrar como utilizar os modelos personalizáveis da Elementor para criar uma estrutura bonita e personalizá-la totalmente
para o seu site.

Etapa 1 - Comprar nome de domínio e alojamento web

siteground website

A primeira coisa que você fará é comprar um nome de domínio e o respectivo alojamento web.

Eles serão usados como morada virtual na internet e que você criará.

A maioria dos artigos recomenda serviços de alojamento por meio de links afiliados.

Isso não é muito objectivo ...

Ele não fornece uma indicação verdadeira se a empresa de alojamento é realmente boa ou simplesmente recebeu a recomendação por razões de afiliação.

Neste guia, no entanto, eu recomendo o SiteGround.

Esta recomendação é dada porque eu realmente acredito que o SiteGround é uma empresa de alojamento excelente e confiável.

O SiteGround pode não ser o mais barato, mas quando se trata de alojamento, escolher a empresa mais barata não é algo que eu recomendaria.

O SiteGround é uma óptima opção por causa do seu suporte e serviço, confiáveis e de reputação.

Outro motivo para escolher essa empresa é porque a equipe de suporte trabalha em estreita colaboração com a nossa, assim você é coberto em termos de uso do Elementor.

Compre o domínio e alojamento no SiteGround

1. Visite o SiteGround (o link inclui uma oferta Elementor especial de até 70% de desconto)

2. Em alojamento na web, clique em alojamento partilhado. Existem vários planos no SiteGround. Escolha o plano de inicialização

3. Registe o seu novo nome de domínio

Etapa 2 - Instalar o WordPress

instalar o wordpress no cpanel

Agora que você comprou o domínio e o alojamento, pode fazer login no SiteGround e instalar o WordPress, através do instalador automático.

1. Digite o nome de usuário e a senha para efectuar login.

2. Vá para 'Minha conta' e depois vá para o cPanel. O cPanel é onde você gere o seu site e o seu domínio.

3. Clique no instalador automático do WordPress e conclua a instalação.

Após a conclusão da instalação, você deve esperar entre 24 e 48 horas para que o registro e a hospedagem do domínio sejam processados.

Então, se você acessar o URL do seu domínio, deverá ver a instalação padrão do WordPress. O tema padrão que é instalado é TwentySeventeen .

Etapa 3 - Instalar o tema & Elementor

Para personalizar completamente o design do seu site, você precisará instalar um construtor de temas e páginas gratuito.

Instalar tema

1. Vá para o administrador do WordPress. Para fazer isso, após o nome do domínio, digite '/ wp-admin'. Isso direcciona para a página de login padrão do WordPress.

2. Aqui, digite seu endereço de e-mail e senha para fazer login

3. Baixe o tema Hestia GRÁTIS da ThemeIsle.

4. De volta ao seu painel do WordPress, vá para Aparência> Temas.

5. Clique em Adicionar um novo tema.

6. Clique em 'escolher arquivo' e faça o upload do arquivo zip do Hestia. Em seguida, instale e active-o.

Para ver como o novo tema afectou o seu site, visite a página inicial do site novamente.

Instalar o construtor de páginas

Agora é hora de instalar o Elementor Page Builder. Este é um construtor de páginas gratuito e visual com toneladas de recursos úteis de design.

1. De volta ao painel, acesse Plugins.

2. Clique em 'Adicionar novo'

3. Procure Elementor, instale e ative-o

Etapa 4 - Adicionar modelo

O Elementor permite adicionar um modelo de design de página profissional completo com um clique, usando a biblioteca de modelos.

1. Clique em 'Página'> 'Adicionar novo'

2. Digite o título da página e clique no botão Editar com Elementor. Aqui, você pode ver o painel do editor, onde é possível projectar e visualizar o site ao mesmo tempo.

3. Para se livrar desse cabeçalho que você obtém do tema, vá para as configurações da página e escolha um modelo de largura total do construtor de páginas.

4. Clique em: 'Adicionar modelo'. Agora, escolha na longa lista de mais de 100 modelos de página , disponíveis no construtor de páginas Elementor. Clique em 'Inserir'.

Você pode revisar todas as secções que obtém: a secção de heróis, nossa secção de visão, nossas realizações, a secção 'Sobre nós', uma cotação, entre em contacto connosco e um carrossel de logótipos.

Vamos personalizar cada parte desta página, para torná-la completamente diferente e única.

Etapa 5 - Personalizar o modelo

Comece a projectar e alterar as diferentes partes da página.

Eu recomendo ir secção por secção, começando com a secção superior.

1. Altere a imagem de fundo. Você deve primeiro descobrir a largura e a altura exactas da imagem e usar esse tamanho para criar a nova imagem. Você pode usar uma ferramenta gratuita como o Pixlr para cortar e redimensionar a imagem.

2. Adicione uma sobreposição de plano de fundo, para que o cabeçalho fique mais proeminente

3. Outros elementos que você pode personalizar incluem títulos, texto, ícones, imagens e botões.

Alterar cores e tipografia

Você pode personalizar as cores e a tipografia da página.

Para tornar sua paleta de cores mais acessível, você deve personalizar o selector de cores que aparece no editor.

A alteração do selector de cores facilita a personalização das cores da página na sua paleta de cores:

1. Clique no ícone do hambúrguer e vá para o selector de cores

2. Altere as cores que aparecem no seu seleccionador

Agora você pode percorrer a página e alterar as cores para se ajustarem às cores do site.

A alteração das fontes é feita da mesma maneira fácil:

1. Sob o cabeçalho> estilo> família, escolha uma fonte, na grande variedade de fontes do Google.

2. Faça o mesmo com o restante dos títulos

Etapa 6 - Adicionar o menu

Adicionar Menu

Com sua página totalmente personalizada, você precisa voltar ao painel do WordPress e criar um menu de movimento suave.

Este menu permitirá que o visitante navegue por toda a página.

Quando o visitante clica em um link no menu, o cursor rola suavemente para a área direita da página.

1. Nomeie as diferentes áreas da página. Na secção Sobre, vá para a secção> avançado e, em 'CSS ID', escreva 'about'. O mesmo deve ser feito nas secções de serviços, depoimentos e contactos.

2. Volte para o painel

3. Em aparência, vá para os menus.

4. Crie um novo menu

5. Defina-o como menu principal. Dessa forma, ele estará disponível na parte superior do menu na página que estamos usando e no restante do site.

6. Adicione alguns links personalizados. O primeiro a adicionar é #about. É o mesmo nome que usamos em nossa área. E o texto do link será "Sobre". Faça o mesmo com #services, #testimonial e #contact.

7. Salve o menu

Se você actualizar a página, verá o menu e poderá clicar em um link e pode deslizar suavemente para a secção relevante.

Etapa 7 - Torne o site móvel responsivo

Na última parte do tutorial, você tornará o site inteiro responsivo a dispositivos móveis .

1. Para aceder à visualização móvel, clique no ícone da área de trabalho no canto inferior esquerdo e escolha móvel.

2. Agora, vá para a página e veja se consegue identificar áreas que poderiam ser melhoradas, como reverter a ordem das colunas ou adicionar preenchimento às manchetes.

Concluir o site

Já está quase terminando...

1. Em "Configurações da página", mude o status para publicado.

2. Volte ao painel do WordPress e defina esta página como a página inicial. Vá para Configurações> Leitura e defina uma página estática

Parabéns - Você concluiu seu site!

Espero que você tenha conseguido acompanhar e criar seu próprio site. Gostaria de receber seus comentários sobre o uso desse método de modelo para criar um site de uma página mais rapidamente.

Sobre o Autor

Joao Botas

João é um profissional de marketing digital com mais de uma década de experiência em negócios online. Ao longo da sua carreira, ele ganhou experiência em todas as áreas do marketing digital, desde redes sociais até publicidade paga. Ele trabalhou em projetos de clientes e projetos de afiliados. Hoje, ele está focado em construir novos projetos e direcionar tráfego através de SEO e publicidade paga.