Crie um site do Wordpress sem código - Elementor & Astra | Mihai C. | Skillshare
Pesquisar

Velocidade de reprodução


1.0x


  • 0.5x
  • 0.75x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Crie um site do Wordpress sem código - Elementor & Astra

teacher avatar Mihai C., Plan before acting.

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Assista a este curso e milhares de outros

Tenha acesso ilimitado a todos os cursos
Oferecidos por líderes do setor e profissionais do mercado
Os temas incluem ilustração, design, fotografia e muito mais

Aulas neste curso

    • 1.

      Apresentação

      0:40

    • 2.

      Escolhendo seu domínio, hospedagem e configuração de e-mail

      9:09

    • 3.

      Instalação e personalização de temas

      6:59

    • 4.

      Instalando os plugins

      5:46

    • 5.

      Compreendendo o painel do Wordpress

      9:40

    • 6.

      Elementor - Estrutura de sites - seções e colunas

      12:38

    • 7.

      Elementor - como usar e personalizar os elementos

      12:02

    • 8.

      Elementor - Modelos

      2:20

    • 9.

      Criando a página

      32:44

    • 10.

      Versão móvel

      6:03

    • 11.

      Usando âncoras de menu e adicionar animações

      6:26

    • 12.

      Editando o Rodapé

      6:01

    • 13.

      Temas personalizados

      3:15

    • 14.

      Criando a página 404

      4:43

    • 15.

      Como fazer SEO com Yoast SEO e dicas

      11:48

  • --
  • Nível iniciante
  • Nível intermediário
  • Nível avançado
  • Todos os níveis

Gerado pela comunidade

O nível é determinado pela opinião da maioria dos estudantes que avaliaram este curso. Mostramos a recomendação do professor até que sejam coletadas as respostas de pelo menos 5 estudantes.

75

Estudantes

--

Sobre este curso

Neste curso eu vou ensinar-lhe como criar um site de página do Wordpress One Page sem usar nenhum código, tanto que todos possam aprender a criar um site usando o Elementor e o Tema Astra que é o tema gratuito mais popular.

Este curso se concentrará na praticidade e não na criação de algo no topo, mas para ensinar todas as funcionalidades do próprio construtor.

Vou abranger todos os tópicos necessários, incluindo SEO e Otimização de imagem e um vídeo inteiro que mostrará como criar um site de uma página do zero para que você possa ver como é fácil em tempo real.

Então, se você já quis aprender como criar um site, esta é a opção mais fácil como tudo vai acontecer no ecrã em tempo real e você será capaz de arrastar e soltar os elementos desejados, como texto e imagens.

Mesmo que você queira aprender como criar sites como um hobby, isso também pode se tornar um caminho de carreira no futuro. Comecei a criar sites como um hobby e ajudei alguns amigos e eles começaram a me recomendar para outros e eu ainda crio sites de vez em quando para empresas futuras.

Este curso se concentrará na criação de um site de páginas em uma página / Landing Page - para que isso não se concentre na criação de um blog, mas todo o conhecimento pode ser facilmente aplicado.

Você está pronto para aprender como criar um site do Wordpress com facilidade?

Junte-se ao curso e aprenda tudo passo a passo sem precisar usar nenhum código!

*Certifique-se de verificar os recursos anexados no curso para obter informações sobre SEO e velocidade de site.

Conheça seu professor

Teacher Profile Image

Mihai C.

Plan before acting.

Professor

Hi ! :)

 

In 2017 I started to work as a Digital Marketing Consultant for Google Digital Hub where I taught over 300 entrepreneurs how to run their Ads for their business and build their online presence. As years have passed I started to love eCommerce and how the entire space works.

Currently, I'm an Entrepreneur & Freelancer in Digital Marketing & Web Development.

Visualizar o perfil completo

Level: Beginner

Nota do curso

As expectativas foram atingidas?
    Superou!
  • 0%
  • Sim
  • 0%
  • Um pouco
  • 0%
  • Não
  • 0%

Por que fazer parte da Skillshare?

Faça cursos premiados Skillshare Original

Cada curso possui aulas curtas e projetos práticos

Sua assinatura apoia os professores da Skillshare

Aprenda em qualquer lugar

Faça cursos em qualquer lugar com o aplicativo da Skillshare. Assista no avião, no metrô ou em qualquer lugar que funcione melhor para você, por streaming ou download.

Transcrições

