Como Criar Um SITE PROFISSIONAL com WordPress e Elementor Pro [Passo a Passo do Zero Sem programar]

Neste vídeo eu vou te ensinar como criar um site profissional multi-página com WordPress e o Elementor Pro. Fala pessoal, tudo bem? Aqui é a Micaela do Descomplicando Sites e antes de começar o nosso tutorial eu quero pedir para você deixar aquele like no vídeo que ajuda demais o canal a crescer e para você se inscrever no canal. Então é isso, vamos lá para a tela do meu computador agora. Antes de começar o nosso projeto eu tenho alguns avisos muito importantes então escute com atenção primeiro se você estiver achando que eu estou falando rápido ou devagar

demais aqui no vídeo do YouTube tem essa engrenagem Onde você consegue clicar em velocidade reprodução você consegue deixar mais rápido ou mais devagar para você acompanhar da melhor forma outra coisa tudo que eu vou indicando para vocês você vai ver que ao longo do vídeo eu vou indicar para vocês outros vídeos de outras coisas que eu já tenha feito ferramentas que eu indico e tudo vai estar na descrição do vídeo Então é só você rolar a tela um pouquinho para baixo Ó tem o começo de um texto aqui você clica em mais que aí vai

abrir o restante da descrição tá vendo Então todo o material está aqui Inclusive a aula fica separada em capítulos tá vendo ó depois você pode ir pulando paraas partes exatas da onde que você quer porque o vídeo ele fica separado em capítulos aqui embaixo Nós somos parceiros e afiliados de algumas das plataformas que a gente indica como a hospedagem Hostinger que vai ser a primeira coisa que a gente vai comprar o elementor Então sempre que eu indicar alguma ferramenta para você se você puder comprar com o nosso link eu vou agradecer muito porque ajuda o

canal a trazer mais conteúdos relevantes aqui para você aí sempre vai estar descrito aqui tá vendo inclusive na rgar nós temos um cupom de desconto de 10% tá outra coisa Sempre que eu faço um projeto eu deixo todo o material para você acompanhar então imagens banners ícones tudo que eu uso aqui você pode ir lá no nosso drive para poder baixar essas imagens e fazer o projeto igualzinho para colocar no seu portfólio se você quiser aí o link fica aqui também ó vai tá escrito material de apoio você clica e vai direto aqui já pra

pasta do drive onde tem todo o material Ok dados os avisos vamos lá a primeira coisa que a gente vai fazer vai ser a compra do domínio da hospedagem e logo em seguida já a instalação do WordPress o domínio é o link do seu site então por exemplo aqui nesse site Zeus né para eu conseguir acessar ele aqui na internet eu consigo acessar a zeos advogados.com.br e para eu ter um link assim customizado com o nome do meu projeto da minha empresa do meu nome eu preciso pagar pelo Direito de usá-lo não é caro não

se preocupe mas você precisa pagar geralmente a gente paga anualmente aí você pode comprar Quantos anos você quiser né você paga anualmente e a hospedagem é um serviço que a gente assina para poder hospedar os arquivos do nosso site e manter ele na internet é assim que as pessoas conseguem acessar o nosso site de onde elas quiserem porque essas empresas de hospedagem ficam transmitindo os arquivos e os nossos dados para a internet de forma que qualquer pessoa consiga acessar para isso né para que os os seus arquivos seu site ten uma casa né Tenha um

local ali na internet você precisa pagar também pelo direito de usar essa hospedagem e esse serviço tá a hospedagem que a gente indica é hospedagem Hostinger que é uma hospedagem multinacional tem servidor e tem suporte aqui no Brasil então você consegue se comunicar tranquilamente com eles tem muito material também aqui no canal e material da própria Hostinger ensinando sobre todos os recursos que eles têm a gente é parceiro e afiliado deles então se você clicar aqui e comprar com o nosso link você vai ajudar o canal a trazer mais conteúdos como esse aqui para você

e nós temos um cupom de desconto que dá até 10% de desconto tá bom então você clica aqui às vezes abre essa telinha aqui do YouTube né falando que você está saindo do site do YouTube aí você pode clicar aqui em ir para o site Tá bom você vai ser redirecionado lá pro site da hostinger você vai escolher o seu plano de hospedagem você rola a tela aqui para baixo esses três planos principais aqui que são os mais populares que eles indicam mas se você vier aqui em hospedagem tem outros planos aqui também que você

pode escolher tudo vai depender da quantidade de acessos que você espera ter no seu site sabe então se você vai hospedar um site grande e espera ter muitos acessos vai fazer tráfego pago espera ter milhões e milhões de acessos é melhor você comprar um plano mais caro vir aqui na hospedagem Cloud comprar um plano mais caro e dedicado Mas você espera ter uma quantidade idade média de acesso vai fazer tráfego mas não vai ter tantos milhões de acesso esses planos aqui comportam muito bem e se você está começando este plano Premium aqui comporta muito bem

para você tá com ele você consegue ter acesso até 100 sites então se você quiser fazer outras páginas outros sites você consegue colocar também 100 GB de armazenamento domínio grátis então lembra que o link do site que eu falei para você se você comprar a partir de um ano de hospedagem né 12 meses você ganha o primeiro ano do domínio de graça então você não precisa pagar pelo primeiro ano só a partir do segundo tá e-mail institucional você pode fazer e-mail profissional com o seu domínio aqui também de graça SSL então assim backup tem muita

coisa legal tá claro que cada um dos planos conforme vai aumentando o preço vai aumentando os recursos eu vou escolher esse plano aqui vou clicar em escolher o plano aqui você escolhe Quanto tempo você quer comprar eu vou pegar pelo menos do 12 meses né pra gente poder pegar promoção aí de não pagar pelo domínio e você vai observando que quanto mais tempo você comprar menos você vai pagar por mês então se você deixar descontar mês a mês por exemplo vai ficar caro vai ficar 45 Se você comprar 12 meses já cai para menos da

metade então compensa demais comprar pelo menos 12 meses e conforme você vai comprando mais tempo vai ficando mais barato ainda né você vai escolher aqui qual que é o método de pagamento que você vai querer vai preencher aqui os seus dados e aqui embaixo você vai colocar um cupom de desconto ó temos um cupom de desconto aí você vai copiar o nosso cupom e vai colar aqui e vai clicar em aplicar e olha só já diminuiu para 172 então assim compensa demais 172 por 12 meses vai ficar bem barato e você ainda vai comprar aí

o domínio do primeiro ano gratuito né Eu estou logada né então por isso que já tá aparecendo meu nome se você não tiver vai aparecer assim para você ó vai aparecer um formulário aqui para você criar uma nova conta é bem tranquilo você cria aqui coloca o seu e-mail coloca a sua senha e aqui embaixo no meu eu tava puxando os meus dados né porque eu tava logada aí no seu caso você preenche aqui os seus dados tá bom é bem tranquilo mesmo aí você vai clicar aqui em lhe aceit os termos de uso vai

clicar em enviar pagamento eu escolhi a forma de pagamento cartão de crédito Então vai abrir aqui para mim um formulário para eu preencher e aqui também dá para dividir em até 12 vezes no cartão tá Vou preencher aqui os meus dados e clicar em pague agora pronto aí ele vai perguntar se você quer migrar no site ou criar nós vamos criar clique em próximo se você quer criar com WordPress ou com a ia da Hostinger tem que selecionar o WordPress tá não seleciona essa ia da Hostinger senão vai para outra coisa então seleciona WordPress e

clica em criar com WordPress E aí aqui ele ele vai pedir pra gente instalar o WordPress né então aqui vai pedir para você colocar o idioma aqui o seu e-mail administrador para entrar no WordPress WordPress pessoal é a plataforma que a gente vai usar para criar o nosso site tá então assim a gente comprou a hospedagem agora a gente dentro dessa hospedagem a gente está instalando um software chamado WordPress E aí a gente vai acessar esse software para criar o nosso site entendeu então aqui você vai colocar o login e a senha que você vai

usar para logar lá no seu site clique em próximo aí aqui você vai escolher qual tipo de site você vai criar pode clicar em outro e clicar em próximo aqui você não vai escolher nenhum tema e nenhum template Pronto pode clicar em criar site em branco aqui a gente não vai usar nenhum desses plugins então você pode desativar os plugins e clicar em pular aqui a gente não vai colocar nada pode clicar em pular e aqui para você escolher o seu domínio então lembra que eu falei para você que a gente comprou 12 meses e

tem um ano de domínio grátis então é aqui que você vai escolher o seu domínio só que eu sugiro que você primeiro volte lá no site da Hostinger e dê uma pesquisada se o domínio que você quer está disponível Então você clica aqui em cima na aba de domínios que aí você vai conseguir fazer uma pesquisa melhor aqui antes de efetuar o cadastro lá no seu domínio tá então você vem aqui e aí você vai pesquisar o nome do domínio que você quer por exemplo eu vou colocar aqui Dr Antônio Carvalho e vou clicar em

procurar aí você tem que Observar se está disponível as extensões pcom e pcom.br como a gente já vai ganhar um domínio nesse plano que a gente comprou o domínio que a gente escolher a gente não vai precisar pagar por ele no primeiro ano né só a partir do segundo mas o interessante seria você comprar o segundo domínio para você ficar protegido porque o que que acontece Pode ser que alguém tenha a mesma ideia de nome ou o mesmo nome de empresa que você e aí se você comprar só o pon com por exemplo a pessoa

vai lá e compra o.com.br e ela vai estar competindo com você no Google com o nome igualzinho só com uma extensão diferente a extensão é o que vem depois do ponto tá vendo toda extensão que finaliza com.br significa Brasil que é a extensão do nosso país Então se você for optar por comprar um domínio seria mais interessante você comprar a opção com.br Porque como nós estamos no Brasil e as pessoas que vão acessar o nosso site são majoritariamente brasileiras o Google tem a dar como resposta para essas pessoas sites com a extensão Brasil porque ele

entende que são sites brasileiros então se você puder comprar os dois ótimos se não você pode comprar um só e aí depois você avalia se você achar que vale a pena você comprar outro Tá bom então eu vou escolher este daqui que é o dantonio pcom vamos voltar lá pra tela vamos colar aqui o domínio que a gente quer você já pode até escrever aqui a extensão que você quer ó por exemplo eu vou pegar .com vou clicar aqui aqui aí vou clicar em próximo aí aqui ele pegou aqui os meus dados que já estavam

no meu cadastro se o seu não tiver você pode clicar aqui em editar e preencher todos os dados clica em finalizar o registro esses dados são pra gente registrar o nosso domínio Pronto agora você vai escolher o servidor aqui você vai escolher o servidor que esteja mais próximo de onde os seus clientes estão né No meu caso aqui no Brasil não tem todos os países mas não precisa tá pode ser o que estiver mais próximo aí da região aí vou escolher Brasil vou clicar em próximo pronto depois que a gente fez a instalação do WordPress

você vai ser direcionada aqui né para esse painel aqui de controle se você acessar o seu domínio ó pode ser que não esteja aparecendo para você pode ser que seja aparecendo uma mensagem de erro isso pode acontecer principalmente se você comprou um domino.com.br porque o domínio ele tem um prazo de até 24 horas para ser registrado geralmente aqui na Hostinger demora poucos minutos então mesmo que apareça uma mensagem de erro você pode ficar aqui esperando um tempinho recarregar a página que aí na hora que parar de aparecer a mensagem de erro é porque o site

já vai estar no ar Ok E aí para logar no site tem duas formas ou você acessa o link do site aqui ó se você acessar o site vai estar assim ele já está no ar a partir do momento que a gente instala o WordPress o site já tá no a e o que a gente vai fazer é modificar isso daqui aí para logar você pode colocar na frente do seu domínio uma barra WP tro admin aí você você é redirecionado pra página de login do seu site que é essa daqui você vai colocar aquele

login sem que você criou se você tiver esquecido ou estiver dando errado você não lembrar aqui dentro da rosing você pode só clicar em WordPress também que ele vai carregar e te Direcionar para dentro do WordPress já logado então tem essas duas maneiras Demora mesmo um pouquinho que se for esse o caso né se você tiver esquecido a sua senha você pode só vir aqui em usuários todos os usuários aí você já vai ver qual que é o nome né de usuário seu e-mail que está aqui aí quando você for logar você já sabe que

é esse e-mail Você pode clicar aqui em editar descer aqui clicar em nova senha ó definir nova senha Aí você coloca uma senha nova e clica em atualizar perfil aí você já fica sabendo que é este e-mail e esta senha Ok beleza agora a gente vai fazer algumas configurações iniciais aqui no WordPress vamos fazer a instalação do nosso tema o tema pessoal é como se fosse o sistema operacional aqui do nosso site então por exemplo é como como se o WordPress fosse o nosso celular e aí o tema é o sistema operacional como por exemplo

iOS ou Android que vai determinar as configurações padrões você consegue mudar o tema aqui através da aba de aparência você vem em aparência temas ele já vem com três aqui básicos instalados você não precisa de mais de um tema só o que está instalado que você está usando ó só o que tá ativo os outros você pode excluir então você clica nesse clica em excluir em Ok clica nesse excluir e Ok não é esse tema que eu quero usar eu quero usar um que chama Hello então clica aqui em Adicionar novo tema ó a mais

populares já vai estar aqui Se não tiver aparecendo você vem aqui na lupinha digit Hello você vai clicar em instalar depois ativar pronto aí já fica destravado esse outro tema aqui que a gente não tá usando pra gente excluir clica excluir ok agora a gente vai fazer as configurações né você vai vir aqui em configurações geral aí Aqui você pode segurar a descrição do site a descrição do site é esse textinho que aparece ali em cima ó tá vendo que tem o título do site que é Dr Antônio Carvalho e tem a descrição do site

que é endocrinologista em Uberlândia e você consegue fazer isso aqui nessa parte ó aqui é o título do site eu vou modificar para drout Antônio Carvalho e aqui eu vou colocar a descrição a descrição aparece depois do título do site tá vendo tem um tracinho tudo que aparece depois do traço é o que você vai colocar aqui na descrição aqui a gente vai definir o ícone pro nosso site tá vendo que todas as abas que eu tô acessando tem o ícone a gente define esse ícone aqui aí eu vou clicar em escolher um novo ícone

e vou arrastar o ícone para cá pode ser o ícone da sua logo a sua Inicial tem que ser uma imagem um por um ou seja tem que ter os mesmos tamanhos por exemplo 100 de largura 100 de altura 200 de altura 200 de largura entendeu então tem que ser uma imagem quadradinha eu já deixei aqui na pasta pra gente ó ícone do site Antônio você você vai arrastar para cá clicar em definir ícone recortar o ideal é que seja com fundo transparente tá aqui você não vai mexer em hipótese alguma tá em endereço do

URL você não vai mover porque se você mexer o site quebra o site sai do ar então não mexe aqui Aqui você pode mudar se você quiser né que é o e-mail administrativo o restante também o formato da data e da hora se você quiser você pode mudar também eu vou deixar do mesmo jeito e se por acaso seu painel tiver em inglês você pode vir aqui em idioma tá vendo ó e mudar para português do Brasil ou a língua aí que você estiver usando depois de tudo você vem aqui em salvas alterações Pronto já

fizemos aqui essas configurações básicas agora vamos para o passo dois primeiro passo que a gente vai fazer vai ser criar as nossas páginas então aqui eu tenho página início que vai ser a página principal aqui do nosso site a página sobre especialidades blog e contato Vamos criar todas essas páginas Vamos ir aqui em páginas todas as páginas ó vem por padrão com essa página de política de privacidade você pode clicar aqui em edição rápida mudar aqui para escrito em português né escui esse texto aqui que é o Slug aí quando você salvar ele já vai

criar novamente clica em atualizar Aí clica aqui em editar fecha e clica ali em cima em publicar duas vezes pra gente já deixar essa página pública tá que preciso ter a página de política de privacidade no site agora para criar novas páginas você vai sempre clicar aqui em cima em adicionar nova página ou aqui também Você pode clicar aqui em adicionar nova página ou aqui também na barrinha você pode clicar em adicionar nova página vai tudo pro mesmo lugar vai clicar aqui vamos colocar o título Então vou criar a página início início e vou clicar

aqui em cima em publicar duas vezes clico aqui no ícone para voltar adicionar nova página vou criar sobre m publicar publicar especialidades publicar publicar publicar publicar e contato publicar publicar Pronto agora que criamos as nossas páginas nós vamos definir a página início como página principal porque se a gente acessar o nosso site ó Sempre que você quiser acessar o site passa o mouse aqui em cima vai visitar site pode recarregar a página ele vai mudar para essas letras rosas que são características do tema relo que a gente instalou Mas não se preocupe que a gente

vai mudar tudo aí tá vendo que tem aqui esse arquivo esse post Então tá configurado pra página blog ser a página principal e a gente não quer a gente quer que quando a pessoa acesse o nosso link ó a página principal seja essa página início que é onde tem todas as informações né então para fazer isso a gente vai vir aqui em configurações leitura aí tá vendo ó sua página inicial exibe tá vendo que tá marcado como seus posts recentes a gente vai mudar para uma página estática vai escolher a página início muita gente coloca

a página home também a maioria dos Meus outros sites eu coloquei home também eh e página de postes a gente vai colocar a página blog e vamos clicar em alterar aí se a gente recarregar vai sumir esse post daqui Opa tem que clicar em salvar aí se a gente recarregar vai sumir esse post daqui se não tiver aparecendo você passa o mouse aqui em cima limpar tudo que aí vai limpar o cach e começa a aparecer tá vendo página início ficou como página principal agora a gente vai criar o nosso menu o menu são esses

links aqui tá vendo que a gente vai clicando e vai mudando de página e para criar ele a gente vai vir em aparência menus Vamos criar um nome para ele eu vou colocar menu principal só você escrever aqui clica em criar menu e pronto agora a gente vai vir aqui em ver tudo vamos escolher as páginas ó início sobre mim especialidades blog e contato a vou selecionar elas e clicar em adicionar ao menu vou acertando aqui né quero colocar Opa quero colocar a página de contato aqui como a última a sobre nessa segunda especialidades e

aqui no site eu coloquei a aba de currículo também que não é uma página ele leva lá pra página inicial mesmo quando a gente quer colocar apenas um link como é o caso aqui ó vendo eu clico ele me manda para essa parte aqui da página inicial Quando é o link a gente vem aqui e seleciona links personalizados aí aqui a gente coloca o título que vai aparecer que eu vou colocar currículo e aqui a gente vai colocar o link nesse caso aqui como eu quero que me direcione para uma parte aqui da página inicial

Tá vendo eu vou pegar o link do meu site ó meu domínio Vou colocar aqui tem que ter essa Barrinha no final eu vou colocar hashtag e o nome do ID que eu vou usar que no caso vai chamar currículo tem que ser minúsculo e sem nenhuma pontuação tá Depois a gente vai criar essa essa linkagem lá na página cliquei em adicionar ao menu aí Vou colocar aqui em cima pronto vou clicar em salvar menu outra coisa neste menu aqui eu não coloquei mas se você quiser fazer o menu como este por exemplo que você

passa o mouse e tem mais opções aqui no submenu é assim ó por exemplo né nesse caso aqui deste site a gente tem várias especialidades Ó mas se você quiser quer colocar todas as especialidades tem como fazer no submenu vou te ensinar nesse caso aqui a gente pode colocar links personalizados ó a gente vem aqui em links personalizados cria os nomes por exemplo eu vou colocar emagrecimento eu coloco aqui o título e aqui eu vou colocar só uma hashtag só pra gente criar o link e depois a gente vem aqui e cola a página que

vai ser de emagrecimento vendo aí você clica em adicionar ao menu e você vem e deixa abaixo de especialidades e mais pro lado e está vendo que tem um espaço aqui quando tem um espaço significa que o esse item vai estar abaixo desse aí você vai criando todos que você quer eu vou colocar alguns aqui só para você ver ó por exemplo diabetes Vou colocar aqui vou clicar em adicionar o menu aí vou pegar e colocar aqui embaixo vou colocar esse outro aqui por exemplo perca capilar perda capilar pronto vou pô só esses daqui para

você visualizar ó pronto todos aqui aí quando a gente criar o nosso as nossas páginas de cada uma desse é só você vir aqui clica abre e cola o link aqui para substituir essa hashtag aí você clica aqui em salvar menu pronto se você acessar o nosso site agora mesmo que você limpe o cche não vai estar aparecendo o menu aqui tá E isso é normal vai aparecer depois que a gente configurar ok então beleza já criamos aqui o nosso menu que são os nossos links e agora nós vamos começar a criar o nosso layout

a primeira coisa que a gente vai fazer vai ser a compra do elementor pro o elementor ele é um plugin a gente vai usar vários plugins gratuitos e vamos usar esse plugin pago que é o elementor pro plugins são como se fosse aplicativos né como o nosso celular por exemplo não vem com todas as funções que a gente quer a gente precisa baixar alguns aplicativos e para instalar aplicativos ou plugins aqui dentro do WordPress você vai vir aqui em plugins Adicionar novo plugin o elementor ele tem duas versões tem a versão gratuita e tem a

versão Pro que adiciona alguns recursos pagos mas o elementor que vai criar a maior parte da estrutura que a gente vai usar vai ser a versão gratuita e para instalar ele a gente pode vir aqui para ele e qualquer outro plugin que você quiser tá você vem aqui em plugin Adicionar novo e tem essa busquinha aqui tá vendo você pode digitar o nome do Plugin que ele vai aparecer é esse plugin aqui elementor page builder ou como a gente instalou aquele tema chamado Hello ele já fica com esse aviso aqui em cima pedindo pra gente

instalar você pode clicar aqui ou então aqui em cima tá vendo você clica em instalar e depois em ativar este site que a gente tá fazendo a gente vai precisar comprar o elementor pro mas se você não quiser comprar o elementor pro tem outros sites que a gente fez aqui com a versão gratuita do elementor como por exemplo este site aqui que é o site Zeus é um site que a gente fez com tema de advogado então assim serve para qualquer nicho também você pode mudar esse mesmo projeto aqui a gente transformou nesse projeto que

é o Hélio PC só para você ver que realmente dá para usar em qualquer nicho então você pode ver ele também e tem este outro aqui que é um que eu fiz com o nicho de nutrição tá esses três Aqui foram feitos com elementor gratuito sem precisar comprar o elementor pro aí você consegue acessar eles aqui no canal e o template deles também está à venda tá de todos os projetos conhecido aqui no canal o template tá à venda também só você digitar aqui site com Elementor free por exemplo que você vai ver o tutorial

Ó tem esse tem esse e tem esse então se você não quiser comprar o elementor pro assiste esses outros projetos beleza para comprar o elementor pro que nem eu falei para vocês eu sou afiliada e parceira das Ferramentas e o meu link de afiliada fica aqui na descrição Então você clica aqui em mais aí tem que adquire o elementor pro você clica aqui você vai ser redirecionado pro site do elementor aqui com o meu link tá pode ser que esteja aparecendo diferente para você também porque eles atualizaram colocaram assim ó tá vendo É o mesmo

preço que tá aparecendo nessa outra página só que aqui eles estão fazendo uma ancoragem de preço tá vendo que aqui tá ó o preço anual r$ 9 aqui tá falando que é como se fosse R 4,92 por mês tá mas aí você paga o preço cheio eles não parcelam não e está em dólar mesmo ok então você tem que ver qual que é o dólar atual por exemplo dólar de hoje tá 5,67 então 59 que é esse plano menor dá 334 anual tá então você vai escolher o plano que você quer este site que a

gente vai fazer é um site mais simples mais comum então você pode escolher esse primeiro plano aqui mesmo Essential que ele já dá todos os recursos que a gente quer que é pra gente conseguir colocar formular pra gente conseguir colocar blog post né não precisa ser a partir desse aqui não ele dá para usar em apenas um site S então se você quiser usar em mais sites você tem que comprar os outros planos tá vendo esse dá para usar em três esse até 25 esse até em 1000 se você for fazer apenas um site pode

comprar este plano aqui mesmo você vai escolher qual plano que você quer vai clicar em Ban Now Ou se você quiser ver todos os recursos você pode só clicar com o botão direito traduzir para português que aí você vem aqui ó em português todos os recursos que dá direito tá no plano clicando em comprar agora você vai ser redirecionado aqui pro checkout ele vai pedir os seus dados você vai colocar os seus dados vai clicar em continuar aí você pode escolher o PayPal ou o cartão de crédito aqui para você efetuar a compra Lembrando que

tá vendo ele cobra o valor cheio é anual você não precisa pagar todas as vezes se você quiser não renovar tudo bem Você só não consegue pegar as atualizações do elementor e é muito legal que a gente consiga continuar pegando as atualizações porque traz recursos novos traz atualizações de segurança mas se você não quiser continuar pagando depois de um ano tudo bem o site não vai sair do a depois que você tiver efetuado a compra você vai ser redirecionado aqui para seu perfil aí vai ter esse ícone aqui de download em cima onde você vai

conseguir baixar O plugin Você vai clicar vai clicar em elementor pro aí vai efetuar o download do plugin tá vendo ó depois que terminar você pode até fechar aqui essa aba aí você vai vir aqui dentro do WordPress ó tá vendo que a gente fez a instalação do Plugin Elementor free ele te leva para essa página você pode clicar em pular pular ou então você pode tá vendo aqui em cima onde tem WP traço admin de admin.php para lá você pode excluir que a você vai voltar pro painel quando você tá logado Toda vez que

você vem para essa página WP TR admin você volta pro painel administrativo tá pra gente instalar o elementor pro aqui a gente vai vir em plugins adicionar plugin quando é um plugin que a gente traz de fora que a gente baixa de outro lugar a gente vem em enviar plugin aí aquele arquivo que a gente baixou a gente arrasta para cá você localiza lá do seu computador do e arrasta para cá bem para cima desse nome aqui aqui como eu estou usando o Chrome eu já vou clicar aqui em cima nessa setinha que ele vai

estar aqui eu só arrasto ele para cá e cliquei em instalar agora e depois vou clicar em ativar ele ainda não está funcionando você precisa conectar a sua licença para ele começar a funcionar você clica em conectar e ativar aí tá vendo você precisa estar logado se você não tiver logado ele te pede o login a senha você clica em ativar minha licença e a partir de agora sua licencia vai estar conectada agora a gente vai fazer as configurações padrões do nosso tema que são configurações que a gente faz que a gente já deixa salvo

os tamanhos das fontes as cores que a gente vai usar para que a gente não precise toda hora ficar colocando o código da cor o tamanho da fonte a gente já deixa tudo salvo e aí facilita demais a nossa vida para fazer isso a gente vai vir aqui em elementor aliás vamos vir aqui em modelos modelos salvos todos aí Aqui tem kit padrão Você vai clicar em editar com elementor pode clicar aqui em continue aí Aqui são as configurações padrões a gente vai clicar aqui em cores globais ele já faz aqui um mapinha pra gente

mostrando as fontes padrões e as cores padrões eu já deixei aqui tudo salvo as cores e fontes que eu vou usar e eu vou pegar por exemplo a minha cor primária vai ser essa cor verde essa cor verde aqui que eu tô usando no projeto então eu vou clicar aqui e vou colar o secundário que é onde vai ter os títulos onde vai ter todas as cores dos textos vai ser esse cinza eu vou copiar e vou colar aqui então Ó esse cinza que eu estou usando aqui nos textos vai ser este e essa cor

aqui do texto também vou colocar esse cinza aí aqui no real que é a cor dos links eu vou colocar essa cor de azul vou copiar vou clicar e vou colar aqui o código da cor perceba que aqui você pode colocar a cor que você quiser também tá vendo se vai arrastando ó vai modificando aqui embaixo aí você pode encontrar a cor que você quiser se você já tiver o código da cor você coloca aqui se você nunca criou paleta de cores tem um vídeo aqui no canal te ensinando como criar paleta de cores ou

você pode pegar a paleta da sua logo também clica aqui em atualizar sempre que for possível para você não perder nada caso o computador Desligue algo do tipo Essas são as cores primárias Então sempre que a gente pegar um título por exemplo vai vir com essa cor sempre que a gente pegar um botão vai vir com essa cor um texto vai vir com essa cor Mas a gente pode colocar mais cores aqui pra gente só buscarla também eu vou adicionar uma nova cor aqui eu vou colocar a cor branco que eu vou usar também branco

Ó posso mudar o nome aqui para branco e a cor eu vou colocar cor branca vou usar muito essa cor aqui de Cinza do blog que é uma cor que eu vou usar no rodapé Então vou adicionar a cor Vou colocar aqui cor cinza e vou colocar tá vendo é um cinza bem clarinho bem Sutil vou adicionar um nova cor e vou colocar verde claro do botão que vai ser esses verdes do botão aqui ó eu vou copiar essa primeira cor e vou pôr aqui na verdade ficou esse é o verde escuro vou mudar aqui

escuro e eu vou adicionar uma nova cor esse daqui vai ser o verde claro do botão que eu vou fazer um degradê lá em um dos botões aí vou pegar o código do verde claro e vou colar aqui pronto tem o verde do mapa que é esse verdinho mais claro ó tá vendo aqui é um tom de verde mais claro do que esse principal nosso vou deixar ele aqui também verde do mapa e vou clicar em atualizar Então eu tenho todas as cores que eu vou usar aqui já vou clicar nessa setinha aqui para eu

voltar e vou configurar as fontes globais a minha fonte primária vai ser essa daqui do título do corpo que vai ser tamanho 30 peso 500 e o nome da fonte é mon serrar então ó família ou nome da fonte a gente vem aqui digita o nome que a gente quer tem várias Fontes aqui que você pode ir pesquisando eu vou pegar essa chamada Monte serrar tamanho 30 peso 500 a maioria dos meus títulos ó esse título esse título a maioria deles vai ser esse por isso que eu sempre coloco a configuração que eu vou usar

na maioria dos títulos tá aqui do primário aqui do secundário eu vou colocar esse aqui que vai ser just tamanho 20 peso 400 então Ó a fonte vai chamar just tamanho 20 peso 400 vai ser o meu subtítulo vai ser fonte Monte serrar tamanho 15 peso 500 e o aqui dos botões eu deixei aqui também mon serrar 15 peso 500 é o mesmo 15 monr peso 500 é o que a gente vai usar n botões e links ele tem o nome real aqui mas eu vou mudar aqui para botões e tem outros textos que eu

vou deixar já configurado aqui então eu separei alguns aqui por exemplo o título do Banner esse seru nome desse tamanho que eu vou deixar de fonte monr tamanho peso 600 peso 600 que vai ser um que vai ser mais grosso ó tá vendo desse tamanho aí vou pegar aqui um subtítulo do ban que ele vai ser também fonte mon serr tamanho 18 peso 600 então você pode criar vários eu vou criar todos aqui mostro pra você os que eu criei pronto você quiser editar qualquer um é só clicar no lapizinho se quiser excluir é só

clicar aqui se quiser modificar o texto é só colocar aqui se quiser adicionar um novo do zero é só clicar em Adicionar novo estilo tá eu criei todos esses aqui porque aqui no layout ó tá vendo em cada lugar eu coloquei um tamanho diferente para ser adequar o layout que eu queria Então tem esse título tem esse daqui tem esses textinhos aqui que eu deixei maior tem esse aqui que eu deixei de um tamanho tem esse aqui que eu coloquei de outra outro tamanho então para agilizar eu já deixo tudo aqui para você mas lá

na hora você consegue trocar também e colocar a fonte que você quiser tá isso aqui é só para agilizar lá o nosso trabalho então ó vamos lá eu coloquei aqui no primário Monte serrar 30500 no secundário just 20 400 no texto Monte serrar 15500 ne botões Montserrat 15500 Lembrando que botões aqui é real eu que mudei o título para botões a aqui embaixo eu criei esses aqui personalizado título do Banner Montserrat 40600 subtítulo do Banner Montserrat 18600 título dos cards just 20 400 texto dos cards just 700 400 título dos dos currículos Mont serrar 18

500 título dos atendimentos Montserrat 21500 e texto dos atendimentos J 18 400 todas essas tipografias aqui vou clicar em atualizar Prontinho agora a gente vai criar o layout do nosso cabeçalho eu coloquei menu porque às vezes a gente chama de menu mas o menu são só os links tá esse layout aqui com logo Bá chama-se cabeçalho Então a gente vai criar o layout aqui do nosso cabeçalho e depois o o layout do nosso rodapé rodapé é essa parte aqui do final tá o layout do menu ou também chamar de cabeçalho e o rodapé a gente

faz uma vez só e ele fica fixo em todas as páginas então ó se eu acessar qualquer outra página o menu é o mesmo e o cabeçalho é o mesmo ok então é um modelo que a gente cria a parte a gente chama de modelo pra gente criar esse modelo a gente vai voltar lá pro painel administrativo do WordPress podemos clicar aqui no x que aí a gente já vai voltar para cá aí para criar um novo modelo aqui na aba de modelos a gente pode clicar aqui em Adicionar novo modelo aqui em cima ou

então aqui em modelos ó a gente clica em Adicionar novo modelo que a gente já vem pra página específica vamos clicar aqui vamos selecionar a opção de header header é a tradução de cabeçalho tá aí a gente vai vir vai dar um nome aqui pro nosso cabeçalho vou colocar menu principal também vou clicar aqui em criar modelo ele já vem com alguns modelinhos pronto se você quiser usar é só você clicar aqui em cima e clicar em inserir na página Eu não vou usar aqui no elementor e a a gente pode clicar em agora não

essa aqui é a nossa área de trabalho do elementor aqui nessa aba é a aba da biblioteca onde tem todos os widgets tá vendo Então aqui tem título imagem editor aí tudo que você quiser é só você arrastar para cá Sempre que você quiser editar Você vai clicar no lapizinho aí aqui na aba de conteúdo geralmente aparece o que você pode colocar de conteúdo Então se é um botão é onde você vai colocar o texto é onde você vai colocar o link tá sempre que você quiser editar a coisa você clica aqui no lapizinho se

você quiser excluir você pode clicar com o botão direito aí aparece a opção de excluir aparece também a opção de editar que aí vai abrir a abinha duplicar copiar colar de outro site Então sempre que você clicar com o botão direito aparecem as suas opções tá vou excluir este aqui é a b onde você vai pegar os contêiners contêiners são as sessões aqui que são divididas o site ó tá vendo Então aqui por exemplo essa primeira parte esse é um contêiner aí nesse contêiner a gente colocou imagem de fundo um título blá blá blá então

a gente sempre vai trabalhar clicando aqui e a gente escolhe o tipo de contêiner que a gente quer se você pegar um com setinha para baixo todos os itens vão ficar um abaixo do outro assim como esse tá vendo tem um título abaixo tem outro título abaixo tem os cards Se você pegar esse que tá com a setinha pro lado as coisas vão ficar um do lado da outra como menu que tem um do lado do outro tá uma vez que você pegou aqui não é definitivo você consegue vir aqui ó clicar nele e mudar

a direção ó aqui tá um do lado do outro aqui tá um abaixo do outro tá Então você consegue mudar por aqui também consegue excluir duplicar e tudo mais e outra coisa Sempre que eu disser para você contêiner principal clica no contêiner principal é para clicar aqui em cima na onde que tem essas seis bolinhas aqui em cima se eu disser para você contêiner interno vai ser assim ó por exemplo a gente pega esse daqui que tem vários contêiners ó tá vendo tem um contêiner interno então é aqui nesse quadradinho cinza que eu tô mandando