1. Apresentação: Olá, neste curso vou te ensinar como criar um site de uma página com WordPress e elemento, ou essa é a maneira mais fácil de criar sites. E eu recomendo isso para iniciantes, pois você pode adicionar texto, imagens e outros elementos ao seu site em tempo real e movê-los com apenas alguns cliques. A melhor coisa sobre isso é que você não precisa ser um programador, então você não precisa saber nenhum código. Não sei como criar sites como um hobby, e tenho certeza de que você conseguirá executar esses dois em pouco tempo. Então, se você está pronto para aprender como começar a criar um site com WordPress e um elemento ou discurso visual para finalizar a compra. Como eu abordei tudo o que você precisa saber, incluindo SEL, vendo o curso. 2. Como escolher seu domínio, hospedagem e configuração de e-mail: Olá, bem-vindo ao curso. Agora, antes de mergulhar em qualquer coisa, você terá que comprar uma hospedagem e um domínio. O domínio é basicamente o URL do seu site como o Google, que está do meu lado aqui. E a hospedagem é o seu servidor onde você realmente terá seu site. Então, você pode simplesmente acessar o Google e digitar serviços de hospedagem, se não tiver um. E aqui temos algumas opções populares. Godaddy também é outra opção popular. Mas para este curso, eu escolhi hospedagem ou apenas porque essa opção é popular. Então, quando você acessa o site, por exemplo vamos ao host stinger. Nesta opção, você vai hospedar. E aqui temos a hospedagem WordPress. E eu escolhi a segunda opção porque também temos o domínio incluído. E isso é gratuito apenas no primeiro ano, então você terá que pagar novamente. E são apenas $10 por ano, o que é bem barato. Então, basta selecionar a segunda opção, que na verdade é a melhor porque você também tem o domínio e tem tudo o que precisa incluído. E depois de configurar, eles solicitarão o nome de usuário e a senha do seu site WordPress, e praticamente o nome do nosso site e tudo mais. Depois de passar por esse assistente e concluir a compra, você será redirecionado aqui. Este é um painel único do host e você clicará em Gerenciar. Você acessará o painel do WordPress. Depois de entrar aqui, certifique-se de ativar essa opção. Diz certificado SSL. Verifique se isso está ativo. O que isso é basicamente a extensão do seu site. Então, se você olhar aqui, na URL, temos HTTPS antes do domínio real, certo? Portanto, essa é basicamente uma versão segura do seu site, porque temos um bloqueio aqui. Então, se eu clicar nele, ele diz Como diz, essa conexão é segura. Então, é basicamente isso que esse certificado SSL faz. É basicamente uma camada extra de proteção para o seu site. E todo site deveria ter isso. Tudo bem, então, depois de ativar isso, você poderá acessar o painel do WordPress. Você tem duas maneiras de entrar nisso. A primeira é entrar aqui e clicar em Editar site. Então, se eu clicar nele e deixá-lo carregar. E é assim que vai aparecer pela primeira vez. Você pode simplesmente pular isso para clicar neste logotipo da WW aqui no canto superior esquerdo. E esse é basicamente o nosso painel do WordPress. E faremos algumas mudanças aqui. Mas eu quero mostrar outra coisa. Digamos que você tenha acessado o painel de uma maneira diferente. Há mais uma maneira. Você pode simplesmente abrir uma nova guia no seu navegador. Basta digitar o nome de domínio que você comprou. No meu caso, é esse one.com slash WP menos admin. Isso é o que você precisa digitar para acessar a área administrativa. Mas do meu lado, não vai aparecer. Deixe-me usar outro navegador. Eu vou usar esse. E você precisará inserir o nome de usuário e a senha que usou quando criou a hospedagem ou a conta pela primeira vez e fez a compra do site. Portanto, você precisa adicioná-los aqui e poderá fazer login no painel. Então é assim que ele pode entrar no painel. Você pode usar o nome de usuário ou simplesmente entrar na hospedagem ou no painel aqui e clicar em Editar site. Outra coisa que você terá que fazer. Você terá que ir até a aba de e-mails. Eu já fiz um para mim. Mas depois de clicar nela, você verá uma interface diferente aqui. E você terá a opção gratuita de criar seu e-mail. Você clicará nele e será redirecionado aqui. Deixa eu te mostrar. Tudo bem, vou clicar em contas de e-mail, criar uma nova conta de e-mail e você verá essa opção. Então, basicamente, você terá que criar um e-mail personalizado para o seu domínio, porque isso parece profissional, então você não usará o Gmail ou qualquer outra coisa. Então, por exemplo, eu criarei um que diga contato em meu domínio.com. Aqui, você inserirá a senha e clicará em Criar nova conta. E é basicamente isso. Agora temos um e-mail personalizado para seu domínio. E a maneira como você usa esse domínio, por exemplo, você pode adicionar esse e-mail em seu aplicativo do Gmail ou em qualquer servidor de e-mail que você queira usar. E a maneira de fazer isso é entrando em e-mails novamente, vou clicar nessa seta. E vamos esperar um pouco. E aqui temos a opção de configurar aplicativo de desktop. E aqui temos as configurações. Então, se você quiser usar esse símbolo para o Gmail, por exemplo, deixe-me mostrar. Vou apenas entrar em make.com. Eu vou entrar aqui, adicionar outra conta. Tudo bem? E eu farei isso. Eu não quero usar um Gmail. Acho que não consigo fazer isso a partir da minha conta real do Gmail para o Chrome. Preciso fazer isso do meu telefone. Acho que não está disponível no desktop. Você precisará usar outro aplicativo. Acho que isso funciona com o Outlook, por exemplo , deixe-me abrir, vamos fechar este. E se eu abrir o Outlook, o Outlook terá essa opção. Portanto, não está disponível para endereço de e-mail. Sim, vou apenas entrar em contato com o laboratório em x service.com. Tudo bem. E agora está me perguntando que tipo de hemólise. E aqui, como você pode ver, deixe-me voltar. Essa. duas opções de conexão com esse e-mail. Ele selecionará este. Terei que inserir meu endereço de e-mail e senha e esses dois servidores e as portas. Então, vou selecionar TOP. Teremos que inserir o servidor, que é POP escuro nesse e-mail. E a porta é 995. E então temos o servidor de saída, que é o mesmo, na verdade, é diferente. E-mail Smtp dot python dot. E entraremos no 4651. Tudo bem? E selecionaremos SSL, TLS. E para este também. Tenho a opção de selecionar a raiz quadrada da criptografia. Sim. Em seguida, vou inserir a senha aqui. E agora devemos ser capazes de nos conectar a esse novo e-mail. Sim. Adicionado com sucesso. Sim, foi basicamente isso. Agora estou logado neste e-mail. Como você pode ver, é assim que você faz login em um e-mail personalizado. Esses são os passos. Na verdade, é muito fácil porque temos as configurações aqui. E de outra forma, digamos, por exemplo que você não usou o host singer e usou outro serviço de hospedagem que provavelmente usará o cPanel. Portanto, esse é o painel popular e o mais popular, na verdade. Então, aqui temos muitas guias. A forma como você cria um e-mail aqui é na seção de e-mail. Você vai para contas de e-mail, vai para Criar. E aqui você digitará o e-mail desejado, praticamente a mesma coisa e a senha. E então você será redirecionado para as configurações novamente. Então, isso é muito fácil. A maneira de acessar o WordPress a partir daqui é rolando para baixo e você tem o gerenciador do Wordpress aqui na categoria de software. E você tem duas maneiras de registrar. Você pode clicar em Login e será redirecionado para o painel do WordPress instantaneamente. Ou você pode clicar em Gerenciar usuários, adicionar usuário e criar um novo usuário para fazer login no painel do WordPress usando o link de administrador do WP, como mostrei antes. Então é assim que você entra no painel do WordPress. No próximo vídeo, explicarei painel do WordPress e também instalaremos os plug-ins. Eu vou te dizer exatamente por que isso acontece. E sim, é basicamente isso. Vendo o próximo. 3. Instalação e personalização do tema: Agora que estamos no WordPress, a primeira coisa que você precisa fazer é acessar a guia de aparência e clicar nos temas. A partir daqui, adicionaremos um novo tema aqui no topo. E adicionaremos um tema chamado Astra, que é esse. Este é o melhor tema gratuito que você encontrará. Clicaremos em Instalar e depois o ativaremos. Lembre-se de que há muitos temas aqui e também há muitos temas personalizados. E falaremos sobre isso em um vídeo posterior deste curso. Então, vamos ativar este e depois personalizá-lo. Então, agora ele está instalado, novo tema ativado. E clicaremos em Personalizar aqui. Como você pode ver, agora, temos várias opções aqui. Cada tema tem essas opções. Basicamente. Alguns têm mais, outros têm menos. Então, vamos clicar em global e eu vou te mostrar cada um deles. Então, aqui na topografia, podemos basicamente mudar as fontes do nosso site, todas as fontes. Mas queremos mudar as fontes a partir daqui, usaremos uma espécie de plug-in ou aplicativo que nos ajudará a alterar as fontes em praticamente todos os lugares do site. Então, queremos usar as predefinições daqui. Mas eu só estou mostrando isso para você para que eles também estejam aqui. Então temos as cores. Você pode mudar as cores a partir daqui. E também poderemos alterá-los com o elementor posteriormente. Você pode alterar praticamente a cor do link. Como você pode ver, este é um botão aqui dizendo página de amostra do menu. Se eu passar o mouse sobre ele, a cor mudará para preto. Por padrão, a cor é azul. Então, podemos mudar essas cores aqui. Você pode alterar as cores dos cabeçalhos, que são os títulos, o corpo dos textos, que é esse, basicamente a descrição ou o parágrafo. E você pode alterar as cores das bordas, do fundo lateral e assim por diante. Então temos contêineres. Você não precisará mudar nada aqui porque vamos mudar isso do Elementor. Então, vamos voltar aos botões praticamente da mesma história. Você não vai mudar isso daqui. Tudo bem, editor de blocos, você quer usar este. Tem nosso construtor. Isso é importante. Em nosso site, temos cabeçalhos e rodapés. O cabeçalho é a parte superior do site. Então é esse daqui. Aqui, podemos basicamente adicionar nosso logotipo na parte superior. Podemos mudar nosso menu e adicionar alguns itens extras, como os ícones sociais que adicionei aqui. Então, por padrão, você quer ter qualquer coisa aqui. Você pode simplesmente clicar no site, no título e no logotipo, por exemplo, e selecionar um logotipo para o seu site. Então, eu posso simplesmente navegar e selecionar meu logotipo, que é esse. E vou clicar em Selecionar e pular o corte ao cortá-lo. E, como você pode ver, o logotipo está lá agora. Então você pode simplesmente ajustá-lo, torná-lo maior ou menor. Muito fácil. E, por padrão, você também terá essa caixa habilitada. Você simplesmente o desativará. Então, o Intune ainda mostra o texto. Então, eu posso simplesmente adicionar alguns ícones sociais, por exemplo, e vou deixar assim. Em seguida, vou clicar em voltar, voltar novamente. E optaremos pela próxima, pão ralado. Você também não precisa mudar isso. Se você acabou de adicioná-lo. Basicamente, ele adicionará a localização exata em que você está agora no site e a mostrará o tempo todo. Então, isso não é útil. Isso é usado principalmente em sites de comércio eletrônico. Temos produtos, então você sabe exatamente em qual categoria você está nesse site. No nosso caso, este será um site de apenas uma página, então não o usaremos. Vou selecionar o não e vou para a próxima categoria. Então temos o blog. Queremos usar o blog. Neste curso específico, vamos nos concentrar apenas na criação de um site de uma página. Portanto, não vou usar essas configurações. Esses são basicamente apenas o layout. Tudo bem? Vou apenas clicar em publicar porque ele não quer voltar. Isso acontece de vez em quando, isso é um bug, então você só precisa atualizar a página e ela funcionará depois. Temos layouts de página, praticamente a mesma coisa. Você não precisará alterá-los daqui, barra lateral, isso é para o blog, você não vai mudar isso. Em seguida, temos o construtor de rodapés. É praticamente a mesma coisa que o cabeçalho. Portanto, temos três seções. Você pode adicionar até três rodapés e também pode adicionar até três cabeçalhos. Temos layouts diferentes , como você pode ver aqui, temos colunas livres. Aqui temos apenas dois, e aqui temos apenas um. Basicamente, ele pode clicar em direitos autorais, por exemplo e alterar esse texto sempre que quiser. Você pode adicionar um menu aqui. Podemos adicionar ícones sociais ou alguns elementos extras apenas clicando neste botão de adição. E você pode fazer isso adicionando um menu de rodapé. Se você quiser ícones e widgets sociais, usaremos os widgets mais tarde. Basicamente, pode adicionar o que quiser. Ao usar um widget, você pode adicionar imagens, calendários, o que quiser. Tudo bem, vamos para a próxima. Desempenho. Você não precisa tocar nesse. Identidade do site, ícone do site, que é o ícone do site, basicamente esse pequeno brilho que você vê aqui na parte superior. Você pode alterá-lo com seu próprio logotipo do site. No meu caso, meu logotipo não tem formato quadrado, então eu posso encaixá-lo. Agora vamos selecioná-lo para que você possa ver como ele aparece. A pré-visualização normalmente não é boa, mas será exibida depois quando eu atualizar a página. Então, aqui está uma prévia disso. Como você pode ver, não é a melhor opção que tenho, mas se você tiver um logotipo com formato quadrado, ele aparecerá aqui, como você pode ver. Vou guardá-lo para este curso. Tudo bem? E então eu vou voltar e temos menus. Aqui. Você verá todos os seus menus. Você também pode criar um novo menu, mas criaremos um novo menu a partir do painel e eu mostrarei mais tarde. Então temos widgets. Novamente. Você poderá adicionar esses widgets da seção de cabeçalho e rodapé que eu visitei anteriormente. E vamos trabalhar com eles posteriormente nas configurações da página inicial do curso. Isso é importante aqui, você terá que selecionar uma página estática e criar uma página inicial. Por padrão. Você não tem uma página inicial. Então, criaremos um no próximo vídeo. Mas só para você saber, você pode mudar isso daqui e você deve mudá-lo. Porque se você deixar assim, seu site será um blog por padrão. É por isso que devemos passar pela página estática e selecionar a página inicial. Então, faremos isso mais tarde. Então você tem CSS adicional. E isso é estritamente para codificação, mas não usaremos nenhum código neste curso. No próximo vídeo, mostrarei os plugins e mostrarei exatamente o que eles são para ver o próximo. 4. Como instalar os plugins: Agora é hora de entrar na seção de plugins. Então você vai para os plugins, plugins instalados. E removeremos tudo daqui. Você clicará neste para selecionar tudo. E em ações em massa, você selecionará a ativação se elas estiverem ativadas. Então vá para a ativação, aplique. Em seguida, você os selecionará novamente. E você selecionará, excluirá e aplicará novamente. E agora vamos instalar apenas os plugins úteis. Então, você aceitará Adicionar novo aqui. E adicionaremos os seguintes plug-ins. Então, os plug-ins são basicamente aplicativos que nos ajudarão a fazer coisas diferentes no WordPress. Então você precisará de um editor clássico. Neste, você clicará em instalar. Agora. Isso facilitará a interface de criação de páginas no WordPress. E então você clica em Ativar. Adicionar novo. Vamos instalar outro chamado Yoast. Este, Install. Novamente, este nos ajudará na otimização do nosso site. Em seguida, procuraremos dinheiro na velocidade da luz, que é esse. Este também nos ajudará na otimização do nosso site. Isso também aumentará a velocidade do nosso site. Agora vamos procurar outro chamado duplicado. Publicar. Essa. Outro tem 404 páginas. O primeiro. Agora teremos que procurar um plugin para nossos formulários de contato , chamado formulator. Exatamente esse. E outro chamado Elementor. Este é o nosso construtor de sites. E você poderá criar seu site em tempo real. E é muito fácil de usar. Você pode simplesmente arrastar e soltar o texto, movê-lo daqui para lá. E segundo, vai ser super fácil. Então, vamos ver se eu esqueci alguma coisa. Eu tenho todos eles aqui. Então, esses dois, cookie, GDPR e Simple SSL. SSL tão simples. Ssl é basicamente um certificado de segurança. E esse plugin ativará esse certificado se ele, se ainda não estiver ativado. No meu caso, ele já está ativado porque você vê esse ícone de cadeado aqui perto do meu nome de domínio. Se eu clicar nele, ele dirá que a conexão é segura porque eu tenho esse certificado, certificado é válido, certo? Então, basta instalar este plugin caso seu certificado SSL não esteja habilitado. E mais uma: precisaremos desse plugin GDPR de cookies. Então, acabei de instalar este também. Na verdade, não esse, porque existem muitos e parecem parecidos. Este cookie é o GDPR. Então, excluiremos esse e instalaremos esse. Eles têm meio que o logotipo do Yahoo. Então, é muito parecido. E agora vamos para a seção Plugins instalados. E excluiremos essa conformidade com o GDPR. E vamos ativar os outros. Então, as ações em massa são ativadas e aplicadas. E vou te contar resumidamente o que cada um deles fará. Então, vou clicar em pular aqui e clicar em Ativar SSL. Você não precisa fazer mais nada, pode simplesmente ignorar tudo daqui. E eles entrarão em plug-ins. Então, página 404, isso é basicamente quando alguém insere uma URL errada para seus sites. Então, se eu for ao meu site e errar, eu digito outra coisa. Então, por KCSO result com slash as D, por exemplo este é o fórum da página, mas criaremos um fórum separado para página que terá um botão. Quando alguém clicar nesse botão, ele o redirecionará para a página inicial. Então, se eles entrarem em algum lugar errado, nós os encaminharemos para a página inicial. Então, isso será útil para que eles não saiam da nossa página. Depois, temos o editor clássico, como eu disse, isso simplificará a criação do cookie de páginas como GDPR. Isso é necessário. Basicamente, todo site tem isso. Portanto, ao acessar um site, você terá que aceitar os cookies. Tenho certeza de que você conhece essa cópia e exclusão de postagens. Você poderá facilmente copiar postagens e páginas com este plugin. Então, isso simplificará tudo. Elementary é nosso construtor de sites. Formulator seria o plugin que usaremos para criar formulários de contato. Melhorou a velocidade do nosso site. Este é o certificado e também nos ajudará a otimizar um site. Então, esses são os plug-ins que usaremos. E no próximo vídeo, mostrarei o plug-in Elementor e como ele funciona. 5. Compreender o painel do Wordpress: Vamos usar o painel da broca e eu mostrarei o que é mais importante aqui. Então, temos a etapa de postagem. O primeiro passo é para o blog. Então, quando você estiver fazendo suas postagens no blog, você entrará aqui e clicará em adicionar novo. Você também pode selecionar a postagem do blog que deseja. Você pode excluí-los ou editá-los. Você pode fazer o que quiser daqui. Digamos que eu esteja excluindo esse. E eu quero criar um novo clicando em adicionar novo. Aqui você adicionará o título da postagem. Então, digamos, dez maneiras de ter um estilo de vida mais saudável. E aqui eu vou digitar o que eu quiser sobre isso. Depois, você pode adicionar imagens, adicionar links e o que quiser. Você também tem algumas opções aqui para alinhar o texto, colocá-lo em negrito e assim por diante. Então é basicamente assim que você faz um post no blog. É muito, muito simples. Aqui você tem alguns padrões, como praticamente alguns modelos ou predefinições para essas postagens específicas do blog de sangue. Mas você pode simplesmente ficar com o padrão, se quiser. É bem fácil. Aqui você criará as categorias para a postagem do blog. Então, digamos que este esteja na categoria saúde. Basta adicionar uma nova categoria, chamá-la de saúde e adicioná-la. E você selecionará essa categoria para essa postagem específica. Muito simples. Aqui, você inserirá as tags. Eles são muito importantes e você deve adicionar tags específicas ao seu tópico. Então, neste caso, temos saúde, podemos adicionar condicionamento físico, estilo de vida e assim por diante. Tudo depende do que você está escrevendo. Esses testes são úteis porque você se virará dirá ao mecanismo de busca exatamente o que é importante neste artigo específico. E praticamente o Google saberá exatamente quando mostrar esse artigo com base nas palavras-chave. Então, sim, é assim que você adiciona uma postagem. E você clicará em publicar e, em seguida, terá o link aqui e poderá acessá-lo onde estiver. Você tem a seção de categorias, a seção tributária, para que você possa gerenciá-las aqui. Isso é simples. Então você tem a seção de mídia. Aqui. Você terá todas as suas imagens, vídeos e arquivos. Então, temos a seção Páginas aqui. Você pode simplesmente criar e adicionar novas páginas ao seu site. Bem simples. A seção de comentários é para o blog. Aqui você verá todos os comentários do seu blog. Você tem comentários pendentes aprovados e poderá aprová-los ou rejeitá-los aqui. Então você tem o Elemental, que é o nosso plugin e os modelos, este é o plug-in de cookies para o GDPR. Você não precisa fazer praticamente nada com isso. Você pode alterá-lo se quiser. Assim, você pode personalizar o banner que aparecerá. Se eu clicar no banner de pré-visualização aqui, você o verá. Então é assim que ele aparecerá no meu site. Portanto, você terá que clicar em Aceitar, aceitar também os cookies, e é assim que eles aparecerão e você sempre poderá fazer alterações nos cookies. Portanto, é praticamente totalmente automatizado. Você também precisará criar uma página de cookies para o seu site. Então, aqui temos algumas opções e tenho certeza de que você pode clicar em Personalizar banner e poderá selecionar uma página para seus cookies. Deixe-me ver se esse plugin nos permitirá fazer isso. Aviso de cookie ou certo? Rotulado, rejeitado, leia mais. Sim, exatamente. Nesta seção do rótulo, você pode ativar o link Leia mais e poderá inserir o URL em sua página específica para seu cookie ou política de privacidade. Então, teremos que criar uma página para isso. Mas se eu entrar nas páginas e abrir uma nova guia aqui, você verá que, por padrão, WordPress criou uma, mas temos alguns textos aleatórios adicionados por eles. Então, se você quiser mudar isso, você terá que mudá-lo. Então, eu posso simplesmente copiar esse link daqui, por exemplo, à direita, e simplesmente inseri-lo neste URL. E quando clicarem em ler mais, serão redirecionados aqui. Mas antes disso, teremos que fazer algumas mudanças que são importantes. Portanto, você terá que acessar as configurações aqui e outras leituras aqui, você terá que alterar isso. Portanto, a página inicial exibe a página inicial porque, se você tiver feito uma, você clicará em salvar alterações para que sua página não apareça mais como um blog. E outra coisa sob link permanente aqui. Você precisará alterar o formato do nome da postagem. Dessa forma, seus links aparecerão exatamente com o nome da sua postagem. Portanto, existem muitos formatos, como você pode ver, mas esse é o mais relevante, pois não tem números, datas nem nada. E também clicaremos em Salvar aqui. Em seguida, teremos algumas configurações gerais. Você pode alterar o título do seu site, o slogan, que é descrição do seu site que aparecerá no Google. Isso é importante. Você terá que escrever algo relevante aqui que inclua palavras-chave. Eles são um nicho específico para nossa base, para nossos negócios. Então, se eu apenas pesquisar no Google, digamos, serviço de conserto de bicicletas, posso ver minha concorrência. E, basicamente, olha o que eles escreveram. E eu posso pegar alguns exemplos e escrever algo assim para mim, certo? Eu posso simplesmente pegar algo daqui e desta descrição e escrever algo para este site. Mas eu não vou escrever nada para essa demo. Mas você entendeu. Aqui. Você pode alterar o fuso horário do seu site, o formato da hora e o formato da data. Muito simples de entender. Deixe-me ver se é outra coisa importante que eu preciso te mostrar aqui. Você sempre pode examinar os plug-ins e assim por diante, mas nós os abordaremos mais tarde. Aqui temos os widgets. Então, deixe-me mostrar o que são. Essa é a barra lateral principal. Então isso é para o blog. Portanto, você sempre pode editar isso, alterar os textos daqui, se quiser traduzi-los ou escrever outra coisa em vez disso , você pode fazer isso. Isso é para o cabeçalho. Assim, você pode adicionar um widget para o cabeçalho e, em seguida, você poderá adicioná-lo mais tarde se você apenas personalizar o tema, como fizemos anteriormente aqui, e você poderá adicionar qualquer um desses. Você pode simplesmente clicar em navegar por tudo e verá que temos muitos widgets aqui. Então, você pode basicamente adicionar tudo o que quiser no cabeçalho e no rodapé. Então você tem calendários, por exemplo, pode adicionar isso na pasta, mas eles são muito grandes e não terão uma boa aparência, então você não deve usá-los. Mas você pode adicionar o que quiser. Isso é apenas uma referência para que você saiba exatamente o que pode fazer. K. E então temos os menus. A partir daqui, você criará os menus. Então, basta digitar o nome do menu, digamos, menu principal, Criar. E você pode adicionar as páginas diretamente daqui. Ele os detectará automaticamente. Então, o WordPress detectará isso para nós. E você também pode adicioná-los por meio de links personalizados. Então, se você quiser usar a âncora do menu sobre a qual falei ou sobre a qual falarei no próximo vídeo. Você precisará inserir o URL aqui, como seu site, por exemplo, .com, hashtag de barra e uma parte específica da sua página Digamos que você tenha seção Serviços em sua página inicial. Então, quando alguém clicar nesse botão, será redirecionado para aquela parte específica da página. Mas vou mostrar, vou mostrar um exemplo também para que possamos entender isso. Mas, basicamente, você criará o menu a partir daqui. Você pode adicionar o link e o texto que será exibido, digamos, entre em contato conosco, por exemplo ou entre em contato. Para simplificar isso adicione o site com o link específico. Vou apenas adicionar o site simples agora mesmo. Certo? Então, eu também posso adicionar um botão home no menu. E praticamente tudo o que você quiser sobre serviços. E então você cria o menu a partir daqui e, em seguida, selecionará o que isso representa. menu principal é o menu principal e o menu externo do Canvas é para dispositivos móveis. Portanto, sempre tire o menu principal e saia do menu Canvas ao mesmo tempo. A menos que você queira criar um menu diferente para o celular. Mas você deve sempre ficar com esses dois. E então você clica em Salvar e esse menu é criado. Aqui você tem o botão criar um novo menu. Então, se você quiser criar um menu para o rodapé, você pode criar um menu para o rodapé. Basta adicionar o menu de rodapé como o nome, por exemplo , selecionar o menu de rodapé aqui e clicar em Criar. E então você apenas adicionará botões como eu fiz com o anterior. Portanto, é muito fácil de entender. Então é basicamente isso. Quando se trata do painel, como ele funciona. Há muitos botões aqui, mas você não precisará ativá-los. Talvez os usuários também sejam importantes porque você pode adicionar outros administradores para acessar seu site WordPress, se quiser. Então você clica em Adicionar novo aqui. Você adiciona o nome de usuário desse usuário, um e-mail e a senha que é gerada automaticamente, certo? Portanto, é muito fácil de usar. E aqui você selecionará a função desse editor de usuário específico para que ele possa editar tudo em seu site, de texto a imagens e assim por diante. Alpha é estritamente para o blog. Então, se quiserem criar uma postagem no blog ou uma pequena postagem no blog, eles poderão fazer isso atribuindo-lhes uma função específica. Então, sim, é assim que funciona e também é muito fácil a partir daqui. Então, esses são os mais importantes do painel. Ao ver o próximo, explicarei como o Elementor funciona. 6. Elementor - Estrutura de sites - seções e colunas: Agora criaremos nossa primeira página e falaremos sobre o Elementor. Então, vamos entrar em páginas, todas as páginas. E, por padrão, você terá algumas páginas criadas aqui. Excluiremos essa página de amostra clicando na lixeira. E clicaremos em adicionar novo aqui no topo. E criaremos uma nova página chamada home. Em seguida, você clicará em Publicar. Agora, basta clicar em editar com o Elementor e posso editar esta página. Então, como uma explicação simples, os sites são divididos em seções e colunas. Então, como isso funciona? Basicamente, se eu clicar nesse botão de adição aqui, selecionarei uma estrutura para essa seção específica. Eu posso basicamente dividir uma seção em várias colunas. Digamos que eu esteja selecionando esse. Temos duas colunas. Então, agora temos uma seção que é essa borda azul, e dentro dela você tem colunas. Esta é uma coluna que eu posso arrastar e mover. E essa é outra coluna. Certo? Agora, cada seção e coluna tem algumas configurações. Então, se eu clicar nesses seis pontos aqui, diz a seção Editar, vou apenas clicar nela. E essas são minhas configurações. Então, aqui temos na guia Layout, temos a largura do conteúdo em caixa. E você deve deixar assim. Se você clicar na largura total, veja o que acontece. Temos o limite dessas colunas. Ele se estenderá até a esquerda e para a direita. Então você pode fazer isso em tela cheia, mas isso não vai parecer certo. Portanto, deve ir com caixas. Agora temos uma lacuna de colunas. Isso basicamente aplicará uma lacuna entre a coluna em si e o que está dentro dela. Eu raramente uso isso, então não devemos nos preocupar com isso. Essa é a altura da coluna. Então, se eu selecionar ajustar à tela, por exemplo agora essa coluna será tão grande quanto minha tela. Se eu selecionar uma altura mínima, posso simplesmente ajustar a altura desta forma. Então, muito fácil, certo? Você pode simplesmente adicionar uma imagem de fundo por trás dela, por exemplo, como você pode simplesmente ajustá-la a partir daqui. Agora temos a posição da coluna. Eu posso simplesmente ajustar essas colunas na parte superior ou inferior, à direita. Muito fácil. Alinhamento vertical, não se preocupe com isso, transborde, não se preocupe com isso. E você não precisa usar nada disso. Algo importante é a guia Estrutura. Isso basicamente dividirá essas seções e mudará o formato. Assim, você terá um menor e este é duas vezes maior que o primeiro. E este vai reverter praticamente a aparência. Então, se, por exemplo, quisermos adicionar mais colunas, posso simplesmente clicar com o botão direito em uma coluna e teremos uma nova coluna. Agora temos três deles. E se eu entrar novamente em Configurações para esta seção sobre a estrutura, agora temos layouts diferentes porque temos três deles. Portanto, você pode jogar com as estruturas da maneira que quiser. Sim, então é bem simples. Agora temos a guia de estilo. Na guia de estilo, temos várias opções. Então, em segundo plano, temos duas opções, Normal e passar o mouse. mouse significa que quando você o mouse sobre um determinado elemento, ele se comportará de forma diferente. Então, isso funciona praticamente para todos os elementos que você adicionará aqui, texto, imagens, o que quiser. Aqui dentro. Digamos que eu esteja adicionando um plano de fundo. Temos várias opções. Posso selecionar um fundo simples, clássico ou colorido, se quiser, por exemplo, bem simples ou uma imagem. Aqui temos a opção de gradiente. Então, podemos basicamente fazer uma combinação entre duas cores. Então, podemos ter um plano de fundo diferente. Então eu posso acrescentar talvez algo assim. Você também pode alterar a localização das cores, o ângulo, o tipo. Muito fácil de entender. Você pode simplesmente brincar com ele se quiser. Vou apenas remover isso e adicionarei uma imagem de fundo. Você também pode adicionar um vídeo, como pode ver aqui. Você tem a opção de fazer o vídeo ser reproduzido novamente. Comece de uma segunda vez específica, o link do YouTube e assim por diante. Você também pode adicionar a apresentação de slides de várias imagens. Loop infinito significa que essas imagens mudarão continuamente e se repetirão basicamente, a duração mudará uma vez a cada 5 s, 1.000 milissegundos é 1 s. Tipo de transição, animações diferentes, quanto tempo leva para que o tipo de plano de fundo de transição específico. Então você pode simplesmente jogar com essas opções e mostrar para você o que é isso? Então, se eu selecionar, por exemplo uma imagem como capa, selecionarei esta. Criar, inserir. E agora, por exemplo, essa tecla de efeito Burns adicionará um bom efeito de zoom à minha foto. Mas primeiro eu tenho que fazer alguma coisa, eu tenho que selecionar a capa. E deve funcionar, mas tem alguns problemas. Então, deixe-me mudar isso. Vamos selecionar o ajuste à tela. E eu vou entrar na moda novamente. E vamos tentar agora. Deve haver algum viés porque geralmente funciona. Talvez se adicionarmos mais um, isso resolva. Vamos adicionar mais uma foto. E vou acrescentar, digamos que este. Sim, e agora funciona. Como você pode ver, ele diminui o zoom da imagem lentamente, o que parece muito legal, na verdade. Então, se você quiser cancelar esse loop infinito, podemos fazer isso usando isso. E não vai fazer isso para sempre, certo? Então, é muito legal. Agora, se eu remover isso também, por exemplo, e eu quiser adicionar uma imagem simples. Posso fazer isso clicando no clássico e selecionarei uma imagem. Aqui mesmo. Temos certas opções. Agora, eu posso simplesmente selecionar o posicionamento da imagem se eu quiser. Eu posso selecionar os anexos, o tipo. Então, por exemplo, se eu selecionar fixo e rolar, a imagem ficará parada. Mas isso criará um efeito interessante. E para rolar, a imagem se moverá com o pergaminho. Então, sim, muito simples. Agora, repito, isso é autoexplicativo. Basicamente, se você não quiser que uma imagem se repita, como você pode ver agora com desaparecida porque ela estava se repetindo porque a resolução não é perfeita. E se tivermos alguns pontos vazios, ele se repetirá automaticamente . Então, não queremos isso. E sob o tamanho, posso selecionar uma capa, por exemplo, para que agora a imagem se estenda e caiba em toda a tela, o que é melhor. Aqui temos uma sobreposição de fundo. Basicamente, podemos adicionar outra cor na imagem sobre essa imagem. Então, por exemplo, se eu quiser escurecer esta imagem, posso simplesmente selecionar o tipo de fundo, clássico, e selecionar uma cor preta. E agora essa imagem está mais escura e você também pode ajustá-la daqui. Bem simples. Aqui temos a opção de passar o mouse. Então, deixe-me mostrar o que isso faz praticamente todos os elementos. Então, se eu clicar em passar o mouse e quiser mudar essa cor preta para outra coisa. Quando você passa o mouse sobre ele, posso simplesmente selecionar o clássico, por exemplo e selecionarei um vermelho. E agora a imagem fica vermelha quando eu passo o mouse sobre ela. Bem simples. E isso pode funcionar com botões, texto, imagens e praticamente tudo o que você quiser. Tudo bem, então vamos remover isso. Então. Nós temos fronteiras. Basicamente, você adiciona uma borda ao redor cada forma, seção ou coluna. Então, você pode praticamente adicionar uma borda aqui, se quiser. Temos algumas opções. E aqui está a largura da borda. Então, digamos, dez pixels. Agora você pode ver que a borda ao redor dela também pode mudar a cor dessa borda sempre que quiser. Então é assim que essa fronteira funciona. Você também pode adicionar um raio de borda. Então, isso basicamente criará algum tipo de forma para nossa coluna de seção ou qualquer elemento ao qual você queira adicionar uma borda, digamos 50 pixels. E agora, como você pode ver, esta seção está ao virar da esquina. Então é isso que a fronteira faz. Você pode simplesmente aumentá-lo se quiser, certo? Isso funciona melhor para imagens, só para você saber, então selecionaremos zero. Você também tem a opção de desvincular os valores aqui para poder adicionar o valor que quiser , independentemente um do outro. Então, neste caso, vou apenas removê-los. Então temos divisores de forma. divisórias de forma são elementos de design muito legais. Então, por exemplo se eu quiser adicionar uma na parte inferior da seção, aqui temos as opções e posso simplesmente percorrê-las. Então é assim que parece. Muito legal, certo? Você também pode mudar a cor. Como sempre. Com a altura, podemos invertê-la. Então, sim, é um efeito muito legal e você tem muitos deles. Então, vou remover esse. Então temos a topografia. Basicamente, você pode alterar todas as fontes nesta seção. É por isso que eu te disse que você não precisa transformar isso em fama anteriormente. Mas também podemos mudar isso individualmente para um elemento específico. Então, simplesmente não toque nisso. Você não precisa mudar nada. Agora também temos o aplicativo avançado. E aqui nos preocuparemos apenas com algumas coisas. Margem. O que é isso? Então, basicamente, ele adicionará um espaço entre essa seção e o elemento acima dela, ou o elemento que está na parte inferior da seção. Então, se eu quiser adicionar 50 pixels na parte superior, agora temos um espaço entre a seção e o cabeçalho. Como você pode ver, muito fácil. Você também pode desvincular os valores e adicionar apenas 50 pixels na parte superior e zero na parte inferior. Certo. Tão fácil de entender. Agora, o preenchimento é o oposto da margem, então ele adicionará um espaço dentro da seção ou coluna real ou qualquer elemento que você tenha. Então, por exemplo, se eu quiser arrastar, digamos que um título seja um título nesta coluna. Aqui dentro. Eu posso editar esta coluna, ir para Avançado e adicionar alguns espaçamentos. Agora temos algum espaço entre o elemento e a coluna real. Muito fácil de entender. E, como você pode ver, podemos arrastar esse elemento sempre que quisermos. Então, vou clicar com o botão direito do mouse nele e nos litros. Vamos voltar às configurações. E, sob o nível avançado, temos algo mais. Não me importo com isso. Você nunca os usará. Eles são mais complicados e eu quero simplificar isso aqui. Aqui temos efeitos de movimento. Você pode adicionar efeitos a colunas e elementos onde quiser. Então, vamos selecionar um efeito saltitante, por exemplo, e como você pode ver, que estava em vigor em toda a seção. Aqui temos o botão responsivo. Isso é muito útil. Então, você pode basicamente ocultar certos elementos, se quiser. Você pode ocultar essa coluna, por exemplo, para celulares. Esconda-o para usuários de desktop e mostre no seu celular. Você pode fazer isso. E isso é basicamente tudo quando se trata das configurações desta seção. Agora, a coluna tem praticamente a mesma configuração, mostrará a largura de duas colunas. Você pode mudar isso se quiser, mas não precisa. Alinhamento vertical. Você quer mudar isso. Alinhamento horizontal. Você quer que as cadeiras decidam, esse importante espaço de widget. Então, basicamente, isso é, por padrão, 20. Então, se adicionarmos vários elementos aqui, digamos que eu esteja adicionando o título e depois queira adicionar um botão. Você verá que há um espaço entre eles. E a maneira de mudar isso é acessando as configurações. E você terá que alterar o espaço do widget aqui para que eu possa defini-lo como zero. E agora eles estão próximos um do outro. Então, isso é basicamente quando se trata das configurações da coluna e da seção. Essas configurações aparecerão praticamente em todos os elementos que queremos adicionar. Então, se você adicionar um botão, os textos estão encabeçando uma imagem, como você quiser. Eu posso simplesmente clicar na caneta e editar. Você tem as configurações individuais e, em seguida, o estilo e as configurações avançadas para praticamente todos os elementos. E eles são muito, muito parecidos. Nós temos fronteiras. Podemos editar o texto, cor de fundo, cor, quatro elementos e assim por diante. Então, é muito fácil. Então, vendo o próximo vídeo , explicarei alguns elementos do ensino fundamental. 7. Elementor — como usar e personalizar os elementos: Vamos agora escolher os elementos, esse elemento ou tem. Então a primeira é a interseção aqui, certo? Vamos, deixe-me fechar esse. Aqui. Temos uma seção com uma coluna, certo? Se eu arrastar essa interseção dentro da coluna, agora tenho duas colunas dentro da coluna. Então, basicamente, isso criará uma pequena seção que também pode ter colunas internas, mas você pode fazer isso dentro da coluna. Então, se eu quiser, por exemplo, adicionar mais duas colunas abaixo dessas duas, posso fazer isso adicionando esta abaixo. Mas se você quiser, por exemplo, significa que são dois. Se você quiser adicionar, se quiser adicionar, digamos, uma nova coluna aqui, à esquerda e à direita, e quiser adicionar mais abaixo. Você pode fazer isso clicando com o botão direito do mouse. Você pode arrastá-los para baixo. A única maneira de fazer isso é adicionando, adicionando interseções dentro das colunas. Dessa forma. Então agora eu posso simplesmente arrastar a outra interseção e ter várias, certo? Então essa é a única maneira de fazer isso. Se você quiser adicionar mais abaixo, basta excluí-los e removê-los, se quiser. E eu posso simplesmente excluir isso e ter apenas um, e então adicionamos mais um, dividimos isso em, essa é a melhor maneira de fazer isso. Você não precisa adicionar várias colunas. Você pode simplesmente clicar com o botão direito, por exemplo , agora e adicionar três deles, e todos eles estão dentro dessa interseção. Assim, você pode adicionar mais abaixo. É isso que a interseção faz. Então, temos elementos simples, como texto. Você pode simplesmente alterá-lo aqui digitando. Podemos adicionar um link para esse texto. Então, quando alguém clica nele, ele o redireciona para esse link específico. Você pode alterar o tamanho a partir daqui, mas eu não recomendo trocá-lo daqui. Faremos isso acessando a guia de estilo. E aqui temos a tag HTML que é importante. Você deve ter apenas um H1 por página. Portanto, apenas um H1 por página. Isso é muito importante para o seu SEO, o que significa otimização de mecanismos de busca. Portanto, isso é muito importante para o mecanismo de pesquisa do Google e os outros mecanismos de pesquisa, pois você lhes dirá exatamente quais palavras-chave são importantes para você no seu site. Portanto, neste H1, você deve sempre adicionar palavras-chave importantes. Então, no meu caso, escreverei serviços profissionais de conserto de bicicletas, certo? Então, vou centralizar isso, por exemplo vá para o estilo e eu posso mudar a cor do texto. Também posso alterar a fonte clicando na panorâmica aqui. Portanto, temos muitas fontes. Vou apenas selecionar um que eu goste, que é ferroviário. E você pode simplesmente ajustar o tamanho a partir daqui. Bem simples. Aqui você pode ajustar o peso, que significa a espessura da fonte real. Você pode selecionar a opção em negrito ou o que quiser. Você pode transformá-lo em letras maiúsculas. minúsculas, n capitaliza o primeiro. Novamente, temos estilo, altura da linha, que adicionará um espaço entre o texto e a parte superior ou inferior. Bem simples. espaçamento entre letras pode criar alguns efeitos interessantes com isso. E também o espaçamento entre palavras. Então, sim, bonito, muito fácil de personalizar e usar. Então você tem o traçado do texto. Isso é basicamente um esboço ao redor do texto. Então, digamos que eu esteja selecionando vermelho e aumentarei isso. Como você pode ver, esse vermelho está ao redor das letras. Em seguida, temos a sombra do texto. Você basicamente adicionará uma sombra aos textos reais. Assim, você pode aumentar o desfoque, o que aumentará o raio. Também podemos reduzi-lo, por exemplo , você pode simplesmente ajustá-lo a partir daqui. Então você pode ver a sombra agora se movendo. Então você pode fazer algo assim, se quiser. Você pode personalizá-lo como quiser. Você tem muitas opções. E se você quiser removê-lo, clique nele para voltar ao padrão. Portanto, ele pode lidar com praticamente tudo aqui. Simples. Você não precisa mexer com o modo de mesclagem. Você pode jogar com ele se quiser. Mas eu praticamente nunca o usei. E então temos as configurações avançadas que são praticamente o mesmo preenchimento de margem. Você não precisa digitá-los aqui. Efeitos de movimento para animações, certo? Simples. Fronteira. Se você quiser adicionar uma borda ao elemento específico aqui, e a opção Responsive para ocultá-la no desktop, no celular e assim por diante. Você não precisa tocar nos outros. Então, essas são praticamente as mesmas configurações para cada elemento. Deixe-me remover este clicando com o botão direito do mouse e excluí-lo. Se eu, se eu adicionar uma imagem, por exemplo, aqui, você pode adicionar a imagem em si. Você o seleciona na galeria onde você o carrega. Em seguida, você seleciona o tamanho. Qualquer tamanho que você quiser. Legenda de alinhamento, que é basicamente essa. Então, se eu clicar na imagem aqui, terei um campo de legenda. Então eu posso digitar algo. Se eu quiser mostrar essa legenda. Em seguida, também posso selecionar uma legenda personalizada para que eu possa digitar algo que seja texto, por exemplo você também pode adicionar o link, se quiser, ou se você selecionar o arquivo de mídia em vez do URL, que é o link. Se você clicar nele , ele aumentará o zoom. Muito autoexplicativo. Então, vamos clicar na caneta novamente para editar isso. E a caixa de luz tem, por padrão, anos. Então foi aquela coisa quando eu cliquei nela e é alguma coisa, esta é uma caixa de luz. Tudo bem? Em estilo, temos a opção de tornar essa imagem maior ou menor, ajustar a altura, a largura e assim por diante na borda. Novamente, as mesmas configurações também podem adicionar a legenda, que era o texto. Então você pode mudar a cor, que está na parte inferior aqui. Alinhamento. Certo? Sombra, praticamente a mesma coisa, espaçamento entre o texto e o elemento. Então, essas configurações, você praticamente as encontrará em praticamente tudo. Deixe-me mostrar os diferentes. Então você tem divisores. Deixe-me remover o plano de fundo para isso ou vamos simplesmente remover esta seção e adicionar a nuance para que tenhamos um fundo branco. Então divisor. Isso é basicamente uma linha que você pode adicionar entre os elementos. Isso é principalmente para fins de design. Então você tem muitas opções aqui. Deixe-me ir até eles usando a tecla de seta para baixo. Então, como você pode ver, temos muitas variações que são bem legais. Você pode alinhá-los aqui. Então, se eu alinhar isso ao centro e ajustar a largura, posso torná-lo maior ou menor. Também posso adicionar um texto intermediário. Por exemplo, eu posso digitar algo como venda. E você só precisa mudar qualquer outra coisa aqui. Em estilo, temos as mesmas configurações. Você pode ajustar o peso, que é a espessura, o tamanho disso, a quantidade de linhas, certo? O espaço entre o divisor real e a parte superior e inferior. Também podemos editar o texto. E aqui temos as mesmas configurações. É isso que um divisor faz. É basicamente um elemento de design. Então temos um espaçador. Isso adicionará um espaço entre seus elementos. Então, se eu adicionar um botão aqui, por exemplo na parte superior, aqui temos o espaço que podemos aumentar se você quiser. Como você pode ver, deixe-me adicionar isso no topo, porque será melhor assim. Parece que tenho um problema de interface e ele não me permite movê-lo. Isso acontece de vez em quando, então não se preocupe. Então, nesse caso, vou apenas excluir isso e adicioná-lo novamente, e vou adicioná-lo na parte superior. Então, como você pode ver agora, estou aumentando o espaço para isso. É assim que funciona. Como você pode ver aqui, temos um botão, que possamos ajustá-lo para celular, tablet e desktop, para que possamos sempre fazer alterações em uma interface específica. Também temos pré-visualizações para celular ou tablet a partir daqui, que você possa otimizar seu site em tempo real. Bom. Agora vamos entrar em algum outro elemento que é diferente. Então, deixe-me dar uma olhada aqui. Você tem o mapa. Isso é autoexplicativo e fácil de usar. Certo? Deixe-me removê-lo e adicionar mais uma coluna. Você tem ícones, caixa de ícones, caixa de imagem não pode ser classificada com estrelas, certo? Bem simples. Alinhe-os, altere a classificação por estrelas. Aqui mesmo. estilo avançou nas mesmas configurações. O que mais é um carrossel de imagens diferente é basicamente uma galeria. Então, você adiciona várias imagens aqui, por exemplo, e pode selecionar o tamanho que deseja que as imagens tenham. Mas isso não vai mostrar que a imagem é maior porque eu tenho duas colunas e elas estão divididas. Então, se eu excluir essa coluna, por exemplo, agora tenho a opção de aumentá-la, certo? Muito simples. Quantos slides você quer mostrar. Você pode alterar a navegação, que são pontos e setas. Você pode alterar a cor desses pontos e setas. Você pode alterar os ícones para eles, pode adicionar um link para eles. Você pode mostrar a legenda. E em opções adicionais, você pode simplesmente desativar essa reprodução automática, pois ela as percorrerá continuamente. O avanço do estilo é praticamente o mesmo. Muito simples de entender. Então você tem o ícone básico, galeria é praticamente a mesma coisa com o carrossel de imagens. A caixa de imagem é basicamente uma imagem na parte superior. Então você tem um título e uma descrição. Você pode adicionar um link se alguém clicar nele, certo? estilo de posição. Você pode editar tudo, imagem, o que quiser. Conteúdo do editor, que é o texto, o título e o texto da descrição. Muito, muito simples de entender. Então, vamos escolher o diferente, que é a âncora do menu. Usaremos este para navegar em nosso site. Então, por exemplo, se eu adicionar um botão aqui dizendo contato e eu adicionarei a seção de contato neste site. Se eu colocar essa âncora específica acima do texto do contato, posso simplesmente vincular esse botão a essa âncora e isso levará esse visitante específico a essa seção específica. Quando clicarem em contato, eles irão para lá. Então, isso é basicamente um link para um local específico no site. Então, vou apenas removê-lo e mostrarei como isso funciona mais tarde. E eu acho que quase tudo é parecido aqui. Então, tudo é configurável da mesma maneira. Talvez contadores, mas isso também é simples. Você selecionará o número inicial, o número final. Então você pode fazer algo assim. Eu tenho algo antes ou depois do número. Então, eu posso dizer, tipo aqui, digitar clientes, escrever algo assim. Então você pode simplesmente ajustar o texto, o título novamente, aumentar a alteração da fonte. Muito, muito fácil de usar. Portanto, cabe à sua imaginação usar praticamente tudo o que está aqui. Mas tudo é muito, muito simples. Então, sim, é basicamente assim que isso funciona, como o Elementor funciona. Eles podem arrastar tudo e mudar sua visualização sempre que você quiser. Então, nos vemos no próximo vídeo. 8. Elementor - Modelos: Algo interessante que você tem no Elementor é que você pode escolher entre seus próprios modelos. Portanto, se você passar o mouse sobre essa pasta aqui, verá que eles também já têm páginas e blogs pré-construídos . Assim, você pode importá-los diretamente para sua página. Mas a maioria deles requer a covariante, mas também temos alguma variação livre aqui, como você pode ver. Então, tudo o que você precisa fazer é clicar em Inserir e adicioná-lo à sua página. Mas teremos que criar um elemento ou conta. Portanto, se você receber esse erro, basta atualizar a página. Vá para esta seção novamente. Então, vou entrar nisso novamente e inserirei uma página, por exemplo , agora clicarei em Começar e seremos redirecionados para o elemento ou site. Para você, isso vai parecer um pouco diferente, então vou clicar nele e você verá o seguinte. Vai parecer assim. Você precisará criar uma conta ou simplesmente fazer login com seu endereço do Gmail, o que é muito mais rápido. E eu farei isso também. Agora estamos conectados, clique em Conectar aqui. Agora está me perguntando se eu quero aplicar as configurações desta página para, basicamente, se você já tiver uma página criada, não aplicar as configurações e, como isso pode atrapalhar sua página. Mas se a página estiver vazia, você pode simplesmente aplicar as configurações, mas precisará usar as mesmas configurações para que seu site tenha a mesma aparência, os mesmos espaços de fonte e tudo mais. Então é assim que esse modelo parece. Isso é basicamente algum tipo de portfólio ou galeria. Se você quiser usar isso, basta alterar as imagens, clicar nelas, alterar as imagens e pronto. Você sempre pode editá-lo. Outra coisa que você pode fazer é salvar blocos ou seções desta página específica. Em seus modelos, basta clicar com o botão direito do mouse nesses seis pontos aqui para esta seção, por exemplo, e clicar em Salvar como modelo. E você pode salvar isso para mais tarde e usá-lo em seu site. Então, vou salvar isso, salvar isso como teste. Agora, está salvo aqui. Então, se eu quiser adicionar o modelo agora e clicar neste diretório aqui, nós o temos em meus modelos e eu sempre posso inseri-lo quando quiser. Então é assim que você pode usar modelos. 9. Como construir a página: Agora é hora de criar uma página de demonstração. Assim, você pode ver exatamente todas as etapas que estou passando ao criar uma primeira página real. Então, esta é a página inicial que eu criei e vou clicar em editar com Elementor. E eu vou começar a construir. Então, vou remover esta seção para começar do nada. Portanto, antes de criar uma página, certifique-se de fazer um esboço de sua base real. Então, exatamente como você deseja criar nossa página. Então, por exemplo, no meu caso, eu fiz um. Deixa eu te mostrar aqui. Eu fiz um esboço como esse, logo, menu de links sociais para o cabeçalho. Então temos um banner com algumas informações e um botão aqui, botão de apelo à ação. Outra imagem de texto do título. Aqui teremos alguns números, exatamente o que alcançamos com nossa empresa, por exemplo, Serviços. Descrição pequena, depois imagem de cada serviço e a pequena descrição abaixo, avaliações de clientes e seção de contato. Muito fácil. Siga-nos nas redes sociais. Abaixo deles, os próprios ícones das plataformas sociais e um boletim informativo aqui. E então temos o rodapé na parte inferior. Essa é uma estrutura bastante básica para Atlantic page. Então, vamos entrar nisso. Já tenho todas as imagens aqui e tudo o que preciso. Então, isso será bem rápido. Então, vou clicar no sinal de mais R, criar uma nova estrutura, uma nova seção. Vou clicar nas configurações aqui e adicionarei a imagem para precisar de um plano de fundo clássico. E a imagem em si, vou usar essa. E agora vou clicar em Editar novamente. Aqui, para as configurações, não mudarei a posição, mas em tamanho selecionarei a capa. E indo para o layout. E selecionaremos a altura para caber na tela. Embora isso seja meio grande, então eu quero torná-lo menor. Então, vou selecionar a altura mínima e vou torná-la algo assim, um pouco menor. Agora eu quero deixar isso mais escuro para que eu possa adicionar alguns textos, alguns textos brancos para que eu possa ver melhor os textos. Então, eu preciso de uma sobreposição de fundo. Vou clicar em Clássico e deixarei isso em preto e talvez reduza um pouco a opacidade. Então, algo assim. Agora vou adicionar um texto dentro, então eu preciso de um título. Vou inserir o texto aqui. Então, vou entrar em serviços profissionais de conserto de bicicletas. Vou centralizá-lo. Vou selecionar H1. Então lembre-se, apenas um H1 por página. E esse H1 deve conter as palavras-chave mais importantes do seu site. Então eu adicionei aqui praticamente as palavras-chave mais importantes. Tenho serviços de conserto de bicicletas. Tenho todas as palavras-chave necessárias de que preciso. Agora, vou entrar em Style. Vou mudar isso para tipografia branca. Eu também mudarei a fonte. E vou selecionar a fonte que eu gosto, que é Railway. E eu vou fazer isso com 44 pixels. E você também pode mudar o peso, se quiser. Mas vou deixar assim. E agora eu preciso de alguns textos embaixo. Então, vou adicionar um editor de texto. E vou escrever exatamente o que tenho aqui. Então, vou colocar isso lado a lado na minha tela e vou apenas inserir o texto. Então, estamos aqui para ajudá-lo a escrever mais, certo? Mais feliz e tire o máximo proveito da sua bicicleta. Bem simples. Volte para o site em tela cheia. Eu vou mudar a cor para isso. Então eu vou para o estilo, alinho isso ao centro, mudo o texto para branco. E isso mudará a fonte para outra fonte que eu gosto, que é Meriwether. Portanto, você deve fazer duas combinações de fontes para o seu site. Podemos usar ainda mais se você quiser, mas não use como dez fontes, fontes gratuitas no máximo são muito boas. Então, eu estou usando dois neste caso. E então vamos definir isso para 17 pixels. Por baixo. Isso adicionará um botão de apelo à ação. Vou alterar o texto desse botão para entrar em contato conosco. Vou centralizá-lo aqui no link. Posso fazer com que esse botão realmente leve a uma ligação telefônica ou leve à abertura do aplicativo de e-mail no telefone. Então você pode fazer isso se quiser fazer disso um botão de chamada, você digita aqui T L do telefone, dois pontos, e então você usa o número de telefone deles. Para isso simples, se você quiser, exclua o aplicativo de e-mail, escreva um e-mail dois pontos e insira o e-mail depois. Muito simples. Mas eu vou fazer esse telefonema de chamada à ação. Então eu corri, inseri um tamanho numérico aleatório desse botão. Vou selecionar o meio. Vou adicionar um ícone aqui. Nós encontramos. Vou selecionar este, inserir algum espaçamento entre eles. E para estilizar, eu só quero mudar a cor desse botão para praticamente a cor que eu tenho no meu logotipo. Então, é uma espécie de combinação entre um azul e um verde, algo assim. E eu posso simplesmente copiar essa cor para que eu possa usá-la para mais tarde para as outras coisas que eu farei. Então, aqui temos algum espaço entre esses, esses elementos. Então, como podemos removê-lo? Coluna adicionada, fizemos espaço, transformamos isso em zero, por exemplo, e foi assim que você fez. Então. Muito simples. Agora, vou passar para a próxima parte. Portanto, precisarei de uma imagem de texto sobre nós do título, e também temos um divisor abaixo do título. Então, uma nova seção. Muito simples. E aqui vou adicionar um título. Vou escrever sobre nós. Isso será um H2, então não vou mais usar o H1 nesta página. Topografia, ferrovia, novamente, para títulos. Torne isso maior para 44 pixels. E isso mudará a cor para preto. E vou adicionar uma divisória embaixo para o design. Então, vou centralizá-lo. Vou mudar isso para barras porque gosto da aparência e vou torná-la menor. E agora eu preciso de mais duas colunas embaixo. Então, como fazemos isso? Adicionamos uma interseção sob esse divisor e agora temos mais duas colunas. Então, em vez de criar uma nova seção, basta adicionar uma interseção sob um elemento específico e você terá mais duas colunas. E se você clicar com o botão direito do mouse, poderá adicionar ainda mais um, se quiser. Mas vou ficar com dois. Por enquanto. Vou adicionar uma imagem à direita e alguns textos à esquerda. Muito simples. Vamos adicionar a imagem. Então clique em Carregar arquivos, selecione os recursos do site porque esta é uma pasta onde eu adicionei tudo e vou adicionar este. E vou escrever no altar todos os textos, oficina de conserto de bicicletas. Porque essa imagem é representativa. E para o texto, vou simplesmente copiá-lo desta imagem. Coloque-os lado a lado novamente. E vou apenas inserir o texto. Acabei de escrever algo aleatório, mas você deveria escrever algo que tenha mais palavras-chave relevantes aqui. Portanto, será melhor para o seu SEO, para a otimização do seu site e para o mecanismo de pesquisa. Mas nesse caso, vou ficar com esse x. Então, vamos ver o que mais eu tenho para digitar uma ótima experiência do cliente. E sempre teremos como objetivo dissolver. Tudo bem, desculpe, só para a tela. E vou aumentar esse texto e mudar a fonte ou a cor está boa, ou talvez torná-lo um pouco mais escuro. O alinhamento está bem. E vamos mudar essa atualização do Meriwether 17. E vamos remover os espaços entre os elementos porque eles são muito grandes. Então, novamente, zero pixels aqui. E talvez eu o tenha mexido por engano. Então, eu apenas pressiono Control Z no meu teclado para desfazer isso. Ou você pode simplesmente entrar aqui em História na parte inferior. E você pode simplesmente clicar na última seção e ela irá para a seção anterior que você fez antes. Muito simples. Agora vamos adicionar espaçador aqui. Isso é muito próximo um do outro. Então, algo assim, talvez, e atualize isso. E agora vamos ver o que mais temos a acrescentar. Vou adicionar mais uma seção. Vou adicionar um plano de fundo a este. Então, vou selecionar outra foto, talvez algo assim. Layout. Altura, altura mínima e ainda menor do que esta capa de tamanho de estilo. Então, a imagem se repetirá aqui nas laterais, no lado direito do pulso. Por isso, está esticado. E eu quero três colunas. Então, vou clicar com o botão direito nesta coluna aqui no espaço, Adicionar novo e adicionar novo. Nós temos de graça. E vou adicionar contadores. Então, não no, esses são os elementos Pro da versão paga, mas eu não preciso deles. Vou minimizá-los e vou até o balcão. E adicionaremos os três contadores. Portanto, temos mais de 4.430, 500 clientes. E nós temos um sufixo, então eu adiciono um sinal de mais aqui. Clientes satisfeitos. Depois, posso personalizá-lo para que eu possa deixar o texto branco. E a fonte, eu posso praticamente alterá-la para a mesma coisa. Digamos que a ferrovia parece muito melhor agora. E para o título, a mesma coisa. Cor do texto: branco. E também posso adicionar uma sobreposição de fundo a isso para torná-lo mais escuro. Então, os textos aparecem mais ou menos assim. E vamos adicionar esse também. Essas são duas colunas. Então, vou apenas duplicar esse porque já fizemos as mudanças. Portanto, é mais fácil editar assim. E vamos mudar os textos e os números. Então, mais de dez anos de experiência. Aqui. Cinco locais. Exclua o sufixo e os locais. Muito simples. Vou apenas clicar em atualizar aqui para salvar minhas alterações por enquanto. E vamos adicionar o outro para que tenhamos serviços e outra coluna. Eu preciso do título para que eu possa simplesmente duplicá-lo daqui e movê-lo para baixo. O divisor também. Isso é muito mais eficiente do que trabalhar nisso novamente. E agora eu preciso de uma interseção. Então eu preciso de outro. Adicione uma nova coluna, temos grátis. Então, eu preciso de três imagens. Então, vou adicionar o primeiro. Eu farei as alterações nele e depois duplicarei a primeira nas outras duas colunas. Então, vamos ver o que eu tenho aqui. Também preciso de um texto descritivo abaixo. Então, vamos mudar o primeiro editor de texto abaixo do divisor. Ou, na verdade, é melhor adicioná-lo aqui. Então, vamos ver. Vamos colocar essa gama completa de serviços lado a lado em junho, consertar e aprimorar o estilo de desempenho de suas bicicletas, no centro. Eu posso voltar para a tela cheia agora. E vamos mudar a fonte novamente. Então, temos Meriwether e 17, e talvez transforme isso em um cinza mais escuro ou até preto. E vou apenas adicioná-lo abaixo. Eu acho que é melhor. Sim, vamos fazer isso assim. E vamos selecionar as fotos. Então, o primeiro são rodas e pneus. Eu já o tenho. Essa. E em textos alternativos, tudo bem, rodas e pneus. E aqui temos um campo de legenda. Selecionarei uma legenda personalizada e digitarei exatamente rodas e pneus embaixo. Link para nenhum. Ou, na verdade, posso fazer um arquivo de mídia, se quiser. Então, se você clicar nele, ele aparecerá. Vamos fazer algumas mudanças aqui. Então, vou clicar em Editar estilo. E eu quero mudar apenas os textos das legendas. Então, centralize-o. A cor pode ficar bem, tipografia. Vamos fazer isso 17 ou mais. Vamos tentar 44. Muito grande, talvez algo assim. E talvez em maiúsculas. Vamos ver como fica em maiúsculas. Então, sim, é melhor assim. Então, deixe-me voltar a estilizar, legendar e fazer isso assim e talvez ousado, pode ser demais. Sim, algo assim. Parece estar bem. Talvez até adicione algum espaçamento como esse. E talvez vamos mudar a cor. Vamos ver o que podemos fazer. Vou ficar assim e atualizar. E terei que adicionar algum texto abaixo. Agora. Adicionaremos o texto daqui lado a lado novamente. E treinamos para agir para abençoar os serviços de pneus e muito mais. Tela cheia novamente. E vamos editar esse texto. Vamos torná-lo mais escuro. E mude isso para. Meriwether, centralize-o. E vamos reduzir o espaço intermediário. Teremos que ir aqui e transformá-lo em zero. Sim, isso é melhor. E agora teremos que mover isso para o outro lado. Talvez possamos adicionar alguns efeitos a isso antes de fazer isso. Então, eu posso simplesmente adicionar uma sombra de caixa. E vamos ver o quanto queremos acrescentar algo assim. Acho que não há problema em adicionar um pouco mais de profundidade a isso. Então agora eu posso simplesmente duplicar isso e adicioná-lo aqui. Então duplique-os e o texto também. E do outro lado. Agora vamos mudar o texto para os outros. Temos sintonia e montagem de bicicletas. Tudo bem, e vamos mudar as descrições. Então, como você pode ver, isso é bem simples. Na verdade, é rápido, então podemos fazer isso em 2 minutos ou até mais rápido se você continuar trabalhando, porque estou falando agora, então estou trabalhando um pouco mais devagar, pausas e trocas rodas e muito mais. E isso praticamente já mudou. Temos as configurações aplicadas da anterior. Então mude essa também, e depois mudaremos as imagens. Assim feito. Então, vamos mudar as fotos. Às vezes sinto falta de clicar e pressiono Control Z logo abaixo dessa coisa. É por isso que você verá algumas coisas se movendo de tempos em tempos. Vamos selecionar esse. Acho que temos a mastigação, que é desse tipo que estamos mastigando. E a outra, que é a montagem de bicicletas. E eu vou escrever aqui, por assembléia, você não precisa mudar todos eles. Todos os textos são os mais importantes para o SEO. E insira. Tudo bem, vamos ver o que mais temos. Temos uma seção de revisão. Então, isso é muito fácil de fazer. Novamente. Outra seção. Basta duplicar o título. Mova-o. Editando aqui. Spacer novamente. Tudo bem, e precisaremos dos depoimentos reais. Então, eu preciso adicionar uma interseção abaixo. Eu preciso de três deles, então eu adiciono mais um. Eu volto, procuro depoimentos, arrasto este e vou adicioná-lo, o primeiro. E adicione uma foto aqui. Nome aleatório, ocupação ou posição aleatória. E eu vou configurá-lo assim. E então vamos apenas duplicar esse e movê-lo. Você sempre pode personalizá-lo e torná-lo diferente se quiser mudar as cores e assim por diante. Mas, por causa desse vídeo, vou fazer isso rápido. E talvez vamos mudar a cor de fundo disso. Então, vamos configurá-lo para um cinza mais claro para fazer algum tipo de distinção distinta. Tudo bem, e talvez eu possa adicionar uma borda. Então, vamos adicionar talvez algo, um forro macio ou algo parecido com isso. Cinco, grátis. Sim, isso deve ficar bem. O que mais? Temos a seção Fale conosco. Então, vamos adicionar esse também. Novamente, outra seção. Vou duplicar o título. Duplique uma divisória. Portanto, esse é um design muito básico, mas funciona. E vamos mudar isso para aqui, nossos clientes para entrar em contato. E eu adicionarei uma interseção. Novamente. Só precisamos de dois, então vou adicionar o mapa à direita. Teremos que inserir o endereço aqui. Vou deixar assim. Altere o zoom para 17 para que fique bem mais próximo e você possa realmente ver a localização. E vamos adicionar essas informações abaixo. E aqui vou adicionar o formulário de contato. Então, vou pesquisar um código curto. E eu adicionarei um formulário de contato. Então, terei que voltar ao painel. Fóruns de formuladores. E eu vou clicar nesta roda e copiar o código curto. Agora vou reembolsar a base aqui. Aqui está o formulário, mas ele aparecerá corretamente sem esse ótimo plano de fundo depois. Então guarde assim. E aqui embaixo. E vamos apenas adicionar uma lista de ícones. Vou procurar um ícone. Essa. E eu serei, escreverei para o endereço. Posso simplesmente copiá-lo daqui, por exemplo, e selecionarei uma inserção de mapeamento de pinos. Para o próximo. Eu vou selecionar. Vou apenas escrever o horário de trabalho nove às cinco, de segunda a sexta-feira. E isso selecionará um relógio. Para o próximo. Vou escrever um e-mail e apenas inserir o horário ou talvez o número do telefone porque temos o formulário à esquerda. Vamos inserir o número do telefone. Isso é melhor. Tudo bem, e eu vou procurar um telefone. Muito simples. E eu posso simplesmente fazer disso um apelo à ação, se eu quiser. Eu posso simplesmente escrever d l e copiar o número. Assim. Mas deixe de fora o espaço porque eu adicionei um espaço intermediário como esse e a atualização. E agora eu posso simplesmente personalizar isso, mudar a cor dos botões, os tamanhos, se eu quiser. Então você tem espaço entre uma divisória entre eles. Depois, você pode simplesmente alterar o tipo de divisor. Então, você pode personalizá-lo se quiser. Bem simples. Vamos mudar isso rapidamente. Certo? Ícones. Talvez até um vermelho possa funcionar. E eu posso simplesmente deixar isso assim. Talvez mude a fonte. Tudo bem, então temos a seção Siga-nos, que é a última. Então, vou fazer com que agora selecione o plano de fundo para ele. Estilo, plano de fundo, tipo clássico e eu selecionarei o plano de fundo. Então, vamos ver qual deles devo escolher? Acho que ainda tenho um. Essa. E insira layout, altura, altura mínima. Eles deveriam trabalhar. E terei que escolher Estilo, tamanho, capa e também torná-la um pouco mais escura. Então, adicionaremos uma sobreposição de fundo novamente. Clássico e preto. Mas mais brilhante, assim. Então, precisamos de um título agora. Vou apenas duplicar esse e mudar para branco. Então, certo, siga-nos. E eu preciso de mais duas seções. Vamos adicionar um divisor também. Portanto, mantemos praticamente o mesmo design. OK. E aqui vou adicionar os ícones sociais reais. E à direita, posso simplesmente adicionar a inscrição no boletim informativo. Então, aqui vou pesquisar por redes sociais. E eu posso mudar a forma para circular porque eles parecem melhores. E você pode simplesmente clicar neles e alterar os links. Mas eu quero fazer isso neste vídeo. E aqui à direita, posso simplesmente adicionar uma inscrição no boletim informativo. Então, vamos duplicar esse título adicionado aqui. Faça com que seja um pouco menor. Porque isso é muito grande. Assim. Eu posso escrever a inscrição em nosso boletim informativo. Ainda menor do que isso. Na verdade. Escreva a atualização. E voltaremos ao painel e eu farei outro formulário. Então, crie uma inscrição no boletim informativo, continue. Você pode nomear este boletim informativo. Criar. Aqui está. Só precisamos fazer algumas mudanças para nós porque ele tem um fundo branco e eu quero isso transparente. Então, vou usar cores, contêiner de formulário personalizado e terei que mudar todas as cores de fundo para transparentes. Então, apenas mova isso e certifique-se de que ele seja arrastado até o fim. E isso terá que fazer isso praticamente todas as cores de fundo. Então, eu vou ter que passar por cada um deles. Indicador de envio, cor de fundo. Eu acho que isso é tão básico em k campos. Eles realmente precisam de um plano de fundo. Vou deixá-los como esta área de entrada e texto. Preciso mudar o texto para branco por E5. Se eu deixar preto, também não direi que beirará branco. Então, selecione branco aqui embaixo. E vamos ver o que mais. Etiqueta, descrição branca, mensagem de erro branca. Podemos deixar isso assim. Isso está bem. E vamos ver o que mais é esse botão de envio. Cor do texto em branco novamente. Cor do texto: branco. E eu posso simplesmente visualizá-lo. Então está tudo bem porque não vemos os textos aqui, mas precisamos mudar isso para branco. Então, vamos mudá-los. Então nós temos, deixe-me ver onde eles estão. Eles devem estar no campo básico ou de entrada. Sim, espaços reservados para branco, ambos. E a cor de fundo talvez seja transparente para os campos. Vamos ver agora, acho que sim, estamos bem na página. Então, vamos clicar em Publicar. E eu vou copiar este. Voltamos e adicionamos um código curto e colamos. É assim que fica na pré-visualização, mas ficará melhor se apenas atualizarmos a página. Então, vamos salvar isso e abrir a página. E depois faremos alguns ajustes de injustiça. Então, precisamos de alguns espaços intermediários. E esse é o formulário. Parece muito melhor. Talvez possamos adicionar algum tipo de borda ao redor dela para torná-la mais visível. E alguns textos aqui, como está vazio , temos o rodapé que precisamos editar e otimizaremos esta página para celular. Então foi basicamente isso. Vamos fazer pelo menos as alterações nessa parte, e depois a otimizaremos no próximo vídeo. Então, vamos fazer as mudanças primeiro. Vamos escrever algo aqui. Vamos ver talvez um título. Digamos, como posso escrever isso? Eu posso escrever aqui, nos seguir. E centro e BH3 e branco. E mude a fonte para ferrovia. Algo parecido com isso. E talvez adicionemos uma divisória embaixo. Mude a cor para branco. Talvez um pouco mais de espessura até o centro. E faça com que seja algo assim. Vamos adicionar mais alguns textos aqui. Mude para o centro branco. E digamos algo assim. Então, quando você recebe descontos e se inscreve em sorteios automaticamente seguindo nossas redes sociais. Segundo ou algo parecido, e talvez torne isso maior. E Meriwether, novamente, temos a mesma fonte. Então, agora sentimos praticamente o espaço intermediário. E talvez adicionemos outra divisória aqui. Talvez duplique este e adicione aqui. E é isso. Mas agora temos mais espaço na parte inferior. Agora vou apenas removê-lo. Então, vamos deixar assim. Sim, veja no próximo vídeo. E praticamente otimizaremos para dispositivos móveis e faremos mais algumas coisas. 10. Versão móvel: Agora vamos otimizar o site para dispositivos móveis. Então, vou clicar em editar com o Elementor aqui. Em seguida, mudaremos a visualização para celular. E veremos como isso fica no modo responsivo móvel, aqui no canto inferior esquerdo, e clicaremos no ícone do celular. Então, primeiro precisamos remover esse texto. A forma como removemos esse texto foi acessando o painel do WordPress, aparência e personalização. E aqui nas configurações do tema, precisamos alterar isso no criador de cabeçalhos, no site, no título e no logotipo. E mudaremos para a visualização móvel clicando aqui. Teremos que remover o título desse site de exibição. E agora, como você pode ver, isso não está mais visível e você clicará em Publicar. Então, isso é corrigido. Voltaremos ao site e eu o atualizarei. E então vamos examiná-lo para ver exatamente como fica. Tão responsivo e móvel. O texto está bom, o botão está bem. espaçamento é bom. Aqui, como você pode ver, também vemos as âncoras, mas elas não aparecerão no site real ao vivo. Então é assim que vai ficar. Precisamos mudar os divisores. Então, como você pode ver, as divisórias são muito pequenas no celular em comparação com a aparência no desktop. Então, agora, teremos que mudá-los. E também deixe-me mudar para o desktop. Como você pode ver, o conteúdo no celular está sendo exibido da esquerda para a direita. Então, primeiro vimos o texto, depois vimos a imagem. Então, isso funciona praticamente para cada elemento aqui. Então, vamos mudar para o celular e aumentar os divisores. Algo parecido com isso. Para este, o texto é bom, os espaços são bons. Este também é bom, mas eu quero adicionar um pouco mais de espaço na parte superior e inferior também. Então, vou clicar nesta seção de edição avançada e adicionar algumas margens. As 20 principais margens, preenchimento, na verdade 20. Sim, isso é melhor. Mude esse divisor também. Algo parecido com isso. Eu não vou fazer isso porque leva apenas um pouco menores, imagens são boas. Vou ter que mudar o tamanho dessas imagens. Então, faremos isso em breve. Esse também. Todo o resto é bom o suficiente. O texto é bom, tudo parece bom, o mapa está bom. Tudo bem, agora deixe-me explicar por que adicionei esse preenchimento no começo para esquerda e direita. E vou mostrar um exemplo que acontece se eu o remover. Então, digamos que, nesta seção, eu vá para Avançado e temos 20 preenchimentos. Vamos definir isso como zero. Agora, como você pode ver, o texto está bem próximo da borda da tela. E isso não é recomendado porque não ficará muito bem no seu celular. Portanto, é melhor adicionar algum espaço aqui. Então você faz isso adicionando um pouco de preenchimento à esquerda e à direita. Mas eu também adicionei na parte superior e inferior para responder, para adicionar algum espaço entre a próxima seção. Assim, você pode adicionar somente à esquerda e à direita, se quiser. Então, posso simplesmente desvincular esses valores e adicionar 15 à esquerda, 15 ou 20. Ambos estão bem. E agora você terá esse espaço intermediário, que parece muito melhor, certo? Então, eu posso simplesmente salvar isso. Portanto, ele sempre deve adicionar espaçamento à esquerda e à direita para cada seção que você tem. Então, fica melhor no celular. E todo o resto está bem. Então, vamos mudar a visualização para o canto superior direito. E as imagens também parecem boas. A janela no começo parecia errada e essa era maior. Agora, aparentemente quando olhamos para isso em tela cheia, vamos abrir a página novamente e ter certeza de que está tudo bem. Tudo bem. Sim, parece bom. Então, outra coisa que você pode fazer, você pode até adicionar alguns efeitos à imagem. Então, posso adicionar uma sombra de caixa para isso, por exemplo, se eu quiser definir a cor para praticamente a mesma cor que temos em nosso logotipo. Torne isso mais visível e selecione uma cor como essa. E agora eu posso simplesmente reduzir o desfoque e fazer algo assim, certo? E faça algum tipo de sombra ou imagem duplicada. Portanto, esse é um efeito interessante que você pode adicionar duas fotos, se quiser. Muito fácil de usar. E sim, é basicamente isso. O site é otimizado para dispositivos móveis. Assim, você sempre pode alterar a visualização móvel e verá exatamente como ela fica. Talvez eu possa editar esse texto e alterá-lo para justificá-lo. Mas eu não gosto desse espaço honestamente, então vou deixá-lo assim ou até mesmo centralizá-lo, mas fica melhor assim. Ou talvez eu apenas o centralize. Na verdade. Eu acho que é melhor. Então, enviaremos essa e talvez mudaremos essa fonte para a mesma fonte. Na verdade, mudou , mas é muito pequeno. Então, parece um pouco diferente. Sim, então foi isso para a otimização móvel. E no próximo vídeo, trabalharemos no rodapé. Portanto, adicionaremos alguns botões aqui e também na página de política de privacidade em termos de uso. O menu é totalmente funcional. Também funciona em dispositivos móveis e está tudo bem. Então, vendo que é um. 11. Como usar âncoras de menu e adicionar animações: Agora é hora de personalizar um pouco a página e adicionar alguns efeitos ao site. Então, basta clicar na seção Editar e ir para Avançado. E aqui temos efeitos de movimento. Então, eu posso simplesmente adicionar algumas animações. Então, eu vou pegar cada seção, ou você pode pegar cada elemento, se quiser. Mas vou apenas adicionar uma animação à seção inteira. Então, algo assim. Só não use a mesma animação, apenas use animações diferentes, mas não use animações que possam causar dor de cabeça. Use algo simples e limpo. Vamos ver, aumentando o zoom. Isso é bom. Isso é aplicar um a isso, certo? Outro aqui. E para este. E deslizando para a direita, para isso, para a direita. Ok, agora vamos fazer alguns pequenos ajustes. Então, vamos adicionar algum espaço entre a seção real na parte superior e os textos, porque isso é muito próximo um do outro. Então, podemos fazer isso usando roupas de cama. Então essa é a melhor maneira. Então clique na seção de edição e em outras avançadas aqui. Vamos para a rebatida real e você adicionará cerca de 30 pixels, 20. Isso é melhor. Também temos acolchoamento à esquerda e à direita. Isso é bom para otimizações móveis e otimização móvel, desculpe-me. E você verá depois por que vamos fazer isso com praticamente cada um deles. Então, 20, 20 aqui. Se você acha que é demais, você sempre pode alterar os valores, desvinculá-los e alterá-los individualmente, se quiser. Nós podemos fazer isso. E para este, eu não precisarei porque ele permanece centrado. Mas acho que sim porque precisamos criar esse espaço entre esse texto para celular. Você verá depois o porquê. Então, vamos adicionar 20 aqui também e atualizar isso. Agora, vamos criar os menus. Estamos usando âncoras de menu. Quando você cria um site de uma página como este, ao adicionar todas as informações em uma página, você precisa usar âncoras de menu para criar seu menu de navegação, porque você terá que liderar seus clientes na mesma página, mas em locais diferentes. Então, como fazemos isso? Usaremos as âncoras do menu aqui, na barra de pesquisa. Vou pesquisar o menu. E vou pegar essa âncora e colocá-la acima do texto ou acima do título principal. Então, vou criar uma seção Sobre nós que acabou no botão aqui também. Então, nomeie isso sobre outro para serviços. Então, vou voltar e procurar a âncora do menu e adicionar outra. Serviços. Eles são invisíveis , então eles não adicionam espaços, só você pode vê-los. É por isso que parece assim. Aqui temos alguns problemas com as fotos. Eles são menores que o primeiro, então teremos que mudar isso também. Então, basicamente, teremos que alterar a resolução para que todas essas imagens sejam iguais, para ter exatamente a mesma proporção. É por isso que isso é maior e esses dois são menores. Portanto, não podemos ajustá-los manualmente ou você pode cortá-los e praticamente ajustá-los na mesma proporção. Eu farei isso em um minuto e mostrarei para. Então, adicionaremos outro para o menu de contato. E entre em contato certo aqui. E eu quero adicionar um para esta parte. Não é necessário. Então, esses são os mais importantes. Tudo bem, agora vamos para painel do WordPress e eu vou para Aparência e menus. E eu selecionarei o menu principal. E vamos adicionar todos os botões. Então, temos o botão Contato. Este é o link do nosso site, e você terá que adicionar uma hashtag e exatamente o que escrevemos em nossa âncora de menu. Então eu escrevi contato. Isso é para o URL do contato. Vou ter que adicionar mais um. Então eu apenas copio, copio esse link basicamente aqui e mudo essa parte com superfícies agora, certo? Serviços. Vou adicioná-lo e colar novamente. E tínhamos quase, tudo bem, e talvez mudar a ordem assim e salvá-la. Lembre-se de que o menu fora do campus é para celular, então você também deve verificá-lo se estiver usando, se estiver usando esse menu para o primário, por exemplo agora voltaremos à página e a atualizaremos. Vamos atualizá-lo. Eu fiz. Ok. Vou atualizá-lo. Por algum motivo. Demora um pouco. Então, eu posso ter alguns problemas de conexão. E se eu clicar em Serviços agora, vá exatamente nesta parte da página. Se eu clicar em Contato, ele entrará aqui e por aqui. É assim que as âncoras do menu funcionam e são bonitas, muito fáceis de editar. Agora, outra coisa. No próximo vídeo, mostrarei como otimizar isso para dispositivos móveis, e faremos isso, passo a passo. Também será bem rápido. Então, nos vemos na próxima. 12. Como editar o rodapé: Agora é hora de trabalhar no rodapé. Então, vamos apenas para a aparência personalizada. E aqui temos o pilar do rodapé. Então, queremos adicionar o menu de política de privacidade na parte inferior. Isso é o que geralmente todo mundo está fazendo. E aqui também adicionarei alguns ícones sociais. Talvez eu não escolha as redes sociais e as adicione à direita. E à esquerda teremos um menu, o menu de rodapé. E teremos que trabalhar nisso. Então, entraremos no painel. Então, deixe-me abrir o painel novamente aqui. E iremos aos menus de aparência. E selecionaremos o menu de rodapé. E aqui precisaremos da página de política de privacidade, que já temos em páginas. Isso é criado por padrão, pelo WordPress, então eu posso simplesmente abri-lo. Ainda não foi publicado, mas posso simplesmente publicá-lo. Então, eu posso simplesmente copiar o link daqui. Tudo bem. nome a esta política de privacidade. E precisaremos de outro chamado Termos de Uso. Teremos que criar esse. Então, vá para Páginas novamente e adicionaremos uma nova página, nomeie-a, termos de uso. E precisaremos de alguns textos para isso. Eu posso simplesmente copiar e colar o texto aqui. Você não precisa usar o Elementor se quiser, se quiser projetá-lo e torná-lo mais agradável, basta usá-lo. Mas essas duas páginas não importam muito. Então eles vão, eles mal serão visitados. Então, posso ir até a competição, encontrar um serviço de conserto de bicicletas e procurar nosso site em algum lugar. Digamos que eu esteja escolhendo. Eu não conheço esse. Aceitarei seus biscoitos e irei até o fundo. Este é o rodapé deles. É muito maior. Quero dizer, na verdade, eles têm dois deles. Então, aqui temos termos e condições, aviso de privacidade e política de cookies. Eles têm muitos. Eu apenas manteria os termos e condições. Então, você basicamente precisa dos termos e condições e da política de privacidade. E na política de privacidade, você pode incluir os cookies para não precisar fazer tantos. Então eu vou pegar este e vou apenas copiar uma parte dele, não tudo, porque eu acho que é muita coisa, ou talvez apenas pegue tudo. Mas lembre-se de que você terá que trabalhar nisso para que possamos simplesmente copiar os termos e condições de outra pessoa e colá-los em sua página. Você terá que realmente ver o que eles escreveram lá e fazer isso de acordo. Mas por causa deste vídeo, vou apenas copiar e colar isso. Agora clique em Publicar. Então, agora temos uma página de termos de uso. E vamos adicionar este aqui. E esses dois devem ser mais do que suficientes. E talvez eu possa adicionar o botão de serviços novamente. Então, links personalizados, digamos serviços. Então, se eles quiserem ver os serviços, novamente, nossos contatos talvez sim, melhor. Vamos adicionar um contato para que eles possam voltar para lá, se quiserem , também no rodapé. Então, vou inserir a hashtag de barra do website.com, entre em contato. Tudo bem, Salvar menu. E agora voltaremos ao personalizador de temas. Tudo bem. Mas não aqui. Ah, sim, isso é melhor. E digamos que esse fosse um para o cabeçalho. Eu não preciso disso. Isso era para o rodapé e eu posso simplesmente salvá-lo e nós apenas atualizaremos a página. E deve ser atualizado. Vamos ver. Sim, nós temos isso. Também podemos mudar as cores, se você quiser. Se você não gosta das cores e de tudo mais, pode mudar as cores sempre. A qualquer hora, quero dizer, então basta abri-los, vamos ver se eles funcionam. Eles deveriam trabalhar. Muito simples. Você deve sempre adicionar a política de privacidade e os Termos de Uso. Este link da política de privacidade. Precisamos adicioná-lo ao plug-in, novamente, ao plug-in de cookie. Então, os cookies, este, personalizam o banner e mostram configurações avançadas. Deveria estar em algum lugar aqui, digamos que o layout. Agora conteúdo e cores. Sim, biscoito. Observe que o temos aqui, leia mais, vincule, habilite-o, leia mais. E aqui você adicionará a URL da sua página de política de privacidade, esta, e a salvará. Então, agora, quando abrimos o site, se eu clicar nas configurações de cookies aqui, no canto inferior esquerdo, deveríamos ter o botão Leia mais, mas acho que ele aparece apenas quando eles abrem o site para o primeira vez. É por isso que não vemos isso agora. Nela então aparece, mas está tudo bem. Isso funcionaria de qualquer maneira. Então, foi isso para a página de política de privacidade e os Termos de Uso, certifique-se de fazê-los corretamente para não simplesmente copiá-los. Então, vemos o próximo. 13. Temas personalizados: Agora, deixe-me mostrar que o WordPress realmente tem alguns famosos se você quiser pagar por eles. Então você irá para a floresta temática, dotnet. E aqui temos uma categoria para WordPress. Você apenas clicará nele. E temos muitos nichos aqui. Assim, você pode comprar praticamente sites pré-construídos para diferentes nichos. Então, aqui estão os sites, como você pode ver anteriormente. Digamos que eu esteja procurando um site de fitness. E eu vou escolher um deles como este. E todos eles têm prévias ao vivo. Então você pode simplesmente verificar o tema em tempo real. Clique nele, vá em frente. Sou exatamente o que você está comprando. E todos esses temas podem ser editados com o elemento em praticamente 90% deles. Portanto, ele pode praticamente editar cada um deles e alterar os elementos, imagens, textos e assim por diante. Então você praticamente tem um site pré-construído. Deixe-me escolher um deles. Como você pode ver, eles têm dois construtores, Elementor, que é o mais popular, e depois a padaria WordPress, que também é popular. E todas essas equipes são compatíveis com o Elementor. Então deixe-me escolher este, por exemplo, e sim, isso parece ótimo. Os efeitos também são ótimos. Heather é ótima. Então, é muito melhor do que ter um tema simples. Então, uma vez que você saiba como o Elementor funciona, se você quiser obter a grande fama, basta acessar o tema forest dotnet. Esta é a plataforma mais popular onde você pode encontrar temas WordPress realmente bonitos. Então, basta pesquisar o que você precisa. E você encontrará temas imobiliários, restaurantes, o que precisar. Então, só para você saber que eles existem e estão sendo vendidos por um ótimo preço. Então, você encontrará praticamente todos eles abaixo de $100. Então, basicamente, depois de fazer uma compra aqui, você receberá um arquivo, um arquivo zip. Você precisará acessar o painel do WordPress. Então, aqui, você clicará em Adicionar novo e fará o upload do tema. E você escolherá o arquivo, o arquivo e precisará instalar esse nome específico. E esse famoso geralmente vem com plugins embutidos. Portanto, você terá que instalar todos os plug-ins junto com eles porque são obrigatórios, porque já estão pré-configurados. E tudo o que é construído dentro deles tem que funcionar com esses plugins. E a partir daí, você pode simplesmente editar o texto. Você terá todas as páginas aqui na seção Páginas. Você terá a página de contato sobre os serviços. Ele já está pré-configurado e você tem todos os emblemas incluídos. Esse tema específico. Então, eu estou apenas mostrando isso para você saber que eles existem. Então, se você provavelmente estava no futuro, quero mudar seu site com uma grande fama. Você pode fazer isso, mas precisa de alguma experiência antes de escolher esse famoso porque ainda não tem experiência. Então, depois de se acostumar com a plataforma, talvez você o faça no futuro e isso também será útil. Então, sim, é basicamente isso. Nos vemos no próximo vídeo. 14. Como criar a página 404: Agora é hora de criar uma página de fluoróforo. Como eu disse no início, esta página é basicamente uma forma redirecionar nossos visitantes de volta para nossa casa, nossa página inicial, quando eles acessam o link errado, por exemplo, se eles acessarem nosso site e digite por engano, corte algo errado aqui. Eles serão levados para esta página. Esse é o padrão, mas mudará esse por um melhor. Então, vou adicionar uma capa, pouco de texto e um botão para levá-los à página inicial. Mesmo que eles tenham os botões aqui, é mais acessível colocá-los no meio. Então, iremos para Pages Add New. Vou nomear essa página 1404. Selecionaremos a partir do modelo aqui, Elementor, largura total e publicaremos. Agora vou clicar em editar com Elementor. E vou clicar nisso e faremos uma nova seção. Vou adicionar uma imagem como plano de fundo. Então, vamos para o tipo de fundo de estilo, imagem clássica. E eu adicionarei essa imagem. Vamos ao layout, altura, altura mínima e talvez algo assim. Vou adicionar uma sobreposição de fundo para que eles possam ver melhor o texto e escurecê-lo mais. Agora eu vou voltar. Adicionaremos um título. E eu vou dizer, opa, você está no lugar errado. Centralize isso. Mude a cor para branco. Torne isso maior. Mude a fonte, talvez para Railway. Então, temos a mesma fonte. E podemos adicionar talvez uma descrição abaixo. Diga algo assim. Essa página não existe. Para retornar à página inicial, clique no botão abaixo. Também centralizaremos esse texto. Vamos torná-lo branco. Mude a fonte. Eu vou mudar isso para casar, se deve ser bom. E vamos adicionar o botão abaixo. Vamos centralizá-lo. Aqui. Adicionaremos o link à nossa página inicial. Então, no meu caso, é esse. Talvez aumente esse botão e me leve de volta à página inicial. Ou talvez me leve para a página inicial. Vamos dizer palavras. E vamos mudar as cores. Cor ao passar o mouse. Vamos fazer isso vermelho. Tudo bem. E talvez adicione um ícone, um ponto de exclamação. Ou talvez um estreito. Fica melhor. Quanto mais isso pode funcionar. E clicaremos em atualizar. E isso deve ser muito bom. Agora voltaremos ao painel. Plugins, plugins instalados para a página 04. Clicaremos em Configurações. E aqui selecionaremos a página 404 e clicaremos em Salvar. Agora, se entrarmos em nosso site e eu adicionar uma barra e digitar algo aleatório. Estamos na página do fluoróforo. E se clicarmos nesse botão, voltaremos à nossa página inicial principal, certo? Muito simples. Como você pode ver, eu tenho alguns espaços em branco aqui, então talvez eu possa fazer algo sobre isso. Então, vamos fazer com que esse tamanho talvez, cubra e mude a altura, talvez para 600. Portanto, isso deve resolver o problema. Agora está bom. Então é assim que você cria uma página de fluoróforo. Bem simples. Você deve sempre ter isso para não perder seus visitantes no seu site. Se eles escreverem algo após o link. 15. Como fazer SEO com o Yoast SEO e dicas: Vamos falar um pouco sobre SEO agora mesmo. Então, o SEO vem da otimização de mecanismos de busca. Então, basicamente, otimizaremos nossa página para o Google para que possamos ser encontrados mais facilmente no mecanismo de pesquisa e assim por diante, com base em nossas palavras-chave. Então, temos um plug-in para isso, e esse plugin é esse, Yoast SEO, certo? Então, você basicamente terá que abrir isso. E tem um pequeno, algum tipo de assistente primeiro que você precisará usar para configurá-lo. Primeira configuração, basta clicar em Continuar. Você terá que selecionar algumas coisas aqui. Nome da organização, seu logotipo, seus perfis de mídia social e você estará pronto depois. É muito fácil de configurar. Depois de fazer isso, você entrará em suas páginas e verá que tem algum tipo de classificação aqui para SEO. Então esse é para SEO. Para cada página. No nosso caso, para este curso, nos concentramos em criar um site de uma única página. Então, um site de uma página. Vamos nos concentrar apenas na página inicial, que é a mais importante. Então, vamos entrar nele, basta clicar nele. E aqui temos uma categoria de SEO do Yoast. E como você pode ver, nossa pontuação agora está vermelha, então precisamos fazer algumas mudanças. Primeiro, você precisa de uma frase-chave de foco. Isso significa suas principais palavras-chave nas quais você deseja se concentrar. No meu caso, as principais palavras-chave são serviços de conserto de bicicletas. Ou só por treta, eu posso escolher o que eu quiser. O reparo de bicicletas também funciona. Talvez seja melhor e mais curto. Vou me concentrar nisso. Agora. Eu preciso de um título para o meu site. Então, meu título é esse. Eu escrevi serviços profissionais de conserto de bicicletas anteriormente, mas mudei para isso porque é muito mais simples. E eu posso simplesmente deletar o que temos aqui e escrever serviços de conserto de bicicletas. O melhor da cidade. Então, para slug, você pode escrever o que quiser. E, como você pode ver, o slug é basicamente o que aparece depois do seu domínio. Mas você não precisa inserir nada aqui. Não é obrigatório. Para a meta-descrição. Se eu clicar em SEO e análise aqui, você verá que temos várias marcas de verificação vermelhas e precisamos corrigir praticamente tudo. Nem tudo é realmente um problema, mas você deve corrigir o máximo possível. Então você tem essa tela e estará muito pronto para começar. Então, vamos nos concentrar em transformar isso em verde. Links de saída. Isso significa basicamente que você precisa mencionar outros sites em seu site. Então, eu preciso apontar para outros sites, se você puder. Isso vai te ajudar. Ofereceremos credibilidade e assim por diante. Então, se você puder fazer isso, por exemplo, na minha página, tenho uma página de serviço de conserto de bicicletas. Talvez eu possa, nesta seção, adicionar algum tipo de evento futuro com um link para ele. E isso vai me ajudar e eu vou me fixar. Então é assim que você corrige isso. Em seguida, temos a frase-chave na introdução. Sua frase-chave ou não aparece no primeiro parágrafo, certifique-se de que o tópico esteja claro imediatamente. No meu site. Qual é o primeiro parágrafo? É esse aqui embaixo. Como você pode ver, esse texto é um parágrafo aqui. Então, preciso mencionar as palavras-chave no primeiro parágrafo. O que vou fazer é adicionar mais uma linha de textos. E eu direi somos conhecidos por oferecer os melhores serviços de conserto de bicicletas da cidade. E ao fazer isso, isso está coberto agora. E você verá que funciona assim que eu salvar e atualizar esta página. Mas vamos lidar com todos os problemas primeiro. Então temos outro. O foco em elogiar foi encontrado uma vez. Isso é menos do que o mínimo recomendado de duas vezes para um texto desse tamanho. Então você precisa mencionar essa frase-chave, certo, no seu site, pelo menos duas vezes ou mais. Certo? Portanto, você pode fazer isso facilmente mencionando isso em seu texto. Isso pode ser facilmente corrigido. E agora são seis porque eu mencionei isso no meu parágrafo, então isso também deve ser corrigido. Então, temos mais um tamanho de meta descrição , independentemente da descrição especificada, que é essa, a descrição da sua página. Então, vamos escrever algo agora. Eu já escrevi alguns textos aqui. Então, essa é uma descrição que vou acrescentar. Vou inseri-lo aqui. E, como você pode ver, tem a frase-chave dentro, que é obrigatória. Então, isso é bom. Agora temos mais uma vez, use mais frases-chave são sinônimos em seus subtítulos H2 e H3. Então, h para h freeze são praticamente, eu mudo este para H4. Este é livre de H, então você deve consertar alguma coisa na bicicleta. Ou no meu caso, pelo menos eu deveria consertar bicicletas. As palavras-chave em si estão aqui. Mas isso não é obrigatório. Você precisa escrever muito conteúdo em seu site para ter um título mencionado na palavra-chave, novamente, a frase-chave. Então eu vou pular este. Não vou me concentrar nisso, mas vou me concentrar nos outros. próxima linha do texto contém 231 palavras. Preciso de no mínimo 300 palavras, então preciso adicionar mais texto no meu site. Eu farei isso. Eu já editei quase como parte e adicionei mais texto. Então, esses são os textos que vou acrescentar agora. Então, basicamente, agora temos muito mais textos. Deixe-me adicionar alguns espaços intermediários. Isso é copiado e colado, e essa não é a melhor prática, mas vou fazer com que funcione de alguma forma. Então, backspace, Enter novamente, e isso é bom o suficiente. E mais uma linha. É isso. Sim. Tudo bem, deixe-me deletar essa parte. Então, vamos ver se está tudo bem. Tudo bem, isso é bom. Outra coisa, vamos ver. Textos de capa. Eu fiz isso. Talvez adicione um pouco mais aqui. Mas acho que tenho texto suficiente. Então, vamos atualizar isso primeiro e ver quantos problemas com x. Então, vamos atualizá-lo agora. E eu esqueci de salvá-lo nesta parte. Então eu tenho que escrever novamente, tudo bem, nós faremos isso. Então, temos conserto de bicicletas. E aqui temos serviços de conserto de bicicletas. Certo? E uma descrição aqui. Feito. Como você pode ver, já estamos verdes agora, consertei praticamente tudo o que tínhamos. Este X contém. Então, eu preciso de mais uma palavra para corrigir isso também. Então eu vou fazer isso. Deixe-me acrescentar outra coisa. Então, vou entrar aqui e adicionar alguns textos talvez embaixo ou talvez no mesmo parágrafo. Otimalidade ajustada. Tudo bem, mesmo que não faça sentido, eu escrevi quase a mesma coisa, mas só para preencher as lacunas e concluir isso. E temos mais uma aqui que diz imagens de ultrassom nesta página, apenas uma tem um atributo alternativo que reflete o tópico do seu texto. Então, como podemos corrigir isso? Nós entramos em imagens. Então, vamos para a mídia. Aqui dentro. Eu abro isso em uma nova guia e adicionarei alguns textos alternativos aqui. E posso dizer conserto de bicicletas em vez de rodas e pneus. E este resolverá esse problema. Então, vamos adicionar mais um. Esse problema agora será corrigido. Então, vamos atualizar isso primeiro. Vamos ver. Acho que tenho que esperar um pouco para que ele seja atualizado. Deixe-me ver se eu sim, vou ter que esperar um pouco. Vamos atualizá-lo novamente. Ainda não terminei. Portanto, pode levar algum tempo para ser atualizado porque apesar de eu ter feito as mudanças, como você pode ver, as palavras ainda são as mesmas. Então, fizemos uma atualização, as palavras que eu escrevi anteriormente e os textos alternativos também. Mas temos esse verde e isso será atualizado muito, muito rápido. Portanto, isso não é um problema. Então, esses são basicamente os princípios básicos quando se trata de SEO. Tudo o que você tem aqui é uma boa informação. E se você aplicar praticamente tudo o que esse plug-in diz, repetirá muito bom para usar. Mas há mais coisas, e uma delas são backlinks, por exemplo, o que é um backlink? Basicamente, alguém menciona seu site em seu site que oferece credibilidade e é um bom fator para SEO. Mas o mais importante , obviamente, é o tráfego. Portanto, desde que você tenha muito tráfego em seu site, você terá um desempenho muito bom no mecanismo de busca e isso o ajudará muito. Então, comece a veicular anúncios e isso resolverá tudo para você. E você subirá na classificação desde que tenha boas palavras-chave em seu site. Agora, outra coisa que é importante quando acessamos a guia de mídia aqui na biblioteca, você deve sempre otimizar as imagens. Certifique-se de usar imagens que tenham um tamanho baixo, como esta, um tamanho pequeno. Então, abaixo de 200 kb, não importa a imagem, abaixo de 200 kb. Agora, quando se trata de formatos, existem dois formatos. Temos uma página na web. Este é mais recente, mas é muito mais eficiente e geralmente ocupa menos espaço. Portanto, é melhor do que o formato JPEG, que é popular. Então, novamente, na web B, converti praticamente todas as minhas imagens de JPEG para API. Então você pode simplesmente acessar o Google, por exemplo, deixe-me fechar este. Depois, você pode acessar o Google e digitar convertê-lo novamente em um p. E aqui você terá ferramentas gratuitas. Então, basicamente, selecione seu JPEG específico , selecione o formato de conversão e clique aqui para obter o arquivo e substituí-lo em seu site. Então, é muito, muito simples. Então, esses são basicamente os princípios básicos que você precisa saber. Isso é praticamente o suficiente. Basta ter uma boa hospedagem, bom conteúdo em seu site. Se boas palavras-chave otimizarem suas imagens, não sobrecarregue seu site com muitas coisas, pois isso fará com que ele carregue ainda mais lento do que já carrega. E lembre-se também de que, mesmo nesses mapas do Google aqui, estamos atrasando o tempo de carregamento provavelmente estamos atrasando o tempo de carregamento em meio segundo, ou até mais. Portanto, você pode simplesmente adicionar uma imagem em vez desse mapa e adicionar o link a ela. Então, quando alguém clica nessa imagem, ela vai para aquela localização específica do mapa do Google. Você pode simplesmente copiar o link. Então, podemos fazer algo assim, isso pode funcionar. E é mais eficiente do que adicionar um mapa, mesmo que o mapa tenha uma aparência melhor, obviamente. Então, sim, é basicamente isso. Obrigado por permanecer até o fim neste curso. Tenho certeza de que você aprendeu muitas coisas. E desejo-lhe muita sorte com seu projeto.