clicar contêiner principal é esse daqui contêiner interno esses daqui do quadradinho Ok e widgets são esses ó todos esses itens são chamados de widgets então eu falo assim clica no widget de menu exclui widget de menu faz o widget de tal coisa widget são esses itens e biblioteca é isso daqui você pode pesquisar também na lupinha ó se você quiser ou você pode fechar as abas ó tá vendo aba de site layout e fechando as abas para você ir pesquisando também beleza dada a introdução vamos lá clica no mais clica em flexbox pega um contêiner

com a setinha pro lado vem aqui na biblioteca pega o widget de site logo arrasta para cá clica aqui em publicar adicionar condição presta atenção nessa parte tá se você não fizer isso daqui o menu não aparece depois mais pra frente no tutorial eu volto nisso aqui porque muita gente pula essa parte mas ó tá vendo tem que estar aqui entry site se você publicar com ele em branco assim não vai aparecer no site então clica em adicionar condição salvar se você já tiver ó não tiver aparecendo mais a opção de publicar como é que

eu faço clica aqui na setinha clica em display condition vem para esse mesmo popup do mesmo jeito clica em adicionar condição tem que est entry site que significa que é para aparecer no site inteiro aí você clica aqui em salvar pronto aí tudo que a gente fizer aqui já vai começar a aparecer no site a logo aqui não está configurada pra gente configurar a gente vai clicar aqui em Change Side logo aí tá vendo aparece aqui logo do site a gente a gente vai clicar e vai arrastar Nossa logo para cá vou vir aqui na

minha pasta vou arrastar minha logo se você não tiver logo tem vídeo aqui no canal ensinando como criar logo tá Também depois eu vou fazer um vídeo ensinando como criar logo no canva clica aqui em selecionar pode clicar aqui no xizinho de fechar e clica em salvar pronto você voltou pra tela e a logo já está configurada você vai vir aqui no contêiner principal vai vir em avançado vai vir em preenchimento Quando eu disser pading que é a mesma coisa de prenchimento só que é escrito em inglês é no mesmo lugar tá eu posso falar

pading ou preenchimento ou margem ou margem tá É porque como a gente acostuma com os os comandos em inglês às vezes eu falo em inglês mas tá escrito em português aqui pading e preenchimento é a mesma coisa preenchimento é o espaço de dentro das coisas e margem é o espaço de fora das coisas então a gente vai colocar um pading aqui ou preenchimento de 20 pronto aqui a gente vai clicar na logo vai vir em avançado vai vir aqui em largura Vamos mudar para personalizado aí aqui em largura personalizada a gente vai deixar em porcentagem

tá vendo o ícone de o item de porcentagem aí a gente vai colocar 23% para ele ficar desse tamanho agora vamos voltar na biblioteca Vamos pegar esse item de WordPress menu ahastar aqui pro lado vamos voltar na biblioteca e vamos pegar o Idem de botão que fica aqui na parte básico a gente vai vir aqui em botão arrastar para cá pronto agora a gente vai configurar o layout né os tamanhos vamos clicar aqui em cima do nosso menu vamos vir em estilo aí sempre que você quiser modificar o tipo de fonte o tipo e o

tamanho da fonte é por aqui tá vendo que tem Esse mundinho ó se você clicar você consegue ter acesso a aqueles tamanhos de fontes que a gente configurou como padrão por isso que eu configurei aqui pra gente não precisar clicar aqui e digitar todos todas as vezes é só clicar no Mundinho e selecionar então eu vou selecionar a opção de botão que é o tamanho que escolhi para ser aqui do menu beleza a cor já tá configurada essa cor aqui que eu quero mesmo e a cor Rover também já tá configurada que é aquela cor

azul se você quiser mudar a cor do Hover que é a ação de passar o mouse você clica aqui em Hover E aí você muda ó a cor do texto e a cor do Pointer o Pointer é esse tracinho que aparece aqui embaixo se você quiser mudar o Pointer você vem aqui em conteúdo aí vai ter aqui ó Pointer aí tem underline que é esse tracinho tem overline que é um tracinho em cima tem Double Line que é duas linhas tem framer que é esse daqui quadrado tem o background que é só a cor de

fundo e tem também só o texto que é o que eu vou deixar aliás eu não vou deixar nem o texto porque o texto mesmo ele faz essa animação tá vendo qualquer um dos pointers que você escolher vai ter várias animações que você pode escolher por exemplo essa do texto tem essa de grow tem essa daqui de clicar a de Underline ó ó vai ter a de Fight que aparecer vai ter a de slide que aparecer do lado tá então seja qual for o Poter que você escolher vai ter vários tipos de animações para acionar

quando a gente passar o mouse eu vou deixar n ou seja nenhum que é só para mudar de cor quando a gente passar o mouse Tá ok essa daqui é a configuração de Dropbox Dropbox é isso aqui ó ah quando você quiser fechar para você ver a tela limpa você clica nessa setinha Se quiser abrir clica nela de novo tá ó Dropbox é isso aqui quando você passa o mouse e fica com esse menu suspenso E aí você consegue configurar ele aqui consegue configurar ele normal que é desse jeito Hover que é ação de passar

o mouser e ativo que é quando você tá por exemplo nessa aba aqui eu vou configurar a aba de Rover a cor do texto eu vou deixar de branco e a cor de background eu vou pegar essa azul primária ó e aí vai ficar assim a do normal a cor do texto eu vou deixar esse cinza aqui do secundário e na ativa eu vou deixar padrão Beleza agora aqui no meu botão eu vou clicar em cima dele ó sempre que quiser clicar lembra clica no lapizinho tô dando essas instruções só aqui no início mas depois

vai ser mais rápido então presta atenção tá que nas próximas vezes no restante do layout eu não vou dar tantas instruções assim eu vou só falar clica aqui faz assim clica aqui faz assim então presta atenção no mecanismo clica aqui no lápis no texto eu vou escrever agendar consulta igual tá escrito aqui aqui em texto eu vou colar o que eu quero e aqui no link você pode colocar o link do WhatsApp pode colocar um link que vai pra página de contato vou deixar sem link aqui por enquanto mas é só você copiar o link

e colocar aqui tá aqui em estilo eu determinar a cor eu quero fazer um degradê Então vou colocar assim ó Gradiente um degradê é a junção de duas cores tá vendo que aqui eu tenho uma cor mais escura e uma mais clara então eu vou fazer isso nessa cor de cima eu vou colocar cor de azul mais escuro né azul ou verde mais escuro e nessa cor secundária eu vou pegar esse aqui do Realce que é o mais claro e aí eu vou mudar o ângulo ó que eu quero que a cor fique de um

lado e do outro aqui tá em cima e embaixo Então é só arrastar para cá até ficar no ângulo que eu quero pronto o raio da borda que é o arredondamento eu vou deixar de 30 porque eu quero que ele fique bem arredondado e aqui o tamanho ó a tipografia eu vou pegar essa tipografia aqui de botão aqui em conteúdo eu vou colocar um ícone vou clicar aqui na aba de ícones e vou pegar o ícone do WhatsApp vou clicar aqui em inserir e vou clicar em posição do ícone e vou deixar aqui no fim

que para ele aparecer na frente sempre que você fizer alguma alteração é bom ir clicando em atualizar tá para não perder nada se acontecer alguma coisa percebi que eu errei aqui na fonte desse botão vou vir aqui estilo e vou consertar a tipografia não é essa daqui que eu tinha colocado Monte serrar é a fonte just ela fica Menorzinha um pouco peso 400 beleza e eu vou colocar uma ação de passar o mouse vou clicar nele vou clicar aqui em ao passar o mouse vou vir aqui em animação e vou colocar grow que é dessa

forma quando a gente passar o mouse ele vai aumentar aí vou voltar aqui no menu vou vir aqui em estilo em pading horizontal que é o espaço um do lado do outro ó vou diminuir para não ter quebra de linha e o espaço vertical eu vou diminuir também ó vou deixar zero aí eu vou vir aqui no contêiner principal V vou vir aqui em layout vou vir aqui em alinhar itens e vou deixar todos alinhados ao centro pronto vou clicar em atualizar ainda aqui no contêiner principal vou vir em estilo cor de fundo Ó tipo

de plan de fundo e a cor eu vou deixar de branco vou clicar em atualizar vou vir em avançado efeito de movimento aqui no Stick eu vou deixar top e vou clicar em atualizar esse top é para fazer o menu ficar fixo tá vendo que conforme eu vou rolando a tela ele vai ficando aqui em cima Então esse efeito aqui é para isso já fizemos aqui a versão do computador e agora a gente vai fazer a versão do mobile ou seja do celular para configurar para dispositivos móveis a gente vai clicar aqui em cima desse

ícone de modo responsivo clica aí aqui em cima aparece telefone computador e tablet a gente tá vendo no modo de computador se quiser ver como que fica no telefone é assim e no modo de tablet é assim tudo que você alterar em um não modifica no outro desde que você não mude de lugar arrastando e nem exclua se você mudar só tamanhos cores etc não vai mudar não ok a gente vai fazer o seguinte esse botão eu não vou deixar ele aparecendo no celular então vou clicar em cima dele vou clicar em avançado vou vir

aqui em responsivo e vou ocultar ele de dispositivos móveis Ou seja no celular então ó quando eu fecho aqui eu consigo ver exatamente como vai ficar no dispositivo ó ele some ele aparece cinza assim para mim mostrando que ele tá oculto isso é normal não é para excluir ele não tá É só para ocultar aqui beleza aí aqui vou vir na logo vou vir em avançado vou mudar para porcentagem e vou colocar aqui 80% de espaço vou vir aqui no menu vou vir em avançado em largura eu vou mudar para personalizado em largura personalizado vou

mudar para porcentagem e vou colocar 13% de espaço vou vir aqui no contêiner principal vou vir em layout vou vir aqui em alinhar os itens justificar conteúdo e vou deixar todos alinhados ao centro vou vir aqui no menu vou vir em conteúdo eu preciso fazer uma configuração para ele não ficar quebrando a tela ó que até então se eu clicar olha como que ele fica para ele poder aparecer na tela toda eu preciso ativar essa opção aqui full widget Então vou ativar E aí ele aparece normal ó não estraga a tela pronto vou clicar em

atualizar e agora já está configurado o nosso menu aqui pro celular pro tablet também a mesma forma aqui a gente vai vir nesse contêiner vai deixar aqui os itens alinhados ao centro e alinhados ao centro aqui também vamos ir aqui no menu Vamos ir aqui em Break Point e vamos deixar dispositivos móveis Vamos ir aqui em estilo horizontal pading Vamos diminuir e vamos ir aqui no botão virem responsvel e ocultar pra tablet também aí vamos ir aqui na logo larg personalizada mudar para porcentagem e aumentar o tamanho da porcentagem aí a gente tem que ir

ajustando ó dependendo do tamanho da da sua logo ela vai precisar ficar menor ou maior e também vamos ir aqui neste menu vamos clicar vamos vir aqui em tipografia e diminuir um pouco o tamanho dele para não ficar quebrando muito a linha ó também vou voltar aqui no menu aqui em horizontal pading vou diminuir um pouco pronto de modo que não fique quebrando aqui a linha pronto ó percebo aqui no computador continua do mesmo jeito no celular continuou e no tablet continuou então desde que você não exclua arraste nada todas as configurações que você fizer

em um não altera no outro feito todas clicamos em atualizar agora nós vamos criar o layout do rodapé para fazer o rodapé Vamos acessar aqui o painel administrativo do de press vamos vir em modelo Adicionar novo escolher a opção de roda pé Pode ser que seja escrito footer em inglês aí no seu você vai dar um nome pro modelo eu vou escrever rodap pé mesmo e vou clicar em criar modelo vou clicar no x agora nós vamos criar clica no mais clica em flexbox pega um contêiner com a setinha pro lado vamos vir aqui na

biblioteca vamos pegar o edit de contêiner e vamos arrastar ele para cá a gente vai clicar com o botão direito clicar em duplicar clicar com o botão de direito clicar em duplicar novamente vamos ir aqui no contêiner principal que é esse aqui de cima vamos ir aqui em largura do contêiner e deixar na opção de grade vamos vir aqui em colunas vamos deixar três colunas e em linhas a gente vai deixar uma linha aqui espaçamento a gente vai deixar 30 de espaçamento e vamos vir aqui em avançado e no preenchimento que é o espaço de

dentro ó é o espaço de dentro desse contêiner principal a gente vai colocar 50 e vamos clicar em publicar adicionar condição vai deixar assim todo o site ou então entry site se tiver em inglês no seu e vai clicar em salvar pronto se por acaso você tiver salvado e não tiver aparecendo lá no site lembre-se que é só você clicar aqui nesse triângulo vem em exibir condições ó se tiver assim no seu é só você clicar em adicionar condições e depois em salvar Ok ainda nesse container principal vou vir em estilo tipo de fundo cor

vou pegar essa cor cinza atualizar vou vir aqui na biblioteca vou pegar o edit de logo do site colocar aqui dentro desse contêiner vou vir na biblioteca vou pegar um Edit de título arrastar para cá já vou aproveitar que eu tô aqui no site vou copiar esse título que eu deixei aqui vou colar vou vir em estilo deixar ele alinhado ao centro vou clicar aqui no mundinho da cor vou pegar esse sim é mais escuro vou vir em tipografia vou pegar esse secundário e agora a gente vai fazer esse mini menu verdade eu até tinha

colocado mais um aqui que é o de contato ó a gente vai fazer como se fosse o menu lá de cima para isso a gente vai vir aqui e vai pegar uma lista de ícone arrastou Aqui para baixo vamos excluir deixar só o primeiro a gente vai clicar clicar aqui para excluir o ícone Tá vendo porque eu quero ficar só com texto aí aqui a gente vai fazer as nossas linkagem eu vou deixar como menu de cima então vou deixar início vou duplicar nesse aqui eu vou colocar especialidades vou duplicar nesse aqui eu vou colocar

blog duplicar e nesse último eu vou colocar contato não é para colocar todos os de cima tá Não há necessidade pode colocar só as páginas principais porque contato a gente já vai ter aqui nas outras abinhas não precisa colocar outras informações para não ficar muito poluído coloca só as principais aqui do site aí pra gente poder colocar os links tá vendo que em cada aba aqui tem essa opção de link é só você colocar por aqui como isso daqui que a gente tá colocando são páginas a gente pode escrever ó começa a escrever início por

exemplo que já aparece a página para você puxar aí você clica aqui se não tiver aparecendo você pode vir aqui em cima ó Clica com o botão direito copiar endereço do link e aí você clica aqui e clica em colar aí agora é só linkar todos pronto vamos clicar em atualizar vamos vir aqui em cima e deixar eles em linha Vamos ir aqui em estilo Vamos ir aqui e colocar um divisor ó vamos ativar aí vai ficar um pequeno divisor aqui consegue ver e aqui em peso do divisor vamos deixar dois a cor a gente

pode deixar esse cinza mesmo e a cor aqui dos itens a gente vai deixar com aquele verde né então a gente vai vir aqui em estilo Vamos ir em texto aqui na cor do texto vamos deixar essa cor primária que é desse Verde ao passar o mouse a gente vai mudar para esse azul então ó quando a gente passar o mouse vai ficar assim vou vir aqui na tipografia vou aumentar o peso para 600 el vai ficar desta forma pronto aqui nessa outra parte eu já vou copiar esse título para eu usar ali vou vir

aqui na biblioteca arrastar um Edit de título para para cá já vou colar o título aqui virei estilo alinhamento vou vir aqui na tipografia vou deixar este subtítulo esse título do atendimento vou só deixar peso 600 para ele ficar um pouco mais grosso Pronto agora eu vou vir aqui vou pegar uma caixa de ícone arrastar para cá aí aqui eu vou copiar o texto ó vou deixar aqui por exemplo WhatsApp de atendimento e aqui eu vou copiar o telefone né do WhatsApp vou colocar aqui a intenção é deixar o contrário né o textinho em cima

menor e o número do WhatsApp maior também o botão do WhatsApp o ícone do WhatsApp quer dizer eu vou clicar aqui em cima vou procurar o ícone do WhatsApp o ícone do WhatsApp eu vou usar um diferente do que tem no elementor Tá vendo porque esse aqui que eu usei ele é mais fininho achei que fica mais bonito se você quiser pode vir aqui e pesquisar o do pró elementor mesmo tá ó só que como eu quero que fica o layout mais clean eu vou usar esse meu só você clicar em enviar arquivo sbg clica

em ativar E aí vai ter todos os ícones que eu estou usando aqui ó na pasta de ícones você pode arrastá-los todos de uma vez para cá já que a gente vai usar bastante Depois disso você clica em inserir mídia pronto se o seu não tiver aparecendo aqui calma clica em atualizar que às vezes a gente como a gente colocou vários você clica Tá aparecendo só um aqui né Tudo bem você clica para recarregar a página é quando você for olhar já vai estar todos disponíveis ó tá vendo aí você seleciona o que você quer

Beleza agora vamos vir aqui no estilo a posição do ícone nós vamos deixar na esquerda alinhamento vertical vamos deixar no meio o tamanho do ícone a gente vai deixar tamanho 39 é para ele ficar grandinho assim mesmo aqui no título a gente a gente vai pegar este secundário aqui em conteúdo no título a gente vai deixar este secundário E na descrição a gente vai vir aqui embaixo Vamos pegar esse título do atendimento e vai ficar assim aí a cor aqui da descrição a gente vai deixar esse azul e no de cima a cor a gente

vai deixar aquela cor secundária que é a cor mais cinza vamos voltar aqui na Caixa em espaço do conteúdo a gente vai diminuir vou clicar com o botão de direito clicar em duplicar e eu vou pegar esses dados que estão aqui né pedindo para seguir a pessoa no Instagram aí aqui no título vou substituir e vou substituir aqui embaixo o @ do Instagram Lembrando que esses telefones e-mail e tudo mais que eu coloco aqui é fício Tá pessoal aí no seu você vai colocar obviamente o seu real tá E para colocar o link tanto aqui

quanto aqui tem aqui ó escrito link aí você vai colar o link aqui na caixinha eu vou deixar o link do meu Instagram só para poder deixar linkada aqui para você ver ó Ok clique em atualizar agora a gente vai clicar com o botão direito clicar em duplicar arrastar para cá vamos fazer essa segunda parte de onde estamos colar aqui clica no botão direito copiar clique botão direito colar aí agora a gente vai colocar o endereço eu sempre coloco o endereço do Shopping aqui da minha cidade só para ter o endereço real aqui pra gente

exemp ficar então eu vou colar aqui nessa parte de cima e aqui nessa parte de baixo eu vou escrever ver no mapa aí nesse caso aqui eu vou vir em estilo e vou colocar superior pro ícone ficar na parte de cima aí vou voltar na parte de conteúdo vou vir em enviar arquivo svg e vou pegar o ícone de mapa que é esse aqui vou clicar em inserir mídia ele vai ficar assim aí vou voltar aqui estilo conteúdo aqui na descrição eu vou vir em tipografia vou vir em decoração vou deixar sublinhado pra pessoa entender

que é para passar o mouse para clicar aqui nesse título vou clicar nele vou vir em estilo vou diminuir um pouco ó vai ficar assim Beleza vou clicar em atualizar agora clic em mais pega um contêiner com a setinha para baixo vem aqui em avançado Vamos colocar 20 de pading desencar os valores de pading aqui no inferior que é o de baixo a gente vai colocar 50 vamos clicar quer atualizar vira em estilo tipo de plano de fundo aqui no mundinho a gente vai pegar essa cor cinza clicar em atualizar Vamos ir nesse contêiner aqui

de cima vamos ir em avançado desenc os valores aqui de pading e no inferior a gente vai deixar 20 Vamos ir na biblioteca vamos pegar um idit de divisor pra gente fazer aquela linha Coloca nesse contêiner de baixo vou vir em estilo a cor eu vou deixar essa cor verde peso eu vou deixar cinco e espaçamento eu vou deixar dois clicar em atualizar agora eu vou voltar nesse item aqui vou vir em avançado largura personalizada vou deixar 100% vou vir aqui vou pegar o edit de título arrastar Aqui para baixo tem que ficar do lado

de cá vou vir aqui nesse contêiner vir em layout deixar aqui envolver para quebrar a linha vou clicar nesse vou copiar esse texto que eu tenho aqui que é o texto pra copyright e vou colar ele aqui vou duplicar esse texto vou copiar aqui o de políticas de privacidade que a gente vai linkar com a nossa página de política e privacidade importante ter no site tá eu vou colar aqui vou clicar nesse vira em estilo na cor eu vou colocar essa cor cinza do texto em tipografia eu vou pegar essa tipografia de texto vou clicar

com o botão direito copiar clicar com o botão direito colar o estilo esse aqui eu vou deixar alinhado pra esquerda e esse aqui eu vou deixar alinhado pra direita vou clicar nesse contêiner principal e vou deixar todos aqui espaço entre tá vendo para um ficar de um lado e o outro do outro nesse aqui que tem políticas de privacidade a gente vai clicar nele vem conteúdo aqui em link a gente vai linkar a nossa página de políticas de privacidade e vai clicar em atualizar agora a gente vai clicar nesse contêiner vai vir em estilo vamos

vir em borda tipo de borda Vamos colocar uma borda sólida clica ó tá vendo largura da borda clica aqui para assumir tudo e só aqui no inferior no de baixo a gente vai deixar pode ser seis e a cor vai ser essa cor verde vamos clicar em atualizar aliás eu acho que eu deixei maior lá do outro site Então vamos deixar um pouco maior pode ser uns 12 pronto que aí fica uma um acabamento aqui embaixo beleza Fizemos a parte de computador do nosso rodapé agora vamos modificar pros dispositivos móveis clica aqui coloca aqui no

modo de telefone ó ele já vai mais ou menos configurado tudo que a gente precisa Só fazemos alguns ajustes clica nesse contêiner avançado vamos deixar 20 de preenchimento esse aqui a gente vai clicar vai vir em estilo vai deixar alinhada ao centro aqui tá tudo ok aqui a gente vai clicar vai deixar alinhado ao centro clica nesse Deixa alinhado ao centro também vamos clicar aqui nesse contêiner vir em layout vamos deixar aqui alinhados ao centro aqui na essa parte pronto e clique em atualizar Aí você coloca aqui também no tablet para dar uma ajustada ver

como é que ficou aqui no caso do tablet a gente vai vir nesse contêiner principal vai vir em layout e vamos deixar duas colunas e duas linhas que aí fica assim né fica melhor dividido dessa maneira e vamos clicar em atualizar pronto nosso rodapé está pronto agora vamos para a criação do layout da primeira página página início para criar o layout da página a gente tem duas opções para conseguir chegar no editor do elementor uma é você clica aqui né na página que você quer clica aqui em editar página e depois clica aqui em editar

com elementor outro caminho que você consegue fazer também é vir aqui em páginas todas as páginas e passar o mouse em cima da página que você quer e clicar em editar isso só a primeira vez que você for fazer edição na página e aí você clica em editar com elementor depois que você já tiver aberta a página com elementor alguma vez já vai ficar clicável aqui para você então você pode só clicar aqui em cima de elementor e já vai abrir beleza vamos clicar aqui na engrenagem em configurações vamos aqui em layout da página selecionar

elementor largura total para assumir aquele título da página e a página fica toda em branco pra gente Criar e vamos começar a criar o nosso layout primeiro a gente vai fazer esse banner né já vou até copiar esse título aqui clica aqui clica em flexbox pega esse flexbox aqui que tem duas dentro vamos vir aqui em avançado colocar 50 de pading ou preenchimento Vamos ir em layout em altura mínima vamos deixar 650 de altura Vamos ir em estilo tipo de fundo plano de fundo clica aqui em imagem e arrasta uma imagem para cá eu já

tinha subido aqui mas não tava gravando ó clica no banner que você arrastou para cá clica em selecionar vem aqui em tamanho de exibição vamos deixar cobertura vem aqui em posição vamos deixar centro ao centro vamos ir na biblioteca arrastar um Edit de título para cá aí você vai pegar o seu título principal E vai colar ou escrever aqui Clica com botão direito duplicar vou copiar esse subtítulo e vou clicar aqui colar vou clicar aqui nesse título principal vi estilo a cor é essa cor primária azul mesmo a tipografia essa tipografia de título do Banner

que a gente tinha configurado aqui nesse subtítulo vou vir em estilo na cor eu vou deixar esse cinza que é a cor secundária que a gente tinha configurado e na tipografia vou deixar título do Banner que a gente tinha configurado no início e vou clicar em atualizar agora pra gente fazer esse botão a gente vai vir na biblioteca vai pegar o wiet de botão arrastar para cá aí a gente vai vir aqui em texto e vamos escrever assim ó agendar consult vou vir aqui no ícone vou procurar o ícone de WhatsApp isso só se a

consulta for agendada vi WhatsApp se não for não precisa colocar tá bom vou clicar aqui para colocar o ícone no fim depois do texto vou vir aqui em estilo vou vir aqui em raio da borda vou deixar 30 pra gente deixar arredondado vou vir aqui em tipo de PL de fundo e vou deixar desse tipo aqui Gradiente aqui na cor do texto eu vou deixar de branco e essas duas cores aqui são as cores do Gradiente que é as duas cores que tá formando o fundo essa primeira cor eu vou pegar esse verde e na

segunda cor eu vou pegar esse azul aí eu vou vir aqui em ângulo e vou mudar o ângulo pro Verde ficar de cá e o azul de cá Pronto agora a gente vai vir aqui vai criar uma sombra no botão para ele ficar um pouco mais destque tá vendo vamos clicar em sombra da caixa aí quando você clica ele já cria uma sombra automaticamente só que a gente vai suavizar essa sombra para ela ficar um pouco mais bonita mais Sutil vamos vir arrastar um pouquinho dessa cor para ficar um tom de cinza mais Sutil e

vamos ir aqui em vertical e colocar um pouco para baixo ó para ficar uma sombra mais aqui na parte de baixo clica aqui de novo e Vamos diminuir um pouquinho mais a in idade dessa sombra pronto ficou assim vamos ir aqui na tipografia e Vamos aumentar um pouquinho o tamanho ó vou deixar tamanho 17 pronto vou clicar em atualizar vou vir aqui no contêiner principal vou vir em layout e vou deixar alinhada ao centro vou clicar em atualizar aqui no botão vou vir aqui em ação ao passar o mouse ó tá vendo ao passar o

mouse e vou deixar animação como grow para fazer esse efeito de quando passar o mouse ele crescer atualizar de novo agora vamos para essa parte aqui das especialidades já vou ciar esse título vou vir aqui pegar um Flexx com a seta para baixo vou vir em avançado vou colocar de preenchimento vou aqui na biblioteca arrar um Edit de título já vou colar esse título aqui vou vir em estilo vou deixar ele centralizado vou vir na cor já já vou deixar essa cor azul a tipografia vou deixar esse primário mesmo aí agora eu vou copiar esse

texto que tem aqui vou pegar uma lista de ícone arrastar Aqui para baixo Vou deixar só um vou copiar o texto que eu tenho aqui e no ícone eu vou enviar um ícone svg que é este aqui de estrela que eu já deixei para vocês baixarem lá na biblioteca vou vir aqui no estilo vou deixar alinhado ao centro vou vir aqui em texto a tipografia para pegar essa tipografia de texto vou clicar em atualizar aí agora a gente vai fazer esses cards para eles a gente vai vir na biblioteca vai pegar no Edit de grade

Vamos colocar aqui vamos ir na biblioteca e vamos pegar o ID de CTA ou chamada para ação ó é esse aqui vou fazer Nesse estilo Mas você pode fazer diferente se você quiser pode dar uma tá ver todas as opções que ele tem por aqui tá aqui em imagem eu vou clicar na lixeira para não ter nenhuma imagem vou copiar o título vou vir em conteúdo aí vou colar aqui o título vou copiar a descrição e vou colocar aqui na descrição E aqui onde tem texto do botão vou deixar saiba mais mais pro final a

gente vai voltar aqui linkando cada um deles tá e aqui em Elementor eu vou clicar em ícone e eu vou colocar aqui os ícones correspondentes a cada um deles ó vou clicar em enviar arquivo svg E aí eu vou colocando os ícones eu peguei esses ícones no site que chama flat icon ele tem ícones gratuitos e ícones pagos os ícones gratuitos ficam aqui ó na parte de free ícones aí você consegue clicar você consegue pegar geralmente não tem ícones que já vem coloridos como esse daqui mas Mas não tem problema se você pegar um ícone

que seja preto e branco Ó você vai baixar ele em svg como esse aqui por exemplo ó ele é um preto né Aí você vem aqui em estilo elementor gráfico e aí você consegue mudar a cor do ícone tá então você pode pegar um ícone Preto lá que você consegue mudar ele aqui também facilmente eu peguei esses daqui que já estavam coloridos porque eu achei bonitinho que eles estão com a cor Gradiente né mas aí você vai lá e pega os que são de acordo com cada tema que você estiver colocando Beleza você vai primeiro

fazer assim colocar o ícone e o título a descrição e aqui escrito no botão e aí você vai clicar com o botão direito e duplicar Até chegar na quantidade que você quer aqui a gente tem 3 6 9 Então você vai duplicando até chegar na quantidade que você quer aí você vem aqui nesse contêiner de dentro e ajusta aqui eu tenho tenho três colunas e tenho três linhas aqui só tava configurado dois então ten que mudar para três três linhas para ficar certinho se você tiver só seis por exemplo aí você vai usar só duas

linhas tá você vai configurando aqui se você quiser mudar também ó por exemplo Deixar quatro por por linha também apenas duas linhas tem como se você quiser deixar quatro linhas quiser colocar mais por linhas tem como também você coloca aí do jeito que você quiser eu vou colocar três por linhas e três linhas e três colunas aí feito isso agora você vai ir em todos e vai mudar os títulos escrever colocar os títulos ó então é sempre aqui em conteúdo você vai mudar o título vai mudar a descrição e vai mudar o ícone Então faça

isso em todos sempre clicando em atualizar pronto depois que você tiver colocado o ícon os textos em todos vamos configurar o layout clica nele nemum desses vem aqui em elementor gráfico aí a gente vai mudar aqui o visualizar para em moldurado para ficar esse círculo aqui em espaçamento a gente vai deixar tamanho 15 mais ou menos ó de espaçamento entre o texto e o ícone aqui no tamanho do ícone vamos deixar 32 preenchimento vamos deixar mais ou menos tamanho 16 e a largura da borda vamos deixar um ok o arredondamento aqui não precisa aí agora

vamos ir aqui em conteúdo é aqui que a gente vai configurar o título e o texto aqui na tipografia do título a gente já deixou configurado né tá aqui ó título dos cards a gente vai pegar ele e a descrição a gente já configurou também está aqui ó texto dos cards Pronto agora vamos configurar a cor Ah faltou uma coisa aqui no Elementor gráfico Ah já tá configurado já a gente já deixou o azul aqui beleza aí que agora conteúdo agora a cor do título a gente vai deixar de cinza e a cor da descrição

também a gente vai deixar de cinza e a cor do botão a gente vai deixar com esse Verde OK aí agora a gente vai vir aqui em botão vamos deixar o arredondamento de 30 e vamos ir aqui em avançado Vamos ir aqui em plano de fundo clicar e vamos pegar a cor branca Ah tá vamos voltar aqui no estilo conteúdo e aqui na cor de fundo vamos deixar branco também Pronto agora vamos vir aqui em efeito ao passar o mouse vamos clicar aqui em Rover e a cor da sobreposição vai ser esse primário que é

esse tom de verde e no normal a gente vai deixar branco e vamos voltar aqui em conteúdo vamos clicar aqui em Hover Hover é a ação de passar o mouse bem aí Vamos colocar a cor de fundo a gente vai deixar essa primário a cor do título vamos deixar de branco cor da descrição também vamos deixar de branco e a cor do botão também vamos deixar de branco aí vai ficar assim aí vamos voltar aqui no efeito ao passar o mouse Vamos mudar aqui a animação ao passar o mouse vamos deixar não animação de passar

o mouse para ficar assim quando a gente passar ele ter essa transição eu esqueci de ativar uma coisa aqui que é aqui ó aqui na aba de conteúdo em Skin a gente vai mudar pra capa e aí vai ficar assim aí a gente volta lá no estilo efeito a passar o mouse aí se você quiser você pode deixar com esse efeito Ó tem vários efeitos aqui tem esse de crescer tem o de slide tá vendo tem ó vai crescendo gradualmente tem vários Vários vários eu vou deixar nenhum que eu quero que faça o efeito só

na cor e aqui você muda o tempo de transição vou deixar 1500 também que eu acredito que seja um tempo legal Ok beleza configurou isso agora vamos configurar a sombra clica aqui vem aqui em avançado borda arredondamento vamos deixar 10 vamos ativar a cor eu vou colocar esse código aqui ó vou até pôr no bloco de notas para você anotar com essa cor que ficou um tom de verde ficou um tom de verde tá aí aqui eu vou deixar 0 18 e CCO ó que aí ficou mais espalhado ficou assim vou clicar com o botão

direito copiar clicar com o botão direito colar o estilo Aí você faz isso em todos os outros clica aqui em atualizar vamos recarregar a nossa página Você viu que eu tinha colado e não tinha colado todos os efeitos é um bug que deu um errinho mas aí a gente recarregou a página e ele aplicou aqui o que deveria aplicar né ó agora a gente vai fazer a correção que tá vendo que uns que estão um pouco mais altos do que os outros olha aqui por exemplo quando é maior do que esse ele tá com essa

faixa branca aí esses que estão maiores a gente vai corrigir e a gente corrige isso aqui ó clica vem aqui estilo aí aqui vai ter altura aí Aqui você pode ir aumentando colocar não sei se foi 365 que eu tinha colocado ou menos ó col fiquei 357 de altura nesse aí nesse aqui vamos ver 357 funcionou vou copiar clicar com o botão direito colar o estilo nesse funcionou também esse aqui também esse aqui também esse aqui também Funcionou o tamanho então 357 é um bom tamanho pra gente colocar de altura combinado ficou assim esse contêiner

agora a gente vai vir para essa sessão de sobre vamos clicar pegar um contêiner tenha dois vamos ir em avançado Vamos colocar 50 de pading atualizar vir aqui em estilo tipo de fundo vamos pegar essa cor cinza clicar em atualizar vou copiar o título vou vir aqui na biblioteca arrastar um título para cá vou colar ele vi na biblioteca arrastar um Edit de texto vou copiar esse texto vou colar ele aqui os que no seu é não tiver né porque se você tiver escrevendo a primeira vez não vai estar assim todo configurado Tá vendo quando

eu quero colocar em [ __ ] é só você selecionar a palavra e clicar aqui no Bezinho que ele vai colocando em [ __ ] clico aqui em atualizar aí agora eu vou pegar essa imagem ó vem aqui na biblioteca arrasta um Edit de imagem para cá vou deixar a resolução incompleto vou clicar em cima vou arrastar a imagem que eu fiz cá também fiz essa imagem no canva ó arrastei para cá vou clicar aqui em selecionar pronto vou clicar nesser aqui em layout dear alinhada ao centro clicar em atualizar Pronto agora vamos pegar fazer

esse tracinho a gente vai vir na biblioteca vai pegar o edit de divisor arrasta para cá vamos diminuir a largura dele ó deixar bem pequeno vou vir aqui em estilo vou aumentar a largura dele para dois vou vir aqui na cor vou pegar essa cor que a gente tem aqui e vou vir em espaçamento e vou deixar zero e vou clicar em atualizar aí vai ficar assim agora vamos para esse aqui que é a parte de currículo este aqui é diferente vamos clicar aqui com botão Flex Box pegar um contêiner com a setinha para baixo

vem aqui avançado coloca 50 de pading desvincula ó quando a gente clica aqui a gente consegue desinc e alterar separadamente aí aqui no superior a gente vai deixar zero e no inferior vamos deixar 30 agora vamos vir aqui vamos pegar um contêiner colocar ele aqui no contêiner principal que é esse Rosa aqui de cima a gente vai vir em estilo tipografia e vamos colocar a cor de fundo verde nesse interno que é esse quadradinho cins a gente vai clicar vai vir em estilo cor de fundo e vamos pegar a cor branca Aí clica em atualizar

agora vamos configurar isso daqui copia o título vem na biblioteca arrasta um Edit deo para cá Cola vem estilo deixa Centralizado vem aqui na biblioteca pega um widget de lista de ícone coloca aqui aí vou excluir todos vou deixar esse Primeiro vou colar aqui esse título CRM vou vir aqui em enviar arquivo svg vou colocar esse widget de estrela aí eu vou duplicar copiar os outros que eu tenho aí você vai colocando aí a sua graduação as suas habilidades aí nesse aqui eu vou excluir o ícone porque eu não quero quero que tenha só os

textos mesmo você vai só copiando os textos e colando aqui ó duplica abre copia lá e cola e aí nesse último eu vou colocar o ícone vou clicar aqui em cima mesmo e vou procurar oone de Plus que é esse para ficar mais de 800 clientes atendidos né Aí você coloca a sua quantidade Vamos ir aqui no estilo espaçamento entre Vamos aumentar Vamos ir aqui no texto tipografia aí tem aqui ó texto dos currículos vou vir aqui nesse título vou vir em tipografia tem aqui ó título não esse título aqui já é o mesmo então

não precisa mudar beleza vamos vir aqui aqui vamos ir em avançado 40 mesmo de pading a gente vai vir no contêiner principal Vamos ir em layout Vamos diminuir ele ficar mais estreito não 700 e pouco pronto sempre atualizando né para não perder nada Vamos ir nesse contêiner interno Vamos ir n estilo borda Vamos colocar 10 de arredondamento vamos vir aqui em sombra vamos diminuir um pouquinho a cor dessa sombra e aqui em vertical a gente vai aumentar ó para ficar um pouquinho destacada para baixo a sombra Vamos diminuir um pouco mais a opacidade ficou assim

aí a gente vai vir aqui neste contêiner vai vir em avançado desencar ó clica aqui para desencar os valores de Margem e vamos colocar menos 67 agora nesse contêiner aqui a gente vai clicar vai vir em avançado desencar os valores de Margem aqui no inferior a gente vai mudar para 150 ó para ficar com esse espaço e vamos clicar em atualizar Pronto agora vamos fazer essa parte do atendimento clica pega um contêiner com a setinha para baixo vem em estilo tipo de plano de fundo cor a gente vai deixar o mesmo verde do de cima

clia em vamos em avançado Vamos colocar 50 de pading desenca aí no de cima pode deixar 40 atualiza vamos pegar este contêiner copiar clicar com o botão direito colar aí a gente vai clicar nele vai vir em avançado Vamos tirar essa margem negativa que a gente colocou aí aqui no título a gente vai copiar esse título que tá aqui Vai colar ele e esse de baixo a gente pode excluir aí vamos vir aqui na biblioteca vamos pegar um Edit de grade colocar aqui vamos voltar na biblioteca e pegar uma caixa de ícone é essa arrasta

para cá ó tem que tá dentro da grade se tiver difícil clica em copiar com botão direito clica aqui dentro clica em colar que ele Cola aí você exclui aquele que tá ali em cima pronto aí você duplica ó coloca Quantos você vai usar eu vou usar apenas quatro então coloquei os quatro aqui vou clicar nesse nessa grade né nesse contêiner interno e vou modificar quero que ficar com duas colunas e duas linhas aí agora vamos configurar né primeiro Vamos colocar o texto Então eu vou pegar o texto de cada um ó esse primeiro eu

vou clicar aí aqui em título eu vou substituir pelo título e vou copiar a descrição e vou vir aqui em e vou substituir e aqui no ícone eu vou enviar um arquivo svg que vai ser um ícone personalizado e vou colocar o ícone de cada um esses ícones eu também peguei no flat icon Então esse aqui vai ser esse de calendário calendário não de hora né ser esse de hora aí nesse daqui eu vou pegar os textos e substituir esse vai ser esse de calendário Vou deixar tudo aí para vocês aí no seu caso você

tem que colocar um que se adapte aí com o que você for colocar aqui de texto né pode adaptar aqui pro seu estilo de negócio e se você achar que não combinou esse ícone você pode ir lá no site do flatcon e copiar outro ícone baixar outro ícone Pronto agora vamos clicar nesse Primeiro vamos ir em estilo posição do ícone vamos deixar na esquerda alinhamento vamos dear vertical espaço entre o ícone Vamos aumentar um pouco aí vamos vir aqui em avançado plano de fundo tipo de fundo Vamos deixar a cor azul aí vamos voltar em

estilo conteúdo a cor do icon vamos deixar Branco a cor do do texto vamos deixar de branco e a cor do título vamos deixar de branco também o ícone aqui que muda a cor ó vamos ir na tipografia vamos pegar aqui títulos dos atendimentos e aqui na descrição vamos pegar texto dos atendimentos Ok vamos ir aqui em avançado em preenchimento vamos deixar 30 aí você clica com botão direito copia Clica com o botão direito cola o estilo e aí nesses daqui você pode clicar com o botão direito colar o estilo e depois só substituir as

cores então clica aqui vem em avançado plano de fundo deixa branco mesmo aí vem no estilo ícone você muda pro Verde conta o mudo você muda o título pro verde e a descrição pro verde aí clica com o botão direito copia Clica com botão direito cola o estilo clica aqui em atualizar e vamos recarregar a página Pronto agora aplicou devidamente né ah ah na verdade aqui não tinha percebido não é branco não é um cinza Então vamos clicar nesse avançado plano de fundo a cor Vamos mudar para esse cinza Clica com botão direito copia Clica

com botão direito cola o estilo atualiza vamos também diminuir um pouco o tamanho né clica aqui vem avançado colocar 20 de pading de preenchimento Clica com o botão direito copia Clica com botão direito cola o estilo clica o botão direito nesse diminui aqui para 20 Clica com o botão direito copia Clica com o botão direito cola o estilo e também vamos colocar um arredondamento Então vamos clicar vir em borda arredondamento vamos deixar 10 Clica com o botão direito copia Clica com o botão direito cola o estilo clica nesse avançado borda vamos deixar 10 clica copia

clica cola o estilo e atualiza agora nós vamos vir aqui em cima clicar com esse botão direito copiar esse botão que tá ali clica aqui em cima do título cola o botão e arrasta o contêiner para cima do título clica aqui nesse botão vem em estilo deixa ele aqui alinhado ao centro e clica em atualizar agora vamos para essa parte aqui que é a parte dos depoimentos pra gente fazer essa parte aqui de avaliações a gente vai precisar instalar um outro plugin é um plugin gratuito também tá aí para isso a gente vai vir aqui

dentro do painel administrativo vai vir em plugins adicionar plugin vai pesquisar por review Google é esse esse aqui ó o idet de revisão do Google você pode jogar esse nome aqui também para achar na lupinha clica em instalar depois em ativar pronto aí você vai conectar ao seu Google M negócio que é aquela aba lá do Google que aparece no maps ou lá na no Google mesmo quando você pesquisar o seu nome se você não tiver é legal que você faça Porque aí as pessoas perto de você vão conseguir te encontrar no mapa no Google

Mais fácil e também ajuda no ranqueamento do seu site Então você vai clicar aqui em conectar só você digitar o seu endereço que já vai pegar eu vou pegar o endereço do Shopping aqui da minha cidade só pra gente pegar de exemplo ó erlândia Shopping vai aparecer aqui o seu endereço você olha certinho clica em cima clica em conectar confere né se tá certo Pronto ele já vai ter conectado E aí agora a gente vai escolher o estilo que a gente vai querer das nossas revisões aqui dos nossos comentários Ó tem de vários tipos tem

Carrocel tem um que fica um embaixo do outro esse que eu usei aqui foi Carrocel esse tipo de carrocel aqui que tem excelente e Google aqui do lado então vou clicar selecione você pode usar outros tá se você quiser vai dando uma olhadinha aí depois que você selecionou o estilo agora você seleciona o layout ó se você quer cinza se você quer branquinho eu peguei esse daqui que é branco com uma sombra aí vou clicar em selecionar aí Aqui você faz algumas configurações se você quiser que mostre todas as avaliações vai mostrar tudo eu gosto

de deixar só as avaliações altas de quatro a cinco estrelas então eu clico aqui seleciono o idioma e o formato da data o alinhamento aqui você pode deixar o texto de revisão consulte mais informações ou rolagem eu vou deixar consulte mais informações e aqui você pode ativar também ou desativar algumas coisas por exemplo aí se você não quiser que mostre o logotipo você desativa aqui ou se você não quiser que mostre estrelas ou não quiser que mostre as fotos tá você vai desativando aqui se você quiser e clica aqui em salvar e obter código beleza

gerou esse código aqui a gente vai clicar em copiar e vamos vir aqui na página home Aliás na página início que é a página que a gente estava configurando você viu né cliquei lá em cima em editar com elementor voltamos aqui se você já tiver aqui dentro do editor ótimo aí você vai clicar aqui vai clicar em flexbox pega esse com a setinha para baixo vem avançado vem aqui em preenchimento coloca 50 vem aqui na biblioteca pega um Edit de short code arrasta para cá e cola aquele código que a gente copiou ele vai ficar

assim mesmo com esse bug aqui dentro do do editor ele fica com esse bug mas se você recarrega a página e olha lá fora do editor ele tá normal tá então você vai fazer isso clica aqui em atualizar aí eu vou clicar aqui com botão direito copiar clicar aqui com o botão direito colar veio aqui para cima aqui para baixo né eu vou clicar aqui com botão direito copiar clicar nele excluir clicar aqui com botão direito nesse título e colar que ele Cola embaixo e vou clicar em atualizar aí Vamos acessar o nosso site pra

gente ver se está certinho ó tá vendo aqui fica certinho às vezes se você recarregar o editor aqui ele fica funcion aqui dentro da página do editor mas na maioria das vezes fica assim abertão mesmo tá só lá por fora que fica bonito isso é não ó tá vendo agora deu certo mas se ficar abertão não se preocupe o o importante é estar aqui tá OK agora vamos para essa parte aqui do blog essa parte aqui a gente tá puxando posts que a gente configurou no nosso site ter uma área de blog que é uma

área onde você coloca posts artigos é muito interessante você ter porque ajuda no ranqueamento o Google ele é uma ferramenta de busca as pessoas acessam o Google para encontrar soluções e como blog são portais de informação o Google ele entende que quando uma pessoa pergunta alguma coisa ela tem mais chances de encontrar através de um blog Então você vai perceber que quando você pesquisa qualquer coisa os primeiros resultados ali que não são patrocinados né sempre são resultados de blog então recomendo demais que você coloca uma área de blog no seu site que vai te ajudar

a ter mais ranqueamento e pessoas te encontrarem mais rápido tá é bem tranquilo você vem aqui para você criar os seus posts né Você vai vir em posts aqui em todos os posts vão ficar todos os que você criou ele traz esse aqui que é um post de teste você pode excluir clica clica em lixeira e pronto aí para criar um novo você pode clicar aqui em Adicionar novo poste ou nesse botão aqui de cima Pronto já vou clicar em uma aqui para eu já pegar o texto ó eu vou copiar esse título E aqui

onde tem adicionar título você vai escrever ou colar o título que você quer e aí você vai escrever ou copiar o texto que você quer e vai colar aqui nessa parte aí Aqui você pode arrastar imagens para cá ó se você clicar aqui nesse maizinho você pode arrastar imagens para cá pode colocar galeria citação tem vários itens não é igual elementor isso aqui não é um elementor isess aqui é do próprio WordPress tá então você não vai criar nada de layout aqui você só vai colocar texto e foto tá o layout aqui por fora a

gente vai criar com elementor só que a gente tem que ter esse título esse texto feito aqui pra gente puxar isso lá dentro do elementor tá então basicamente vai ser isso título aqui texto se você selecionar os os textos aqui você consegue modificar tá vendo ó você consegue colocar em [ __ ] você consegue colocar algum link tá vendo esse item aqui ele é um item de link você clica nele e abre essa caixinha para você colocar outra coisa pra você colocar o link de outro lugar de outra página por exemplo então como isso aqui

é o site para ser seu se você quiser você pode sempre fazer uma chamada assim por exemplo Agende sua consulta aí você seleciona clica aqui aí coloca aqui o link aqui já tem a página de contato você pode colocar aqui ou então você pode colocar o link do WhatsApp entendeu Pode colocar o que você quiser beleza esse aqui é o texto aí você clica aqui na parte de poste aqui você vai precisar preencher pelo menos a aba de categoria pra gente poder conseguir agrupar esses posts aqui então por exemplo este daqui eu coloquei a categoria

carboidratos Então vou copiar clicar aqui em adicionar nova categoria é só você escrever ou colar aqui e dar um enter pronto ó tá vendo ela já vai ficar selecionada E aí você vai criando ó vou criar outra chamado proteínas dá enter você só vai precisar criar uma vez quando você for criar outros posts já vai estar aqui a caixinhas com todas as categorias você só clica em cima delas tá então você vai criar ou então selecionar a categoria que você quer e aqui em imagem destacada que você tem que colocar uma imagem para ela aparecer

tanto naquele cardz inho lá que a gente chama quanto aqui na aba do post eu já deixei as imagens separadas aqui para vocês então se você quiser usar as mesmas imagens pode usar ó arrasta a imagem para cá pronto e depois clica em publicar Então você entendeu título texto clica em Post aqui você tem que colocar categoria se tiver fechado ó tá vendo É só clicar na setinha que abre e também a aba de imagem destacada e depois publicar e publicar são duas vezes que você clica mesmo pronto clica aqui na loginha para voltar ó

aqui em todos os posts já tem o seu post que você criou aí você vai vir e vai criar todos os outros inclusive aqui na aba de Especialidades eu criei com posts também ó vai ser uma página que a gente vai colocar para chamar todas as especialidades para ter uma página de cada uma então você pode criar alguns posts que você queira que apareça aqui de assuntos diversos como esse daqui tá vendo e também se você tiver especialidades ou então os tipos de serviço e as coisas que você trabalha você cria um post para cada

um então por exemplo aqui eu coloquei várias especialidades menopausa queixas vários ó criei Um textinho explicando sobre cada um então você vai lá cria o seu post que nem esse daqui ó em Adicionar novo post vai colocar aqui vai colocar aqui o texto e aqui na aba de categoria você vai sempre colocar a categoria especialidades ó que ela já vai est criada aí você só vai clicar aqui para ó vai tá assim você vai clicar para selecionar claro né A primeira vez você vai criar aqui tá aí depois da primeira vez que ela vai começar

a aparecer ali para você selecionar e também você pode colocar a categoria do nome ó menopausa por exemplo coloca aqui também então todo todo post de especialidade que você for criar você seleciona o de Especialidades E cria o do nome da especialidade também específica tá tudo isso ajuda no so ajuda a ranquear ajuda em tudo então faça desse jeito aqui que eu tô te ensinando E aí faz né coloca imagem depois clica em publicar duas vezes já tenho a imagem aqui vou arrastar para cá publicar e publicar Beleza então agora você vai criar todos os

posts cria pelo menos um três assim de assuntos diversos que tem a ver com a sua empresa com o seu negócio e cria todosos das especialidades ou dos serviços tá também serve serviços aí você vai criar todos e voltamos pra próxima parte Pronto já cadastrei todos os meus posts fiz três de assuntos diversos e os outros das especialidades E não se esqueça você tem que marcar a especialidade como categoria se você tiver esquecido ó aqui em categorias você consegue ver ó as categorias que estão marcadas se você tiver esquecido você pode fazer assim clica aqui

em editar ou então você pode selecionar vários ó que não tiver selecionado especialidade seleciona vários clica aqui em cima clica em editar clica em aplicar que aí você vai conseguir editar todos de uma vez a edição básica E aí abre a opção de categoria E aí se não tiver marcadinho especialidades ó vai tá assim ou então vai est com esse tracinho no meio Você vai clicar e vai clicar em atualizar porque aí todos vão ficar marcados com especialidades não se esqueça tá tem que ter especialidades Beleza agora vamos fazer né Essa sessão aqui do blog

a gente vai clicar aqui vai pegar um um flexbox com a seta para baixo se você tiver saído da página home você vai acessar a página home página início quer dizer e vai clicar aqui em editar com elementor tá que você vai abrir o editor novamente vai vir aqui em estilo tipo de fundo vamos pegar essa cor cinza Vamos ir em avançado preenchimento Vamos colocar 50 de preenchimento vamos vir aqui em título copiar clicar colar e aí aqui a gente vai colar esse título chamado blog aqui eu esqueci de substituir o título né que era

para colocar o que os meus pacientes dizem o que os meus clientes dizem o que os meus clientes estão falando então esqueci de substituir você substitui aí e vou pegar o subtítulo desse aqui de baixo vou copiar aqui a gente já tem um subtítulo parecido que é esse vamos clicar copiar Clica com o botão direito Cola e aí eu vou só substituir o texto dele ó clica aqui para abrir e cola sempre atualizando agora vamos colocar os nossos posts vamos vir aqui na biblioteca pegar o edit de posts arrastar para cá vamos vir aqui em

aparência colocar cartões aqui em resolução da imagem vamos deixar completo para ela não ficar embaçada dessa forma aí aqui eu vou tirar o o avatar que é a fotinha que tá aparecendo aqui do editor vou clicar aqui para tirar o avatar e também vou desativar os metadados vou tirar a data e tirar comentários vou deixar sem nada só com a mais ele já fica basicamente configurado da forma que a gente quer só precisa fazer alguns ajustes então aqui você pode configurar a proporção da imagem vamos vir aqui em estilo aí vamos configurar aqui agora parte

do título Então vamos vir aqui em conteúdo na cor a gente vai pegar essa cor verde em tipografia vamos pegar essa tipografia aqui de subtítulo do Banner e a de texto já tá configurada e aqui a gente pode diminuir um pouquinho espaçamento entre o texto e o subtítulo aqui também esse aqui do link já tá configurado vou deixar assim mesmo vou clicar em atualizar aqui fica com esse testão mas lá na página carregada não fica fica com menos Olha tá então vamos voltar aqui vamos vir em cartão aqui em arredondamento eu vou deixar 10 para

ele ficar com a bordinha arredondada e vamos selecionar os que a gente quer que apareça eu não quero que apareça as especialidades então eu vou fazer a excluir as especialidades daqui e aí dessa forma vai aparecer só US do blog mesmo então a gente vai vir aqui em consulta consulta é onde a gente configura que posts a gente quer que apareça a gente vai vir aqui no excluir vai selecionar termo e vamos selecionar o termo especialidades que todos que tiverem a categoria especialidades não vai aparecer aqui então vai sobrar só os outros Pronto agora a

gente vai fazer esse botão aqui de ver todos os posts vou vir aqui na biblioteca arrastar um Edit de botão para cá eu vou colar esse texto ver todos os posts vou vir aqui no ícone vou pegar no ícone de Arrow que é uma setinha ó setinha para lá vou clicar em inserir vou vir aqui em estilo vou deixar alinhada ao centro vou vir aqui na cor do texto vou pegar essa cor azul vou vir aqui na cor do fundo vou colocar de branco e vou arrastar essa setinha para cá para ficar transparente vou vir

aqui em preenchimento que é o o espaço de dentro vou deixar zero vou voltar aqui na tipografia vou vir em decoração e vou colocar sublinhado vou voltar em conteúdo vou vir aqui em posição do ícone vou deixar fim para ficar com ícone para lá e aqui no link a gente vai pescar a página de blog que a gente criou e vai clicar ou então você cola o link da da página de blog vou clicar em atualizar e uma outra coisa que ficou faltando é a gente colocar ó configurar aqui para aparecer apenas três posts na

página inicial só tá aparecendo três mesmo que eu não tenha configurado porque só sobrou três posts fora os das especialidades né mas se você tiver mais no seu site vai ficar aparecendo aqui e onde a gente configura a quantidade aqui ó em posts por página por padrão ele vem seis só que eu quero que apareça só três aqui mesmo para não ficar muito grande a tela é então vou configurar três tá aí é só isso é só mudar aqui e aí depois você clica em atualizar Pronto já criamos essa parte agora nós vamos fazer o

nosso Carrocel de imagem antes eu vou só fazer mais um ajuste vou clicar aqui vir em estilo espaço entre as colunas e vou diminuir para não ficar um espaço tão grande entre um e outro vou clicar em at e vou aqui nesse título vou em estilo em tipografia e vou colocar peso 600 nesse aqui de cima também pronto para fazer esse Carrocel assim que fica na extensão da tela toda a gente vaiar pegar um Flexx com a setinha lado e nós temos que tirar todo o espaçamento desse contêiner vamos vir aqui na biblioteca e pegar

o de carel de imagens que é esse vou clicar aqui na imagem vou arrastar para cá todas as imagens né aqui esse é o momento de você colocar imagem imagens aí do seu local de trabalho ou então do seu serviço eu vou arrastar para cá todas as minhas bom que você arraste todas de uma vez ou se já tiver aqui você clica para selecioná-las e tem que ficar com essas setinhas assim tá vendo ó de selecionadas esses checks depois você clica aqui em criar uma nova e clica aqui em inserir na galeria ó e aqui

na resolução a gente vai deixar personalizado e vamos colocar largura 400 e a altura 500 e aqui a gente vai colocar slides para mostrar a gente vai colocar quatro e aqui slides para rodar a gente vai deixar um agora Perceba o seguinte você tá vendo que tem uma linhazinha branca aqui e que também as imagens não estão aqui na extensão da tela toda então isso acontece porque a gente não tirou o espaçamento do contêiner para ela ficar grudada assim na extremidade você tem que tirar todo o espaçamento para tirar o espaçamento Você vai clicar aqui

nesse contêiner principal vai vir em avançado vai colocar aqui zero de preenchimento para ele não ficar com Nenhum espaço vai vir aqui em layout e vai mudar aqui de largura do conteúdo para largura total para ele pegar toda a extensão da página agora sim ele está grudado em toda a extremidade vou clicar aqui e voltar na resolução da imagem que eu não cliquei em aplicar por isso que não salvou Vamos colocar aqui 400 por 500 aplicar aí agora sim todas vão ficar do mesmo tamanho aqui a gente vai vir em estilo para esse estío de

carrocel eu não vou querer deixar nem as setinhas que vão pro lado e nem as bolinhas aqui eu quero que fique passando sozinho vou voltar aqui no conteúdo e vou vir aqui em navegação e vou deixar nenhum vou vir aqui esticar a imagem e vou deixar assim para não ficar com aquele espacinho branco que tava tendo Entre uma e outra imagem agora para ele ficar passando sozinho mais rápido a gente vai vir aqui em velocidade da animação e vamos deixar 1000 e em velocidade de reprodução vamos deixar 500 aí aqui em velocidade da animação a

gente vai deixar 2000 e aqui em velocidade da reprodução a gente vai deixar 500 E aí ele vai passar sozinho dessa maneira essa imagem dessa moça aqui tá no lugar errado que aqui é para ser só as imagens da clínica então vou clicar aqui no lápis e vou clicar para tirar ela vou clicar em inserir galeria atualizar Pronto já fizemos Aqui Esta parte agora a gente vai fazer essa aba aqui que é a aba de contato já vou até copiar esse título vou clicar no mais pegar uma um contêiner com a setinha para baixo vir

em avançado vou colocar 50 de pad vou vir em estilo tipo de fundo na cor vou pegar o azul vou vir aqui clicar com botão direito copiar clicar com botão direito colar vou vir aqui em estilo ícone na cor eu vou deixar de branco vou vir aqui em texto na cor eu vou deixar de branco também vou vir na tipografia e vou deixar em subtítulo do Banner agora eu vou pegar esse título aqui copiar vir na biblioteca arrastar um título Aqui para baixo colar vir aqui no estilo a cor eu vou deixar de branco vou

deixar ela alinhada ao centro e aqui eu vou deixar com primário mesmo aí eu vou vir aqui em cima vou pegar esse botão clicar com o botão direito copiar clicar aqui colar e aí nós vamos escrever agendar consulta aí eu ainda vou adicionar aqui ó via WhatsApp vou vir em estilo essa cor nessa cor aqui eu vou pegar o verde mais escuro e nessa cor aqui eu vou pegar o verde mais claro pra gente fazer esse degradê vou clicar em atualizar e agora a gente vai fazer essa sessão aqui com o formulário vamos vir vamos

pegar um contêiner arrastar para cá aí aqui dentro a gente vai pegar outro contêiner e colocar aqui vamos clicar em cima dele e clicar em duplicar aí vamos ir nesse de ó tá vendo Tem um aqui fora e dois aqui dentro Ó você consegue ver a diferença entre as linhas nesse aqui de fora A gente vai clicar vai vir aqui e vai mudar para grade e nós vamos deixar duas colunas e uma linha atualizar nesse aqui deste lado a gente vai clicar vai vir em estilo tipo de fundo cor vamos pegar a cor branca neste

outro a gente vai clicar vai vir em estilo tipo de fundo cor vamos pegar este verde do mapa que foi aquela corzinha que a gente configurou Vamos ir aqui no de fora vamos ir em layout e aqui espaçamentos a gente vai deixar zero que é para eles ficarem grudados ó tá vendo ficaram grudadinhos Vamos pegar esse contêiner de dentro ó é o que tem o fundo branco vamos vir em avançado Vamos colocar 30 de pading que é preenchimento vamos vir aqui na biblioteca pegar um título arrastar para cá eu vou colocar sim ou preencho o

formulário colo vem aqui no estilo deixo Centralizado venho em tipografia vou pegar aqui títulos do atendimento atualizar vou vir na biblioteca vou pegar o widget de for que é o formulário arrastar para cá e aqui eu quero que tenha esses campos nome telefone e-mail não quero que tenha esse campo de mensagem então esse de mensagem eu vou excluir tá vendo que aqui a gente não tem um título ó aqui a gente tem um título e tem uma escrita dentro essa escrita dentro a gente chama de placeholder e esse daqui de cima o título a gente

chama de rótulo ou de Label aqui em rótulo eu vou desativar para não aparecer eu quero que apareça só o que tá escrito dentro e para mudar o que tá escrito dentro a gente clica aqui e onde tem aqui ó espaço reservado ou placeholder o que a gente colocar vai ficar escrito aqui dentro então vou colocar como que ó digite seu nome nome aqui nesse de baixo eu vou colocar digite seu e-mail preste atenção que tem que ser em espaço reservado não e título E aí para eu criar esses outros aqui o de telefone por

exemplo vou clicar em adicionar item vou vir aqui em tipo vou pegar o tipo de telefone aqui em rótulo eu vou escrever telefone e aqui em espaço reservado eu vou escrever digite seu telefone agora esse daqui que é o das especialidades a gente vai clicar em mais aqui em tipo a gente vai mudar para selecionar ou select se no sehor tiver escrito em inglês em rótulo a gente vai escrever especialidades e aqui a gente vai escrever as nossas especialidades que a gente tem então você vai escrever uma abaixo da outra então por exemplo emagrecimento Dá

um enter que aí Conforme você for quebrando a linha eles vão ficar cando as opções aqui para você conseguir selecionar escreva todos no seu depois clica em atualizar Pronto já escrevi todos e no final coloquei outro e se for a pessoa quiser tratar de outro assunto né já tem aí vou clicar para duplicar vou clicar aqui para abrir E aí vou mudar só aqui o rótulo e vou escrever modalidade E aí vou colocar par particular e aqui eu vou colocar convênio né porque tem médico que atende particular com convênio se você por exemplo já tiver

os convênios específicos que você coloca por exemplo aqui a gente usa muito Unimed Bradesco Então você aceitar só esses dois planos você vem aqui e coloca conven Unimed conven Bradesco ou outro convenio entendeu então pronto e aí para deixar um do lado do outro a gente vai fazer assim no Gmail a gente vai abrir aqui em largura da coluna A gente vai selecionar 50% vai vir no de telefone largura da coluna vamos deixar 50% eu vou arrastar esse de telefone para cima que eu quero que ele fique aqui primeiro esses daqui de baixo eu vou

fazer a mesma coisa vou abrir aqui em largura 50% e aqui também 50% pronto vou clicar em atualizar e aqui na parte de Botão em vez de escrever enviar eu vou colocar agendar consulta vou clicar em atualizar vou vir em estilo aqui nos botões em arredondamento eu vou colocar 30 em preenchimento eu vou colocar 20 vou vir aqui em Campo em arredondamento eu vou deixar 30 também vou voltar aqui em conteúdo em tamanho do campo eu vou deixar grande e vou clicar em atualizar vou voltar na biblioteca vou pegar no Edit de Map vou arrastar

para cá aqui você vai colocar Qual o seu endereço vou colocar por exemplo Uberlândia Shopping Aí só coloca aqui o endereço aqui em zoom eu vou aumentar para aparecer mais perto das ruas ó para ficar assim mostrando os pontos vou pegar o endereço físico também copiar aí eu vou vir na biblioteca vou pegar uma lista de ícones arrastar Aqui para baixo excluir aí nesse primeiro eu vou colar o endereço vou clicar vou pegar no Edit de que é esse daqui selecionar vou duplicar e vou colocar o número de telefone também aí aqui você abre substitui

no texto pelo número de telefone clica e aqui nos ícones a gente vai pesquisar por fone vai pegar esse e vai clicar em inserir vai vir aqui em estilo ícone a cor a gente vai deixar de branco aqui em texto a cor a gente vai deixar de branco e na tipografia a gente vai deixar texto mesmo vai vir aqui em lista e vai deixar centro e vai atualizar agora a gente vai pegar nesse contêiner de dentro é o de dentro não de fora tá o de dentro vai vir em estilo borda aqui em arredondamento vamos

deixar 10 só que aí você vai ver que ele vai ter arredondado de cá também a gente não quer isso quer que arredonde só dessa parte então Ó você vai vir aqui clicar para desencar os valores aqui no inferior que é Essa parte a gente vai deixar zero e aqui na parte direita se não me engano Vamos ver isso aqui no direito você vai deixar zero também esse aqui você vai clicar vai vir em borda vamos deixar 10 clica aqui para desencar no superior você vai deixar zero e no vamos ver se é no esquerdo

também você vai deixar zero deixa eu ver se ficou certo isso mesmo ó esquerdo e superior a gente deixou zero que aí ele ficou retinho e encontrou com este a gente vai clicar aqui também nesse contêiner de Fora para não ficar com nenhum bug de espaço Vamos ir em layout e vamos deixar assim ó alinhar itens que aí eles vão ficar os dois contêineres vão ficar da mesma altura Só tá faltando a gente vir neste contêiner clicar vir em avançado e colocar 30 de pading também assim como a gente fez com o outro e aí

ficou desta maneira a gente vai fazer uma mais que é vir aqui nesse mapa Vamos ir em avançado borda Vamos colocar 10 de arredondamento e se você quiser você pode vir aqui em conteúdo e aumentar a altura ó aumentar ou diminuir a altura vou clicar aqui em atualizar E aí nós já finalizamos a nossa página início pras configurações de computador aí agora a gente vai adaptar essa página início para dispositivos móveis primeiro você vai a página fora do editor e vai ver se tem alguma coisa com erro se tem alguma coisa que ficou faltando ó

vamos avaliar já tô vendo que ficou faltando o espaço nesse Então a gente vai voltar aqui no editor Vamos ir nesse contêiner Vamos ir em avançado aqui em margem e vamos colocar 40 de espaçamento também vou vir nesse botão vou vir aqui em preenchimento vou colocar 20 de pading e na esquerda e na direita vou colocar 25 pra gente poder adaptar para dispositivos móveis como celular e tablet a gente vai passar o mouse aqui em cima de modo responsivo vai clicar e aí vai abrir esses três controles aqui é como a gente tá vendo no

computador aqui é como a gente vê no tablet e aqui é como a gente vê no celular então para adaptar aqui pro celular nesse contêiner principal aqui de cima primeiro a gente vai vir aqui em avançado Vamos colocar 20 de preenchimento vamos vir aqui nesse título Vamos ir em estilo tipografia Vamos diminuir o tamanho dele vamos deixar ele aqui alinhado ao centro vamos vir nesse subtítulo estilo deixar alinhado ao centro e no botão também estilo deixar alinhado ao centro clicar em atualizar vamos voltar aqui no contêiner principal vir em estilo e vamos colocar a imagem

que que é adaptada para o celular porque tá vendo que essa imagem aqui como ela é muito grande a gente não dá pra ver o moço a gente tem que fazer uma com a arte que ele fica embaixo nos vídeos aqui do canal que eu ensinei você a criar esse banner eu te ensinei a criar as duas versões e no nosso material eu deixei a imagem para você também que na parte de banner então tem o banner mobile eu já até subi ele aqui no no site ele tá com um das primeiras imagens que é

esse aqui ó que ele está na parte de baixo vou selecionar e clicar em selecionar quando você muda a imagem assim ele dá uma sumida no texto demora um pouco para carregar é assim mesmo tá então você vai fazer isso vai clicar aqui no contêiner vir em layout deixar aqui ó alinhado no início e vai deixar aqui em esticar que aí o texto vai ficar na parte superior você pode ir ajustando o tamanho do texto para não ficar cortando a cabeça da pessoa aqui ou se você quiser diminuir o título Ou se você quiser você

pode vir aqui no contêiner vir aqui em altura mínima e aumentar para que a imagem Desça um pouco o botão e a imagem não fiquem cortando a cabeça dele ok então faça esses ajustes agora vem nesse clica aqui avançado Vamos colocar 20 de preenchimento o tamanho do título subtítulo e esses textos Aqui de baixo estão Ok nesse aqui a gente vai clicar vai vir em avançado Vamos colocar 20 de preenchimento desenc lá e aqui no inferior que é essa parte aqui de baixo ó que a gente precisa ter um espaço para subir com esse a

gente vai colocar Vamos colocar 80 por enquanto não aliás Vamos colocar 120 agora vamos ir neste contêiner virem avançado Vamos colocar 20 de preenchimento nesse aqui a gente vai clicar nesse interno virem avançado Vamos colocar também 20 de preenchimento nesse aqui a gente a gente vai vir em avançado Vamos colocar 20 de preenchimento nesse vamos clicar vamos vir em avançado 20 e esse subtítulo aqui esse título aqui a gente vai vir em estilo tipografia vai diminuir um pouco para ele não quebrar a linha pronto vamos ir nesse contêiner avançado Vamos colocar zero de preenchimento e

vai ficar assim vamos ir nesse contêiner avançado 20 de preenchimento nesse aqui do blog também contêiner avançado 20 de preenchimento nesse aqui não precisa mexer nesse aqui no contêiner avançado 20 de preenchimento desvincula e na parte de cima vamos colocar 40 este subtítulo a gente pode diminuir um pouco mas ainda deixa ele grande que é para chamar atenção mesmo vamos vir aqui nesse contêiner no contêiner de fora tá avançado Vamos colocar zero e nesse aqui interno Vamos ir em avançado Vamos colocar 20 nesse aqui também avançado Vamos colocar 20 o tamanho do texto está ok

a gente só vai configurar a borda vamos clicar nesse aqui no branco vir em estilo borda vamos desencolher Doo 10 também ó tá errado não é então vamos tentar no direito é no direito que ficou arredondado então aqui na parte do esquerdo a gente pode deixar zero aí vamos ir nesse Vamos ir em estilo borda desvincula aqui na parte inferior a gente vai deixar zero Opa a gente vai deixar 10 ó arredondou de cá eí vamos vir aqui na parte esquerda para ver 10 deu certo arredondou de cá então aqui que é inferior e esquerdo

pronto rodapé já tá configurado clica em atualizar a mesma coisa você vai fazer aqui no tablet vai ajustando nesse caso aqui a gente pode vir neste contêiner vir aqui em largura aumentar o tamanho da largura que aí o título não precisa fazer nenhum ajuste né só a gente fazer um ajuste aqui na imagem mas dessa forma aqui como está no tablet tudo bem Dá uma cortadinha Mas se você quiser de acordo aí com o layout que você fez ó Às vezes você deixa mais Centralizado centro Centro à direita centro à esquerda vai tentando aí para

você ver vou deixar Centralizado mesmo ele deu um pequeno corte aqui mas tudo bem E vamos vir aqui no layout também podemos diminuir um pouco a altura que ele vai ficando aparecendo mais ficou assim nesse aqui a gente vai vir nessa grade e vai mudar para duas colunas Opa duas colunas e as linhas você vai contar quantas deu 1 2 3 4 5 Então vamos colocar cinco linhas e vamos deixar todas assim ó itens esticados aqui a gente vai mudar a gente vai vir aqui nesse contêiner Vamos mudar a largura para porcentagem vamos deixar 100%

nesse aqui a gente vai mudar vai mudar a largura para porcentagem vamos deixar também tamb 100% aqui a gente vai vir aqui nesse contêiner e vai mudar pra vertical para ficar um abaixo do outro e vamos vir aqui nessa nesse contêiner de dentro e Vamos aumentar a largura dele para ficar um texto e esse aqui da imagem como é uma imagem vertical não precisaria aumentar mas se você quiser você pode aumentar aqui um pouco eu acho que fica melhor deixar menor para que a imagem não fique tão grande ou se você quisesse pode vir aqui

e ajustar a largura da imagem também ok ficou assim esse daqui não precisa ajustar esse daqui a gente pode vir vir em layout aqui em colunas vamos deixar uma e aqui em linhas vamos deixar quatro vai ficar um abaixo do outro aqui vai tá ok aqui ele já vem configurado aqui também aqui a gente pode vir nesse contêiner principal vir em layout e mudar para uma coluna e duas linhas e a gente faz a mesma adaptação da borda para ficar arredondada esse a gente vem vem em borda desvincula deixa o superior e o direito e

aqui a gente clica bem borda desenca deixa o inferior e o esquerdo el vai ficar arredondado em cima e embaixo então Então pronto já está configurada aqui a nossa parte de tablet também atualiza coloca aqui na parte de computador Vê se não desconfigurou nada olha aqui ficou com uma linha a mais vou clicar e vou tirar uma linha pronto o restante está tudo ok então beleza Já terminamos aqui a nossa página inicial agora vamos criar o layout da página de sobre a página de sobre e a página de contato ó são as mesmas sessões que

a gente colocou no início só que a gente vai colocar elas em páginas separadas isso vai ajudar no seo por quê quando a gente jogar o nome do seu site no Google como o meu por exemplo você joga descomplicando sites aparece aqui as páginas mais acessadas e só vai aparecer esse menu que ajuda no ranqueamento se o seu site tiver várias páginas então ter um site com várias páginas ele legal por conta disso Claro Este é o estilo que eu estou fazendo aqui e você pode colocar mais conteúdo mais coisas se você quiser também fique

à vontade Tá então vamos fazer assim você vai clicar aqui na página sobre mim ou então você vai acessar aqui dentro do painel administrativo páginas todas as páginas vai clicar aqui ó em cima da página Você vai clicar em editar e vai clicar aqui em cima em editar com elementor isso só a primeira vez que você for fazer a edição dessa página depois que você já tiver clicado em editar com elementor basta você clicar aqui em cima em editar que aí você já vai conseguir voltar aqui pro editor Tá então vamos clicar aqui na rabinha

de configuração aqui em layout vamos deixar Elementor a largura total e vamos clicar em atualizar Eu ainda estou com o editor da página início aberto se você não tiver você acessa lá de novo eu vou pegar essa parte aqui de sobre mim né vou clicar nesse contêiner clicar em copiar vou vir nessa página clicar e clicar em colar vou pegar essa esse contêiner aqui clicar clicar em copiar vir aqui embaixo clicar clicar em colar esse outro aqui também vou fazer o mesma coisa e vou clicar em atualizar eí a nossa página já vai estar pronta

a gente já até adaptou ela aqui para mobile Então já tá pronto vamos vir aqui na página de contato agora ó mesma coisa Clica ali em cima em editar página também vai pro mesmo lugar clica aqui em editar com elementor aí aqui a gente vai pegar essa parte aqui que é a parte de contato vamos clicar em cima desse contê se você não tiver conseguindo pegar que nem eu não tô conseguindo Você vai clicar aqui em navegador vai rolar até aqui embaixo ó vai fechando as abas dos conteiners que aí você vai conseguir ter uma

visão melhor com eles todos fechados ados ó que aqui você consegue Navegar pelos contêiners e esse aqui é o último que a gente quer que é esse Clica com botão direito e você consegue selecionar ele clica em copiar clica aqui clica em colar clica na engrenagem vem em layout da página deixa elementor largura Total atualizar E aí a nossa página de contato vai ficar assim eu vou voltar aqui na página de sobre mim e vou colocar também essa sessão de depoimentos que eu acho que encaixa bem porque o sobre os depoimentos também é sobre a

pessoa né então você está aqui na parte sobre mim ó só clicar aqui em editar com elementor desce e cola essa sessão e depois clica em atualizar pronto então nós já criamos aqui a página sobre a página contato e agora falta a página especialidades a página especialidades a gente vai pegar os posts tá vendo que nem a gente fez lá na página home Então você vai acessar lá a página de Especialidades vai clicar em editar página aqui em cima aí você vai clicar aqui em editar com elementor vamos voltar aqui no editor da página home

clicar com o botão direito copiar vir aqui primeiro na engrenagem vira em layout da página deixa Elementor ou largura Total clica no botão direito clica em colar vem aqui nesse contêiner vem em estilo cor vamos deixar a cor branca clica clica em mais pega um Flex box com a seta para baixo vem avançado coloca 50 de preenchimento vem estilo tipo de plan de fundo pega a cor verde arrasta esse título para cá e este subtítulo para cá também clica no título vem em estilo coloca a cor branca vem no subtítulo em estilo em ícone coloca

a cor branca em texto coloca a cor branca também aí nós vamos só substituir né o título a gente vai mudar para esse ó abre aqui e muda Opa é aqui em blog coloca aqui minhas especialidades e o subtítulo clica aqui abre e cola pronto clique atualizar agora a gente vai clicar aqui vai aqui em consulta vai vir aqui em excluir e vamos excluir esse termo que a gente tinha colocado agora vamos colocar aqui em incluir a gente quer que apareça só o que a gente vai selecionar aqui aí vamos selecionar termo e em termo

a gente vai colocar especialidades pronto que aí vai aparecer somente os posts da categoria especialidades vamos voltar aqui no no nosso página de início clicar com esse botão copiar clic em atualizar vamos clicar aqui e clicar em colar para ser um botão de agendar consulta aí vamos clicar aqui quantas especialidades você tiver você deixa aqui para aparecer os postes por exemplo se não me engano tem nove especialidades cadastradas Então eu vou deixar aqui para aparecer nove posts e vou clicar em atualizar vamos clicar aqui colocar em modo responsivo vir nesse contêiner vir em avançado e

vamos 20 de ping foi o único que a gente criou aqui diferente que vai precisar ajustar né vamos vir aqui nesse título estilo diminuir um pouquinho o tamanho dele clicar em atualizar o restante já está configurado não precisa mexer vamos voltar pra nossa página principal pra gente ver se está tudo certinho ó sobre especialidades e contato Pronto agora a gente vai criar o layout da nossa página blog que é onde vai ficar todos os posts página de blog do WordPress a gente não consegue clicar aqui em editar e nem editar com elementor diretamente ela já

traz automaticamente todos os posts que a gente tiver criado no site para poder modificar ela a gente cria um modelo lá no elementor e faz uma configuração para ele sobre escrever essa página aqui se você clicar aqui em editar nela mesmo vai dar um erro e você não consegue editar tá então você tem que editar o modelo dela então a gente vai vir aqui dentro do painel administrativo vamos vir aqui em modelos Adicionar novo vamos escolher opção de arquivo modelo vamos dar o nome de modelo de página de blog ou página de blog enfim eu

vou colocar modelo para ficar mais fácil de você lembrar vou clicar em criar modelo vou clicar aqui no x vou vir aqui vou pegar um flexbox com a seta para baixo vou vir em avançado vou colocar 50 de preenchimento vou vir em estilo tipo de fundo a cor eu vou colocar a cor cinza e aqui com o editor da página home aberta eu vou clicar com o botão direito clicar em copiar aqui ó no do blog clicar com o botão direito copiar clicar com o botão direito colar clicar com o botão direito copiar o subtítulo

e clicar com o botão direito e colar o subtítulo que é esse mesmo subtítulo que tem aqui agora eu vou vir na biblioteca vou pegar um contêiner arrastar para cá vou vir aqui na página home vou clicar nesse widget de post o botão direito clicar em copiar vou clicar aqui e clicar em colar agora vou voltar aqui arrastar um contêiner para cá para dentro desse contêiner interno ó tá vendo tem o de Fora e tem esse aqui vou clicar nesse contêiner de fora vou vir aqui e colocar ele horizontal para ficar as coisas um do

lado da outra aí vou arrastar esse contêiner para cá eu quero que fique os postes de cá e esse contêiner de cá vou vir aqui nos pushes vou mudar as colunas para dois ó para ficar um do lado do outro vou vir nesse contêiner de fora aqui em espaço eu vou deixar 20 vou vir no lapizinho desses postes vou virem avançado largura vou deixar personalizado vou deixar aem porcentagem e vou deixar tamanho 65 vou vir nesse contêiner vou vir aqui em layout e na largura eu vou deixar tamanho 30 vou vir aqui neste post vou

virem avançado em margem vou desencar e aqui na direita eu vou deixar 30 de espaço para ficar um pouco afastado desse desse dessa Bia que vai estar aqui aí eu vou clicar aqui vou vir em avançar vou colocar 30 de pading vou vir em estilo tipo de fundo cor vou colocar cor branco vou vir em borda arredondamento e vou deixar 10 vai ficar assim aí agora vamos colocar essa abinha de categorias vamos vir aqui na na biblioteca vamos Fechando todas as abas Vamos ir aqui em WordPress e vamos pegar a aba de categoria de posts

esse aqui categorias e vamos arrastar para cá agora preste atenção isso aqui é muito importante é o que vai definir o funcionamento da página Você vai clicar em publicar e vai clicar aqui em adicionar condição e tem que estar aqui em todos os arquivos ou então em Post arquivo tá vou deixar aqui em todos os arquivos vou clicar em salvar se você já tiver clicado em publicar antes e não tiver aparecendo mais não tem problema clica aqui nessa setinha e clica em exibir condições vai tá assim né você clica em adicionar e clica em salvar

aí agora você aplicou esse modelo de página de blog lá naquela página automática do WordPress você pode fechar aqui e acessar que aí você vai ver que já mudou o layout aí você vai conseguindo ver aqui OK pra gente mudar essas cores a gente vai mudar lá nas configurações padrões do tema vamos vir aqui nessas setinhas vir aqui em configurações do site vir aqui em tipografia vir aqui em link tá vendo ó tem link aí aqui em cor você vai pegar essa cor azul e este título aqui ele é um h5 é um título do

tipo h5 ó aqui tem H1 H2 H3 H4 e h5 esse aqui a gente vai colocar dessa cor cinza pronto vamos clicar aqui em atualizar pode clicar nesse x ali de cima para fechar esse editor aí se você recarregar já vai ter editado aí faltou a gente fazer essa caixinha aqui vou pegar aqui em layout um contêiner trazer para cá vou vir em estilo tipo de fundo vou colocar essa cor verde avançado vou colocar 20 de pading vou vir aqui no editor da página início aqui eu vou copiar esse título clicar com o botão direito

clicar em colar vou copiar este outro clicar com o botão direito clicar em colar eu vou substituir por este texto que eu coloquei aqui aqui ó chegou a sua hora de cuidar de você e a gente sua consulta pelo WhatsApp já está aí eu vou vir neste vou vir em estilo tipografia vou diminuir o tamanho e o peso vou deixar 600 e esse daqui vou vir em estilo texto a tipografia eu vou deixar de texto vai ficar assim vou clicar também e aqui em espaçamento entre as ó a altura da Linha quer dizer eu vou

diminuir um pouco ficou assim vou voltar vou pegar esse botão de WhatsApp clicar com o botão direito colar e aí eu vou vou deixar só agendar consulta vou tirar o via WhatsApp vai ficar assim vou vir em estilo e diminuir o tamanho do texto aliás vou deixar 15 mas vou diminuir aqui o tamanho desse preenchimento para ele não ficar tão espaçoso vamos clicar em atualizar vamos vir aqui nesse contêiner vir em estilo borda vamos deixar 10 de arredondamento clicar em atualizar agora a gente pode pegar esse mapinha vir aqui né na página início clicar com

o botão direito no mapinha copiar ó Clica com botão direito aqui nesse clica em colar que aí é mais fácil de arrastar esse contêiner aqui para cima e também podemos vir aqui na biblioteca arrasta de de título para cá vamos colocar aqui onde estamos vem aqui no estilo deixa Centralizado vem em tipografia vamos deixar aqui subtítulo do Banner atualizar voltamos aqui na página início Clica com o botão direito copia Clica com o botão direito Cola clica em cima dele vem estilo ícone e vamos só mudar a cor ó ícone ó para azul e aqui no

texto a cor para esse cinza clica em atualizar Vamos colocar também esses itens de redes sociais Vamos ir na biblioteca arrastar o idit de redes sociais para cá vou deixar só dois só o Instagram e o tiktok por exemplo clicar aqui em todos os ícones selecionar tiktok aqui em forma vou deixar círculo aqui em cor vou deixar personalizado na cor primária vou deixar esse azul na cor secundária vou deixar de branco e o tamanho eu vou diminuir aliás eu vou mudar para esse azul aqui o azul mais claro e qu ao passar o mouse eu

vou deixar grow E aí vai ficar assim clique em atualizar vamos pegar a foto do doutor que já tá configurada aqui clica no botão direito copia clica no botão direito Cola vamos duplicar esse título arrastar ele para cá colocar o nome Dr Antônio né o nome da pessoa arrastar o de texto e vamos deixar um texto breve agora vamos voltar aqui na página inicial copiar este botão clicar aqui embaixo clicar em colar e vou mudar para saiba mais sobre mim E aí o link vai ser o da página sobre vamos tirar esse ícone de WhatsApp

vamos deixar 100 vou arrastar a imagem aqui para cima esse título era para est maior vou aumentar o tamanho dele Clica com botão direito copia Clica com botão direito Cola ficou assim agora vamos ir aqui nesses itens post vamos vir aqui em consulta aqui excluir a gente a gente vai tirar e aqui em fonte a gente vai deixar consulta atual que aí vai aparecer todos os pushes vamos clicar em atualizar E aí aqui em paginação ó paginação a gente vai deixar números ó tá vendo que aliás vou deixar número anterior e próximo Aí vou vir

aqui em estilo paginação e espaçamento de baixo ó que é o espaçamento entre a paginação e os cards e a cor eu vou deixar esse azul a cor do Rover eu vou deixar esse azul escuro e a cor do ativo eu vou deixar esse esse azul também vai ficar assim vou clicar em atualizar agora vamos configurar para mobile vamos clicar aqui clicar no celular vem no coner principal avançado Vamos colocar 20 de pading o preenchimento clica neste vem avançado clica aqui para desencar as margens clica aqui em largura personalizada e deixa total 100% e vamos

ir nesse contêiner que ficou aqui ele já tá configurado já tá 100% aqui beleza vamos só vir em avançado nele e deixar 15 de preenchimento o restante já veio configurado só isso aqui que a gente pode vir vir em estilo tipografia e diminuir o tamanho para não quebrar a linha pronto a nossa página de blog já está configurada agora vamos colocar no tablet ó vamos vir aqui nesse contêiner interno Vamos colocar a setinha para baixo para ficar um abaixo do outro clica aqui vem aqui em largura personalizada deixa 100% este clica aqui vem em layout

largura personalizada Vamos mudar aqui paraa porcentagem e deixar 100% clica nesse botão e deixa alinhada ao centro e clica em atualizar Pronto já checa se não alterou nada no computador e no celular se tiver tudo ok Já terminamos de criar o layout da nossa página de blog agora vamos criar o da página individual a página individual é a página que a gente clica e acessa o nosso post ó ela fica assim por padrão a gente também cria um modelo dela outra coisa antes de começar né que nem eu te falei se você clicar aqui em

cima editar com elementor vai dar erros você clicar ali em página e clicar em editar com Elementor vai dar erro aqui na página de blog você fez alguma alteração que você queira mudar você tem que editar o modelo E para isso você vai passar o mouse em cima de elementor e aqui vai abrir ó tá vendo modelo de página de blog tem escrito arquivo aqui na frente é aqui que você clica para editar que aí você vai estar editando o modelo Ok a página individual de post também é criada com modelo que olha quando a

gente acessa algum post o padrão dele é esse aqui e a gente não consegue clicar em editar com elementor em cima desse post direto a gente tem que criar um modelo para ele subscrever essa página aqui para isso a gente vem aqui em modelos Adicionar novo seleciona página individual vamos dar o nome vou colocar página de poste individual clicar em criar modelo já deixei aqui do lado pra gente vendo o layout que eu tinha feito fecha esse popup clica no mais pega um Flex box com a setinha para baixo vem avançado Vamos colocar 50 de

preenchimento vem aqui no estilo plano de fundo vamos pegar a cor cinza vamos vir aqui na biblioteca arrastar o título do poste aí ele já pega automaticamente o título do post vem aqui em estilo deixa Centralizado agora a gente vai colocar esses dados aqui ah tá Primeiro vamos configurar aqui primeiro Vamos alterar aqui o peso para 600 Ok vamos ir aqui na biblioteca vamos pegar este de informações da postagem e pode deixar quantas informações você quiser ou se você quiser tirar por exemplo eu vou tirar essa da hora vou deixar só o de comentários e

a data e o autor aí vamos vir aqui deixar centralizado vou vir aqui em texto vou deixar essa cor azul também aí depois eu vou vir aqui vou pegar um flexbox com a setinha para baixo vou vir em avançado vou colocar 50 de preenchimento vou clicar aqui para desencar e no de cima eu vou colocar zero vou vir aqui na biblioteca vou pegar o edit de imagem destacada ele vai puxar automaticamente a imagem do post aqui em resolução da imagem vou deixar completo vou vir em estilo em largura máxima e vou deixar 50% vou vir

aqui em Rai da borda vou deixar 10 de arredondamento vou vir nesse contêiner aqui de cima vou vir em avançado desencar aqui os valores de preenchimento e vou colocar 250 inferior vou vir nesse contêiner nesse aqui de baixo tá vendo vou vir avançado desencar os valores aqui de Margem e vou colocar uma margem negativa para ele ficar aqui em cima eu acho que eu coloquei muito de espaço vou vir e vou diminuir vou colocar uns 180 tá então ficou 180 de espaço aqui inferior neste contêiner de cima OK agora no de baixo a gente vai

vir aqui na biblioteca vamos arrastar conteúdo da postagem que é onde vai pegar aquele texto todo que a gente criou ele já pega tudo vamos ir aqui vamos pegar um Edit de título comum aí eu vou escrever igual tá aqui ó está gostando do conteúdo compartilhe a você cola vem aqui no estilo deixa Centralizado vou vir aqui em tipografia vou pegar títulos de atendimento para pegar o tamanho e vou mudar a espessura para 600 vou vir aqui vou pegar o edit de compartilhamento Então vou pesquisar por share que é esse aqui ó botão de compartilhamento

vou arrastar para baixo e aí eu vou deixar Facebook Twitter telegram e WhatsApp aqui ele tá Facebook Twitter vou mudar aqui do LinkedIn paraa telegram vou duplicar e vou mudar para WhatsApp ele mesmo já vai modificando as cores vou deixar alinhada ao centro e a forma eu vou deixar círculo vai ficar assim não precisa configurar link nenhum porque é de compartilhamento você clica e ele já gera um compartilhamento lá na rede social já abre a rede social para compartilhar agora a gente vai fazer a caixa do autor vamos duplicar esse título arrastar ele para cá

aí eu vou vilo vou deixar ele alinhado à esquerda vamos pegar o ID de caixa de autor que é essa vamos arrastar para cá ele já pega os dados do autor a gente vai fazer modificado vamos vir aqui em autora atual Vamos colocar personalizar aí a foto de perfil eu já deixei para vocês no Drive e eu vou arrastar ela para cá tem vídeo no canal ensinando como fazer imagens redondas no canva tá para ficar dessa forma aqui aí aqui a gente vai colocar os dados dele né do profissional ó aqui em aqui em nome

a gente vai mudar e vou colocar a descrição que é um resumo sobre ele aqui em biografia E aqui onde tem todos os posts eu vou mudar para minhas especialidades em endocrinologia pra pessoa clicar e lá ver mais ó minhas especialidades e aqui ó onde tem o link do botão eu vou pescar a página de Especialidades E aqui nessa parte de link eu vou colocar a página de sobre que aí se a pessoa clicar em cima da foto do título dele vai pra página de sobre E se ela clicar aqui no botão vai pra página

de minhas especialidades em ecnologia agora vamos ir em estilo alinhamento vamos deixar aqui no meio tamanho da imagem eu vou aumentar aqui em aor a cor do nome eu V deixar de azul a biografia vai ficar com esse cinza mesmo e o botão também vou deixar de azul aí o botão ao passar o mouse eu vou deixar com esse azul mais claro que a vai ficar assim e vou vir aqui em tipografia vou clicar no lapizinho e em decoração vou deixar sublinhado paraa pessoa saber que é para clicar agora eu vou vir em avançado vou

colocar 30 de pading ou preenchimento vou vir em plano de fundo tipo de plano de fundo vou pegar a cor cinza Tô achando que a imagem ainda ficou menor vou aumentar um pouco e aqui em autor na parte do título eu vou pegar esse textos do os atendimentos eu vou só aumentar dois e deixar o peso 600 agora vamos clicar nesse segundo contêiner vamos vir em layout em espaçamento vamos deixar 30 aliás vou deixar 30 e e TR de espaçamento para não ficar tão grudado assim cada um vamos publicar clica aqui ó publicar adicionar tem

que estar todo os singulares se você já tiver publicado e não tiver aparecendo mais o botão de publicar clica aqui nessa nessa setinha clica em exibir condições aí vai estar assim você clica para adicionar todos os singulares e salva Ok vamos clicar aqui com botão para clicar no responsivo vamos clicar aqui pra gente colocar no modo de telefone Vamos ir nesse contêiner aqui vamos deixar 20 de preenchimento desenc os valores aqui no inferior vamos deixar 120 Vamos ir neste contêiner avançado Vamos colocar 20 de preenchimento desinclor os valores e vamos subi-la vamos desinc os Val

valores aqui de preenchimento também e no inferior a gente vai deixar zero Vamos ir na imagem e aumentar o tamanho dela ó vou deixar 100% mesmo os textos aqui estão no tamanho Ok esse título eu vou deixar ele alinhado ao centro esse aqui a gente vai clicar com direito vai duplicar vamos deixar um aparecendo só pro computador e outro só para paraa tablet e para telefone esse a gente vai clicar vai vir em avançado vamos vir aqui em responsivo vamos ocultar para computador né desktop e nesse aqui a gente vai clicar vai vir em avançado

responsivel e vamos ocultar para tablet e para telefone Então esse aqui é o que vai aparecer no computador e esse aqui é o que vai aparecer só no celular aí vamos clicar Vamos ir em estilo aqui no layout vamos deixar acima que aí a imagem vai ficar aqui em cima e aí vamos vir aqui em alinhamento vamos deixar alinhado ao centro Atualiza aí vamos conferir aqui no tablet ele tá aparecendo assim no computador ele tá aparecendo assim quando fica cinza desse jeito é porque ele tá escondido aí se a gente fechar aqui o editor a

gente não consegue ver tá vendo a gente vê só o que tá programado mesmo não tá certinho já finalizamos aqui o desenvolvimento da criação do layout vamos conferir e fazer alguns ajustes ó vou recarregar essa página Vou acessar aqui a aba de blog Vou acessar os outros posts comuns ó é aplicado para todos se a gente clicar aqui vai pra página de sobre nós e se a gente clicar vai pra página de Especialidades você deve ter percebido quando eu modifiquei aqui na página de blog a cor do link que a cor do botão aqui em

cima ficou apagadinha né ficou a mesma cor que a gente colocou aqui isso acontece porque eu não tinha determinado a cor do botão então eu vou vir aqui ó passei o mouse em cima de elementor clique em cima de menu principal clica no botão vem estilo tá vendo ó quando tem esse tracinho Ele pega a cor automática que geralmente é branco então como eu não coloquei aí agora eu defini lá que todos os links vão ser dessa cor ele vai puxar a cor que tá definido como padrão se eu não quiser que seja eu tenho

que vir aqui e colocar uma cor que é branco aí atualizei aí vamos fazer uma conferência aqui no nosso site pra gente ver se está tudo certinho aqui na página home tudo certo a gente viu também que no mobile a gente já configurou sobre Ah tá tá faltando então pra gente fazer a linkagem dos currículos ó as especialidades eu tinha colocado só algumas aqui pra mostrar pra vocês se vocês quiserem colocar as outras inclusive já deixar linkado pode fazer assim ó vem aparência menus pode excluir essas que a gente tinha feito aí a gente vai

vir em cada uma dessas que a gente tinha feito e colocar o link certo Vamos acessar especialidades emagrecimento a gente vai clicar em cima do post vai clicar aqui para copiar o link e vai colar o link aqui diabetes mesma coisa clica copia o link e cola p mesma coisa com perca capilar aí pra gente colocar novos é igual eu te falei no início clica aqui em links personalizados escreve então aqui eu tenho próximo vai ser terapias hormonais então você vem aqui coloca o título né terapias hormonais copia se você não quiser nem entrar na

página Pode só clicar com o botão direito copiar endereço do link vem aqui e cola clica em adicionar ao menu ele vai parar aqui embaixo aí você arrasta para ele ficar aqui ó tem que no mesmo alinhamento desses aí você vai fazendo eu vou fazer em todos ó novamente copia aqui o título Cola ele aqui Clica com botão direito copiar endereço do link clica aqui cola adiciona o menu pega arrasta aqui para cima quando você finalizar todos você clica em salvar menu que aí dessa forma quando a gente vier aqui passar o mouse em cima

de especialidade se a gente clicar a gente já vai direto pro post que fala disso ok eu vou fazer em todos aqui pronto já fiz todos e cliquei em salvar E aí já está aparecendo aqui agora pra gente linkar essa parte do currículo a gente vai vir aqui dentro do editor do elementor clica aqui em editar com elementor vai até a aba de currículo clica nesse contêiner vem em avançado em ID a gente vai escrever currículo sem acento pode até copiar isso aqui já clique em atualizar vamos voltar aqui dentro do painel administrativo aparência menus

e onde a gente colocou o currículo Ah tá a gente já tinha colocado aqui né se você não tiver colocado ó coloca o link da página barra hash e currículo que é o mesmo ID que você acabou de escrever lá clique em salvar e agora vamos testar ó a gente clicar em currículo ele nos leva aqui para baixo às vezes quando tem um menu que fica assim ele nos leva pro meio da sessão E aí fica escondendo uma parte disso aqui então para solucionar isso você pode fazer assim ó em vez de você linkar aqui

nesse você vem aqui exclui e linca neste de cima pode ser até nesse widget clica aqui nele vem avançado vem aqui em ID Cola pode ser aqui pode ser nesse coner pode ser no título pode ser qualquer coisa vem atualizar ó vamos atualizar página E aí clica eí tá vendo ele vai parar um pouquinho para cima e aí dá pra pessoa ver exatamente aqui em currículo você pode fazer isso ou então você pode colocar uma ncora ó vou excluída aquii vou pegar um idet que chama Ancora que ele fica invisível só pra gente usar aqui

mesmo aí você cola o ID Atualiza aí vamos recarregar ó vendo o bom de você ter essas duas opções é que por exemplo aqui como a gente colocou uma margem negativa mesmo que a gente colocando na ncora ele ainda fica no meio então você pode também fazer colocando no widget de cima né no item de cima Então vem aqui ó peguei os comentários coloquei aqui o currículo aqui no ID E aí dessa forma ele para aqui mais para cima tá então ficou assim a linkagem e o que ficou faltando aqui da gente ajustar na página

home é colocar os efeitos de movimento vamos fazer isso aqui nesse título a gente vai clicar no lapizinho virem avançado efeito de movimento animação de entrada vai ser F in e eu vou colocar lento Esse aqui também vou clicar avançado efeito de movimento F in lento e o botão eu vou clicar vou vir em avançado efeito de movimento eu vou colocar zoom in e lento Vou atualizar e vamos recarregar aqui para você ver esse efeitos de movimento é um efeito que os itens vão fazer quando recarregar a página pela primeira vez ó tá vendo ele

apareceu gradualmente esse aqui ele apareceu com zoom nesse título a gente vai vir em avançado efeit de movimento F in lento nesse subtítulo também já nesse daqui a gente nos do meio a gente vai fazer assim ó clica avançado efeit de movimento Zoom in lento a gente pode até copiar clicar com o botão direito colar o estilo e colar o estilo nos outros aí Se tiver prejudicado por exemplo a altura desse você clica vem aqui em estilo e na altura dele você aumenta para voltar a ficar com aquele mesmo tamanho ele tava antes Beleza então

em todos os do meio a gente vai fazer isso e nos deste lado a gente vai ver em avançado efeito de movimento slide ó slide left que é vindo desse lado vamos deixar lento e deste lado aqui a gente vai vir em avançado e feio de movimento slide slide right que é para vir aqui da direita lento também aí vamos atualizar vamos recarregar a página para você ver ó tá vendo que aí um Vem de um lado um vem do outro e esse vem no meio vai ficar esse efeito aí você vai fazer isso em

todos os outros desse aqui esse aqui usei o slide Então vamos vir aqui em avançado efeito de movimento Vamos colocar slide left Esse aqui também slide left e esse aqui também e pra gente deixar um aparecendo me depois o outro depois o outro a gente pode configurar o tempo então esse aqui a gente vem e deixa por exemplo ó efeit de movimento o tempo a gente deixa 400 milisegundos aí esse a gente vem efeito de movimento o tempo a gente deixa 500 e esse aqui a gente deixa 600 atualiza E aí fica assim ó e

aí fica assim ó vem um depois o outro depois o outro nessa imagem a gente pode deixar só o f in ó efeit de movimento F in esse daqui também a gente deixa só F in vamos clicar no contêiner inteiro avançado efeit de movimento F in aqui a gente clica avançado efeit de movimento vamos deixar Zoom in aparecer assim aqui a gente vai fazer da mesma maneira vamos clicar da mesma maneira dos caros de cima avançado efeit de movimento esse vai vir de um lado então vai ser slide left e este slide right efeito de

movimento slide right e o botão a gente vai deixar em zoom não tô fazendo em todos porque eu já te mostrei como que faz aí você vai lá e faz no resto tá no botão vai ser o zoom efeito de movimento Zoom in esse aqui pode ser só fiding clica avançado efeito de movimento fiding e aqui no botão a gente vem avançado efeit de movimento e deixa Zoom in aqui vamos colocar só o f in avançado efeit de movimento F in aqui também a gente deixa só o botão vem aqui em avançado e deixa zoom

no botão Esse aqui esse contêiner a gente vai clicar vai vir em avançado efeit de movimento animações de entrada vamos deixar slide left e esse aqui avançado efeito de movimento slide right pronto Atualiza aí vamos ver ó Isso aqui faz dein esse aqui vai vir um do lado do outro e o outro Zoom aí eu fiz só em alguns por exemplo nesses daqui eu ainda não fiz tenho que fazer nestes daqui do lado eu ainda não fiz tenho que fazer então aí no seu você vai colocando todos ok então é isso o layout a gente

terminou aqui agora e aí fica faltando o passo três ó vamos passar novamente por esse passo aqui que é definir a página de início se você fez certinho quando você acessa aqui o o link do seu site que é esse quando você acessa ele você já vai pra página de list se você tiver pulado essa parte vai estar aparecendo os posts e para você corrigir isso você vem aqui no painel configurações leitura tem que estar assim ó sua página inicial exib tem que estar assim uma página estática aí você vem e seleciona a página início

e a página de postes você seleciona blog e depois clica em salvar ok então fica assim Vamos para o passo TRS o passo três eu não vou ensinar nesse vídeo porque são várias coisas que você pode fazer para melhorar o seu site para melhorar o desempenho dele e todos esses vídeos aqui tem no canal então tem vídeo de se te ensinando a configurar o site pros mecanismos de busca tem otimização para te ensinar a deixar o site mais rápido lgpd que é a lei geral de proteção de dados que é obrigatório você colocar no site

tem vídeo aqui no canal cadastrar nas ferramentas do Google se você quiser fazer análise e melhorar o seu marketing como Google Analytics search console tem vídeo aqui no canal canal tem uma playlist de design para você aprender a criar banners se você quiser criar outros banners diferentes tem vídeos aqui ensinando também playlist de Marketing com elementos se você quiser instalar Pixel do Facebook etc plugin de segurança que é muito importante também você ter para evitar que seu site pegue vídeos seja invadido então é importante você configurar e também como fazer o backup esse daqui é

um dos mais importantes porque se aconteceu alguma coisa seu site foi invadido você esqueceu de pagar sua hospedagem e o site foi excluído você tendo um backup você não precisa criar tudo do zero você pode só subir o arquivo lá e restaurar e pronto tá então é muito importante você aprender a fazer backup e ir fazendo tá E lembrando que este projeto está disponível aqui na nossa loja de templates então se você não quiser criar do zero você pode vir aqui ó em templates.descomplicandosites.com.br vou deixar o link na descrição do vídeo aqui na aba de

sites empresariais você vai encontrar Exatamente esse mesmo projeto ó site do Dr Antônio aí você efetuando a compra você faz o upload dele no seu site você coloca ele aí no seu WordPress e ele fica igualzinho está aqui você precisa só ir modificando os textos você não precisa criar toda a estrutura como eu ensinei nesse vídeo tá vou deixar o link aqui na descrição se você quiser ir lá adquirir Então é isso pessoal este foi o site que a gente criou Espero muito que vocês tenham gostado. Se você curtiu deixa um like no vídeo, um

comentário, se inscreve no canal, me segue nas redes, um abraço, até a próxima, tchau.