Como Criar um SITE NO WORDPRESS com Elementor 2024 [Criar Site Profissional Multipage Passo a Passo]

Neste vídeo eu vou te ensinar a criar um site profissional com o WordPress e o Elementor Fala pessoal, tudo bem? Aqui é a Micaela do Descomplicando Sites e eu estou de volta com mais um vídeo de site completo para vocês. Dessa vez eu vou te ensinar a criar um site com várias páginas, antes de ir lá para o tutorial eu vim pedir para você deixar um like nesse vídeo que você sabe que ajuda demais o canal a crescer e para você se inscrever no canal, tá?! Então é isso, vamos lá para a tela do meu

computador agora. Então vamos lá pessoal, antes de começar o tutorial eu quero deixar alguns avisos aqui que é muito importante que você ouça principalmente se você for iniciante, se for a primeira vez que você estiver fazendo um site. Primeiro, eu recomendo que se for a primeira vez que você estiver fazendo um site, você primeiro assista o vídeo para se familiarizar com as ferramentas e ver como é que vai ser. E aí depois você assiste de novo replicando e fazendo o seu próprio projeto, tá? assim eu acredito que a curva de aprendizagem vai ser melhor, OK?

outra coisa, durante esse vídeo eu vou sempre falar para você que eu deixei no Drive né que é uma pasta que nós temos aqui no Google que eu sempre deixo materiais para você eu sempre vou falar que deixei imagens lá porque eu sempre deixo as imagens do projeto para vocês baixarem os ícones tudo que eu vou usar no projeto sempre deixo lá para você aplicar igualzinho o projeto se você quiser Ok e todo o material dessa aula fica aqui na descrição do vídeo Então você vai estar aqui assistindo vídeo só rola um pouquinho para baixo

tem aqui a descrição Tá vendo você clica em Mais e aí você vê a descrição completa Então aqui tem um material toda aula então aqui Quando eu disser tá lá no Drive você vai vir aqui embaixo do material de apoio clica aqui que já vai cair direto na pasta que eu tô falando tá quando citar outros vídeos também quando eu falar assim ah no vídeo de otimização você pode fazer outra coisa vídeo disso você pode fazer aquilo vai ter os vídeos aqui vai ter os outros vídeos linkados que você pode vir conferir na descrição tudo

que eu falo no vídeo eu deixo na descrição para você tá links de plataformas que a gente vai utilizar por exemplo a gente vai comprar a hospedagem Hostinger é a nossa parceira aqui do canal Então vai ter o nosso link aqui ó nós somos afiliados da roshington Se você comprar usando o nosso link você ajuda o canal a trazer mais conteúdos para você apoia o canal então assim eu vou te agradecer imensamente Se você comprar com o nosso link é só você clicar aqui e nós temos o cupom de desconto também que você vai conseguir

usar mais para frente Vou mostrar como que a gente vai fazer tá bom Outra coisa se você estiver achando que o tutorial tá sendo muito rápido muito devagar não tem problema você pode vir aqui na engrenagem do YouTube virem velocidade e aí você pode colocar ou mais rápido nessas aqui de baixo ou mais devagar nessas aqui de cima tá para ficar melhor do jeito que você preferir então ok dados os avisos vamos lá eu fiz aqui um mapa mental para poder auxiliar a gente nos passos que a gente vai seguir para criação aqui do nosso

site tá a primeira coisa que a gente vai fazer é a compra do domínio e da hospedagem um domínio ele é o link do nosso site esse link aqui personalizado com o nome exatamente do seu projeto ou da sua empresa você precisa pagar pelo direito de usar um link personalizado como esse não é caro não tá não se preocupe e a gente paga anualmente uma vez por ano Mas não se preocupe com isso eu vou te mostrar mais para frente e a outra coisa que você vai comprar é a hospedagem hospedagem são como se fosse

Mega computador que hospedam os arquivos do seu site e ficam mandando eles para internet assim que a gente consegue acessar as coisas aqui em qualquer navegador e para você utilizar esse serviço você precisa pagar também por esse serviço a empresa que a gente indica é a Hostinger nem eu falei para vocês aqui na descrição desse vídeo que você está assistindo vai ter o nosso link de afiliado e se você quiser comprar com o nosso link vai nos ajudar muito é só você clicar que você vai cair direto aqui na página da Hostinger. A Hostinger e

uma empresa multinacional ela tem vários países então se você tiver fazendo um projeto para outro país também não tem problema vai funcionar perfeitamente tem servidor Aqui no Brasil tem suporte em português os preços são excelentes o serviço da hospedagem em questão de performance segurança é muito bom também e nós temos diversos vídeos aqui no canal ensinando você usar mais da plataforma eu vou abordar só os necessários para criar o site aqui mas não se preocupe que aqui tem vários vídeos sobre a Hostinger também para você aprender tudo que você precisa ok chegando aqui você vai

perceber que eles deixam sempre os três planos principais que eles costumam vender né todos esses planos aqui são maravilhosos o que difere dele aqui o que você tem que prestar atenção são as diferenças de capacidade aqui então por exemplo esse plano aqui que é o prêmio ele te dá direito a criar até 100 sites no mesmo plano ele te dá 6 GB de armazenamento tem backups tem SSL ele é muito bom só que esse plano Business aqui ele tem até cinco vezes mais desempenho também te dá direito a criar sem sites te dá 200 GB

de armazenamento que é o dobro desse aqui na meditar backups diário tem CDN grátis que o contrário desse aqui esse DNA um recurso que faz o seu site ficar mais rápido tá tem ambiente de teste do WordPress cash de objetos tem mais segurança que contratar então assim ele é muito bom esse plano aqui sabe eu recomendo que você compre ele mas se você comprar esse daqui também não tem problema também o site vai ficar muito bom só que com esse aqui vai ficar melhor quanto mais rápido o nosso site puder ser mas a gente converte

né independentemente do plano que você escolher você vai clicar aqui em adicionar ao aí ele já vai te redirecionar para a página de pagamento se você não tiver logado ele vai aparecer aqui embaixo para você criar a sua conta aí você segue o fluxo normal coloca o seu e-mail ele vai pedir outros informações eu já tenho uma conta na Hostinger então só vou clicar aqui em cima login e efetuar o meu login ó aí eu logo já tá meu nomezinho ali em cima tá vendo e aí aqui você escolhe a quantidade de tempo que você

quer comprar você pode pagar por mês comprar de 12 em 12 meses né um ano 24 meses que são dois anos ou 48 meses tá você pode perceber que quanto mais tempo você comprar de uma vez mais barato vai ficar a cada mês então se você colocar lá para descontar mesa mesmo Olha só vai ficar 64 e 99 por mês Se você comprar 12 meses cai para menos da metade Então olha só cada mês ficaria 24 e 99 né por 24 meses é a mesma coisa cairia para 22,99 cada mês né E você também consegue

parcelar fosse na prática seria praticamente a mesma coisa de descontar mesa a mesa mesmo só que aí assim compromete o limite do seu cartão né então esse daqui ó aqui embaixo já mostra para você quanto que fica então assim esse primeiro ano ele vai ficar 299 E aí você tem o nosso desconto lembra que a gente tem o nosso cupom de desconto aqui ó que você pode vir aqui copiar o nosso cupom de desconto quer descomplicando os sites aí você clica aqui ó tem um cupom e cola aplica e ele já diminui aqui ó para

269 tá e você pode efetuar o pagamento da maneira que você quiser eu vou deixar cartão de crédito mesmo aqui vou clicar em enviar pagamento ele vai abrir aqui um formulário para eu poder preencher com meu cartão aí eu vou preencher aqui os meus dados aí você consegue vir aqui tá vendo escolher o parcelamento se você quiser pode parcelar em até 12 vezes eu vou preencher aqui com os meus dados depois vou clicar e pague agora Olha quando o pagamento Ele carrega para essa página e aí aqui a gente começa a fazer a nossa configuração

você pode clicar em comece agora aí aqui a gente vai clicar em pular quero criar um site do zero que eu vou mostrar para vocês lá dentro do painel e aqui ah eu esqueci de falar isso para vocês aqui no plano da Hostinger ele te dá direito a um domínio um ano de domínio grátis ó em todos esses planos aqui você tem um ano de domínio grátis Tá vendo lembra que eu falei para você que o domínio é o link do seu site a gente paga anualmente Então você comprando aqui na Hostinger em qualquer um

desses planos o primeiro ano do seu domínio você não precisa pagar ele sai gratuitamente tá então aqui você pode clicar para selecionar e escolher o domínio gratuito que você vai querer gratuito no primeiro ano aí depois de um ano você começa a pagar por ele tá E aí eu acho legal você vir aqui do lado de fora da Hostinger e vir aqui em domínios para você poder fazer uma pesquisa melhor aqui do seu domínio para ver se ele tá disponível Então você aqui escreve o nome do jeito que você quer por exemplo o nome que

eu vou querer é Anastásia estética Lembrando que todos os sites que eu ensino fazer aqui são fictícios tá eu faço só para ensinar vou clicar aqui em procurar ele vai me dizer se está disponível Esse nome que eu quero tá vendo a gente tem que procurar um domínio que esteja disponível.com.br o ponto br que é de Brasil que a extensão do nosso país e o ponto com é importante que esteja disponível os dois porque pode acontecer de você comprar só o ponto com.br E outra pessoa ter comprado o ponto com nesse caso aqui tá disponível.com

também tá vendo Então se você comprar só o ponto br outra pessoa vai lá e compra um nome igualzinho seu com ponto com e fica competindo com você pode até passar golpes falando que é você e as pessoas podem acreditar porque né vai estar com domínio praticamente igual o seu só vai ser ponto com né Então pensa você comprar os dois e você vê que não é muito caro então o domínio e ponto com ele custa 49 e o domínio.com.br 39,90 então essa parte aqui é só para a gente pesquisar para ver se ele tá

certinho mas ele está disponível estando aí você vai lá e escolhe se não tiver disponível do jeito que você quer você pode dar uma mudada por exemplo se não tivesse disponível esse eu poderia colocar mudar a ordem estética Anastásia clínica anastase estética entende então você vai mudando aí a dinâmica das palavras até dar uma que você queira pronto aí aqui você vem e coloca o que você vai querer e aqui você escolhe a extensão eu vou escolher a.com.br aqui que a extensão do nosso país para poder pegar o domínio gratuito vou clicar em pesquisar ou

ele vai falar que tá disponível e vou clicar em continuar aí que tem alguns dados vou finalizar o registro ele pede para você escolher qual servidor aqui já está o Brasil se você estiver fazendo esse site para outro país você pode vir aqui clicar no lápisinho e escolher outro país vou clicar em concluir configuração aí agora você consegue vir aqui clicar em gerenciar site e você vai vir para o painel da Hostinger que a sua hospedagem Esse vai ser o painel aqui da sua hospedagem Porque que a gente vai instalar o nosso WordPress tá se

você tiver deslocado né Se tiver acontecido alguma coisa se você tiver precisado sair você vem no site da Hostinger clique clique em login aí você vai cair nessa página tá vendo aí é só você vir aqui em hospedagem vai estar apenas um quadradinho aqui no seu o meu tem vários porque eu tenho vários planos aqui né Mas aí o seu vai estar assim né um quadradinho só aí você vai clicar aqui em site vai clicar aqui no seu domínio e aí você vai vir para essa página aqui que é a página que a gente vai

usar Ok está com esse vizinho aqui vermelho porque o nosso domínio ele ainda não está sendo apontado aqui para Hostinger tanto que se você acessar esse link aqui ó ele vai estar assim e isso é normal porque a demora até 24 horas para eles poderem fazer o que a gente chama de propagação que são as configurações que eles fazem para poder registrar o domínio no seu nome apontar o domínio aqui para Hostinger e a gente conseguiu usar quando tiver tudo pronto você vai conseguir acessar aqui vai aparecer uma página roxinha da Hostinger aí você vai

conseguir saber que o domínio está funcionando tá mas por enquanto você aguarde seria melhor comprar os dois domínios o ponto com e o ponto br para evitar que outra pessoa compre o nome igual a você e concorra com você faça golpes com seu nome então se você quiser comprar o outro domínio pode vir aqui em domínios aqui dentro mesmo do painel você pode comprar outro por aqui ó aqui ele já tá até me falando aqui ó Compre agora mesmo ponto com aí Se tiver aqui aparecendo você pode clicar em comprar senão você pode clicar aqui

em obter novo domínio aí aqui você escreve né o domínio do jeito que a gente quer você pode até colocar ponto com aqui logo e clique em pesquisar que ele vai aparecer aqui para você comprar agora aí você vai clicar em comprar vai efetuar aqui a compra do jeito que você quiser o cartão do jeito que você quiser e aí você vai clicar em finalizar pagamento aí vai ter o mesmo processo clique em finalizar a compra e vai aparecer aquela mesma telinha Você pode clicar em continuar ok Aí depois que você fizer a compra ele

vai estar aparecendo aqui né que você comprou E aí se você voltar aqui em hospedagem vai estar assim para você ainda não vai estar aparecendo aqui no seu plano para que ele fique aqui para a gente Conseguir configurar com ele você precisa vir aqui clicar nesses três pontinhos clicar em adicionar site clicar em pular clicar em pular de novo aí aqui você vai escolher o domínio né já tem um existente que é o que a gente comprou Você vai clicar aqui nele clicar em selecionar gerenciar site aí agora sim a gente consegue fazer qualquer configuração

com ele quiser até criar um outro site com ele consegue e se a gente vier aqui em hospedagem vai estar mostrando aqui dois links dois domínios ponto com e o ponto br aí agora é só a gente esperar pode acontecer também ó se você vier aqui no domínios tá vendo pode acontecer de estar validação pendente você pode clicar aqui em gerenciar para você poder acompanhar o processo mas olha só vai estar desse jeito com erro isso é normal tá bom que nem eu falei na hora que tiver uma página roxa da Hostinger que vai estar

disponível para a gente fazer o site E aí eu volto na hora que tiver propagado que é quando tiver com essa página roxa da Hostinger passaram-se já algumas horas E aí Eu recarreguei aqui a página Essa é a página roxa que eu falei para vocês tá E aí se você tiver deslocado que nem eu te falei você vem na Hostinger no site da Hostinger clica lá em cima no login aí você vai cair aqui no início aí você pode clicar por aqui né Vai estar aparecendo só um ou você pede para você eu tenho várias

pista parece um monte aqui você pode clicar em gerenciar ou então você pode clicar aqui em hospedagem vai estar aparecendo assim para você só um Você vai clicar aqui em dois sites vai escolher o domínio que você quer que é esse aqui.com.br que a gente comprou tá em contato você clica em cima e aí aqui você vai abrir o painelzinho tá se você tiver clicado no errado não tem problema ó tá vendo ó aqui no lado a gente pode alterar entre os dois domínios tudo que eu fizer aqui só vai configurar nesse tudo que eu

fizer aqui só vai configurar nesse ponto tá ó você atende está no domínio correto aqui que é esse plano.com.br OK agora a gente vai fazer aqui o segundo passo que a instalação do WordPress e o SSL o SSL é esse cadeadinho que fica aqui ó em todo link que a gente acessa praticamente na internet que é uma configuração que deixa o acesso ao site mais seguro né os dados ficam fotografados fica mais seguro e isso é gratuito aqui na Hostinger quando você instala WordPress eu já instala automaticamente então para instalar o WordPress a gente vai

vir aqui em site ó tá vendo na abinha aqui do lado você clica aí vai ter que Auto instalador você clica aí vai ter WordPress você clica nele selecionar E aí aqui a gente vai fazer as configurações WordPress ele é o software que a gente vai usar para criar o nosso site ó a gente comprou a hospedagem que é a empresa que vai mandar os nossos arquivos para o ar e a gente comprou o domínio que é o link né com o nome do nosso projeto da nossa empresa isso que a gente comprou é a

base para a gente poder criar o que a gente quer colocar na internet e aí a gente vai usar o software chamado WordPress que é uma coisa separada para poder criar o nosso site os nossos arquivos são os arquivos desse WordPress que é hospedagem vai ficar enviando para internet entendeu aqui você vai configurar as informações que vão aparecer no seu site então aqui título que vai aparecer no seu site aqui no meu descomplicando o site tá vendo que tem um título ali em cima ó desconfiança site é bem esse título esse título que vai ficar

aqui aqui no meu caso eu vou colocar Anastasia estética avançada Ah tá não pode ter acento nem pontuação não tá lembrando mais uma vez que esse projeto É fictício não existe eu criei tudo todo o texto todo layout tinha logo tudo para ensinar para vocês Tá bom é só fictício aí eu criei esse nome aqui também para colocar aqui você coloca o e-mail que você vai usar como login lá e aqui geralmente ele pega o primeiro nome do e-mail Mas se você quiser mudar pode mudar e aí na hora que você for logar lá você

consegue logar com esses dois nomes de usuário esse daqui que você colocou ou e-mail que você colocou tá e aqui você coloca uma senha vou colocar a minha pronto aqui em avançado você pode deixar como está tá bom não precisa colocar nada ele já pegar automaticamente aí você clica ali próximo vai te deixar sabia aqui você escolhe qual que é o idioma que você vai usar no WordPress né nossa é português do Brasil se você tiver usando outra língua só você escolher outra língua aqui e clica em instalar Pronto ele já fez a instalação aqui

do nosso site tá E aí ó se você acessar aqui o seu domínio ele já vai ter mudado a carinha tá vendo isso acontece porque a gente instalou o WordPress esse aqui já é o software tá e o seu site já está no ar muita gente perguntar como que eu faço para colocar o site no a partir do momento que você instaloudpress ele já está no ar só que tá mostrando só isso aqui porque vem ele vem padrão né E aí para você poder deixar ele do jeito que você quiser a gente vai configurando moldando

que é o que a gente vai fazer aqui nos próximos passos Tá mas seu site já está no ar qualquer pessoa quer acessar esse link vai conseguir ver o que você estiver configurado lá beleza e aí que nem eu te falei ele já trouxe o SSL automático aqui tá vendo e agora nós vamos partir para o passo 3 que é a configuração aqui do nosso WordPress quando você está aqui no WordPress através da Hostinger você pode clicar aqui em editar site que você já vai cair lá dentro do painel lembrando WordPress é o software que

a gente vai usar para criar o site a te direciona para lá tá vendo esse é o painel se você quiser você pode até fechar a Hostinger ir agora porque a gente vai trabalhar só no painel do seu site aqui tá então assim se você tiver na Hostinger Você já consegue logar aqui mas se você não tiver eu vou sair aqui deslogar para você ver se você não tiver logado na Hostinger tudo bem Toda vez que você quiser entrar no painel do seu site é só você vir aqui no seu link você vai colocar /WP-admin

Essa é a página de login para você entrar aqui no seu site Aí você coloca aquele login e senha que você criou E aí você vai entrar aqui no painel é bom salvar a senha para ficar salvo aqui no seu navegador mas Lembrando que nem eu te falei se você por acaso tivesse esquecido a sua senha não lembrar o que que você colocou não tem problema você pode logar aqui pela Hostinger aí você vai clicar aqui em hospedagem ele vai vir no lugar que eu te ensinei vai clicar aqui ó Anastácio aí você vai clicar

aqui em cima em WordPress visão geral aí aqui vai ter editar site tá vendo se você clicar aqui editar site ele já te loga automaticamente para esse painel aqui tá bom E aqui se você quiser você consegue ver quem usuários todos os usuários clicar aqui no seu e alterar aqui a sua senha tá bom para você que você lembre para você não precisar entrar na Hostinger toda vez beleza a primeira coisa que a gente vai fazer aqui é instalar o nosso tema como se fosse aplicativos que a gente instala aqui no nosso WordPress para não

dar mais recursos a gente usar no site por exemplo o seu telefone ele não vem com a função de você entrar no banco né instalar um aplicativo de uma empresa específica com a configuração específica os funcionários específicas porque te permita usar banco uma conta mesma coisa que no WordPress para a gente conseguir ter configurações do jeito que a gente quer a gente vai instalando plugins e temas que é o que vai nos dando essa função tá E aí o tema que a gente vai usar é o Hello Elementor a gente instala o tema a gente

vem aparência temas WordPress ele já instala por padrão esses três aqui que são feitos a gente não vai usar quando a gente tem temas aqui que a gente não tá usando a gente pode excluir você clica aqui em cima clica aqui clica aqui clica excluir clique em OK aí você vem Adicionar novo geralmente ele já fica aqui nos mais populares tá vendo É esse aqui o Hello Elementor ele não tiver você pode pesquisar Hello Elementor aqui na lupinha e vai aparecer você vai clicar em instalar depois em ativar aí agora já vai liberar para a

gente poder excluir esse outro pronto ficou só o Hello elementor que é o que a gente realmente vai usar aqui tá Agora a gente vai criar as nossas páginas vai criar as páginas que a gente vai usar no site aqui eu criei seis páginas Roma especialidades sobre nós nossa equipe blog contato nós vamos criar elas aqui a gente cria aqui ó páginas todas as páginas primeiro a gente vai excluir essa página de exemplo é só selecionar ela e clicar em lixeira essa daqui de políticas de privacidade a gente pode clicar aqui editar seja clica aqui

em publicar que ela vem como rascunho tá vendo que depois a gente vai configurar ela só para ela ficar aqui já publicada aí agora para a gente criar uma nova a gente clica aqui em adicionar nova vamos dar o nome aqui o título da nossa página home E aí é só você clicar ali em cima e publicar tá vendo publicar publicar é duas vezes que você clica depois clica aqui no WordPress para voltar adicionar página agora a especialidades especialidades publicar publicar volta para o WordPress adicionar nova página sobre nós publicar publicar hoje Pede de novo

nossa equipe publicar publicar hoje para de novo blog Obrigado de novo adicionar contato aí agora se a gente voltar aqui né a gente consegue ver todas as que tem homem especialidade nossa equipe sobre nós contato blog caso que a gente precisa Beleza agora a gente vai configurar os links da página inicial quando a gente acessa aqui o nosso site a gente pode perceber ó ele tá assim mas se você recarregar de novo ele vai atualizar para as configurações que está agora que é essa daqui essa carinha do Hello elementor que é o novo tema que

a gente instalou mas fica tranquilo tudo personalizado a gente vai transformar o site nisso aqui aí tá vendo que tá mostrando aqui arquivos Ou seja a gente clicar a gente até vai para o arquivo Então isso é porque o expresso por padrão ele mostra a página inicial com uma página de blog e a gente não quer isso a gente quer que a página principal seja a nossa página home que é a primeira página que aparece tudo isso e aí para configurar isso a gente vem aqui no painel administrativo do WordPress e vem configurações leitura aí

tá vendo aqui ó sua página inicial exibe você vai escolher uma página estática e vai escolher a página home para ser a sua página e aqui na página de posts que é onde vai ficar os artigos do blog a gente clica em selecionar e selecionar página blog E aí a gente clica aqui e clica em salvar alterações Prontinho se a gente atualizar aqui aí já não vai mais aparecer tá vendo ele arquivo parece só o título da página home Beleza agora a gente vai instalar o plugin Elementor free que é o plugin que a gente

vai usar para criar ó quando a gente instala o tema Hello Elementor como ele depende do Plugin Elementor ele já fica pedindo para a gente instalar ele aqui tá vendo o Elementor ou frio o elementor grátis você pode clicar aqui em instalar ele já vai fazer a instalação porque ativar o plugin E aí nesse que a gente pode pular ó tá vendo Sempre que você tiver logado se você acessar essa página aqui até WP traçar de mim você vai estar no painel administrativo ou se você apaga o resto do link você sempre volta aqui para

esse painel tá então ó se por acaso não tivesse aparecendo aquele aquela notificação para você então o Elementor era só você vir Adicionar novo pesquisar aqui na lupinha por Elementor E aí ele aparece aqui ó ele também Chega aqui dos mais populares tá vendo É esse daqui Ele mente aí você clica em instalar e depois em ativar e pronto ele vai estar ativo também agora a gente vai comprar e instalar o elementor pro o elementor pro é a versão paga desse plugin Elementor e ele vai ser responsável por várias funções a mais que a gente

vai precisar no site tá esse site tem várias funções do Elementor pro se você não quiser usar o Elementor pro tem tutorial aqui ensinando a criar o site com Elementor free é este site aqui ó tá eu criei ele todo com o elementor aí se você quiser criar sem pagar o Elementor aí esse aqui seria o tutorial para você aí você poderia assistir e adaptando layout né para ficar parecido com isso aqui se você quiser só você vir aqui no canal nessa lupinha que tem aqui dentro embaixo não é de cima a que tem aqui

embaixo você pesquisa nutre e ele já vai aparecer este vídeo aqui tá aí você não precisa fazer toda a compra da hospedagem de novo não você parte aqui depois da instalação do WordPress todos os vídeos aqui do canal aqui embaixo é dividido em capítulos aí você parte para cá configurando WordPress ok Beleza então para a gente poder comprar o Elementor que nem eu falei para vocês embaixo de todo o vídeo tem os nossos links então por exemplo aqui debaixo desse vídeo vai ter na descrição o link aqui do Elementor pro é o nosso link de

afiliado Se você comprar com o nosso link a gente tiver um comissão e você apoia e ajuda o canal a trazer mais conteúdos como esse para você aí você pode clicar aqui nesse link que você vai ser redirecionado lá para página do Elementor é aqui que você consegue comprar o Plugin do Elementor na página toda em inglês mesmo se você quiser traduzir para português você clica com o botão direito do mouse em traduzir para português tá E aí assim se você tiver fazendo apenas um site você pode comprar esse plano aqui ele te dá direito

a usar em um site esses outros aqui é a diferença é que você consegue usar em mais sites tá vendo esse 25 esse até meu site ou se você tiver fazendo só um site esse aqui super compensa para você esse preço que está em dólar você tem que se atentar isso tá então tem que vir aqui dá uma olhadinha de quanto o dólar hoje aí no caso em Reais ficaria 291 se você tiver que dependendo do seu cartão se cobrar alguma taxinha tem que ver a taxa que eles cobram mais para converter mas fica aproximadamente

esse valor aqui para você comprar o Elementor tá aí você vai clicar aqui em comprar agora vai preencher aqui os seus dados e vai clicar aqui em pagar agora efetuar o pagamento o Elementor ele não parcela tá você consegue efetuar o pagamento em uma única vez Então você tem que se atentar isso também tá assim que você fizer a compra no elemento ele já vai te levar aqui para o seu painel você vai conseguir logar aqui você não tiver logado também tiver saída acontecendo alguma coisa não tem problema você pode voltar lá no link que

vai estar debaixo do vídeo aí você clica aqui em login tá vendo aí você vai cair aqui nessa abinha Você vai no processo de compra lá você vai ver que ele manda você criar sua conta para efetuar o login e tudo mais tá aí aqui em cima tá vendo que tem esse íconezinho de download Você vai clicar aqui e vai clicar em cima desse nome que você vai baixar O plugin do Elementor ele não ficou disponível lá dentro do WordPress não ele você tem que vir aqui e baixar ele vai baixar no seu computador ó

se você tiver no Chrome essa essa setinha de download aqui que ele vai estar mostrando tá vendo aí você vai voltar aqui no seu WordPress vai vir aqui em plugins Adicionar novo tá vendo vai clicar aqui Enviar plugin vai abrir essa abinha você vai clicar vai procurar aqui no seu computador em downloads onde tem o Plugin do Elementor essa Pastinha você não precisa descompactar só clicar em cima clicar em Abrir clicar em instalar clicar em ativar o plugin e pronto plugin vai estar instalado e ativo aqui no seu site mas só isso não faz O

plugin Elementor para funcionar você tem que conectar a sua licença tá Quando você compra que o elementor pro você compra o software e você compra direito a um ano da licença para você usar os recursos do elementor pro se você quiser aprender mais sobre as funções da licença tem vídeo aqui no canal explicando tá bom Aí você vem aqui clica em conectar e ativar aí se você não tiver logado ele vai pedir para você logar se você tiver você vai aparecer assim aí você clica em ativar minha licença Pronto pode fechar essa aba aqui do

Elementor que aí nós já finalizamos as nossas configurações do WordPress e agora nós vamos partir para a criação do nosso layout Olha só bastante coisa aqui para a gente fazer a primeira coisa que a gente vai fazer vai ser a configuração padrão do tema as configurações padrões são configurações de cores tamanhos Fontes espessura que a gente vai fazer para que a gente não precise toda hora em todo o item que a gente for usar ficar colocando a cor a espessura da fonte né então a gente já vai deixar tudo mais ou menos configurado para fazer

isso a gente vem modelos salvos aí vai até aqui todos aí vai ter esse The full kit é a configuração padrão aqui do nosso site que aqui se a gente olhar a configuração padrão é essa é preto com cinza com rosa né E a gente vai mudar tudo isso a gente vai clicar aqui em editar vai clicar em editar com Elementor aí ele vai abrir aqui para gente tá vendo aí a gente vai vir aqui vai clicar em cores globais E aí aqui ele mostra para a gente Quais são as cores tá aí eu tenho

essa relação de cores aqui ó você pode pausar e anotar ou eu também deixo para você lá no Drive lá no nosso material você vai só pegando as cores e colocando ó vou pegar essa primeira cor que vai ser essa cor do primário aqui vou colar ela tá vendo você também pode arrastar essa caixinha aqui formar a cor que você quiser ou colar o código da cor aqui tá aqui no secundário eu vou usar essa outra cor aqui que é um marrom mais mais claro Tá vendo essa aqui do texto eu vou deixar esse cinza

e aqui de assento que é a cor de link Geralmente eu vou deixar essa terceira cor aqui que é alaranjado tá aí eu vou colocar aqui em adicionar cor que eu vou adicionar outras cores que eu também usei ó só você selecionar aqui colocar vou adicionar uma nova cor vou pegar essa outra cor aqui que é essa cozinha gelo aqui tá vendo aí você pode nomear com Tá vendo você pode colocar por exemplo gelo tá vendo pode colocar o nome ou não para deixar com aquele nome lá também não interfere vou adicionar também a cor

branca que a gente usa muito né então vou vir aqui vou selecionar tá vendo a cor do branco fff 6 vezes 6 vezes e aqui eu vou vir vou escrever nome Branco pronto aí ele já vai mostrando para gente aqui a nossa paleta de cores olha sempre vai clicando aqui em atualizar para não perder nada vou voltar aqui na setinha e agora nós vamos configurar as nossas Fontes ele também fica mostrando aqui para gente tá vendo a relação para a gente poder ver aí aqui a fonte primária já até deixei o nomezinho dela aqui que

a gente vai usar para esse projeto que é Francis vai selecionar aqui família da fonte aqui tem várias fontes para você escolher tá vendo ó vai rolando e espera um pouquinho para carregar aí você pode clicando aqui e escolhendo a fonte que você quiser eu vou usar essa fonte aqui vendo ó e aí nos títulos eu vou usar tamanho 46 aqui a gente configura o tamanho ela vai ficar grande assim 46 e peso 400 tá no secundário eu vou deixar essa França também e o tamanho dela vai ser 17 peso 600 no texto eu vou

usar muito pops tamanho 12 peso 400 e também vou usar no assento que são os links Pops tamanho 12 peso 400 tá e vou adicionar um novo aqui que eu também vou usar em algumas partes do texto Bob's tamanho 15 peso 400 então você pode fazer assim também tá vendo pode adicionar outros tamanhos aqui e vou clicar e atualizar esse aqui eu vou mudar o nome dele vou colocar texto dois só para a gente ter um nome aqui vou clicar em atualizar aí a gente vai voltar e a gente pode fazer algumas configurações aqui no

site aqui nos botões eu vou vir vou deixar aqui arredondamento 30 que é para ele ficar assim arredondadinho tá vendo a cor de fundo vou vir aqui nesse mundinho sempre que tiver Esse mundinho você consegue selecionar as configurações padrões aqui que a gente configurou tá aí eu vou selecionar essa daqui e a cor do texto eu vou deixar essa primária aqui beleza e é tipografia vou vir vou pegar essa de acento e vou clicar em atualizar pronto botão já vai estar configurado os cantos do formulário eu não vou configurar Por enquanto não tá então Por

enquanto já fizemos Aqui as nossas configurações do tema Agora vamos começar a criar o nosso layout vamos começar pela criação do menu o menu ele é dividido em duas partes primeiro a gente cria ele dentro do WordPress depois a gente cria o layout o menu são esses links que a gente coloca aqui em cima tá vendo que a gente usa para poder acessar as nossas páginas ou partes aqui do nosso site E aí como são links primeiro a gente tem que criar dentro do WordPress e a gente cria eles aqui em aparência menus foi por

isso que a gente criou as nossas páginas primeiro para poder criar o menu aqui puxando o link daquelas páginas então aqui não tem nenhum menu criado primeiro a gente vai criar o nosso menu aqui em nome do menu a gente vai colocar o nome que a gente quiser eu vou escrever menu principal aqui já fica aparecendo aqui para mim que eu sempre coloco ele puxa Você pode escrever no seu aí eu vou clicar aqui em criar menu pronto aí aqui eu vou criar vou clicar aqui tá vendo em páginas em ver tudo e vou as

páginas que eu quero Então vou selecionar home especialidade nosso equipe sobre nós blog e contatos só a política de privacidade que eu não vou colocar vou clicar em adicionar ao menu e aqui a gente pode reordernar tá vendo blog é o penúltimo contato eu quero que seja o último sobre nós eu vou colocar aqui para cima eu vou colocar a especialidades nossa equipe deixa ver como é que tá especialidades sobre nós nossa equipe especialidades sobre nós nossa equipe blog contato e vou clicar em salvar menu aqui eu não fiz mas se você quiser depois você

pode colocar sub-minus mas para frente tutorial eu vou colocar e vou colocar aqui para você aqui em nossas especialidades é legal ter outras opções aqui no subment para facilitar a busca do cliente tá mais para frente Vou criar e a gente volta aqui mas por enquanto vai ficar assim lembra sempre de salvar o menu aqui para não perder e aí sim agora a gente vai começar a criar o nosso layout deixar o nosso menu assim por enquanto se a gente acessar o nosso site o menu ele não aparece tá vendo ele não aparece ele só

aparece quando a gente começa a configurar e para a gente começar a configurar aqui o nosso layout a gente vai vir aqui no painel de administrativo do WordPress vai vir em modelo Adicionar novo a gente vai criar com Elementor agora né vai clicar em selecionar vai selecionar aqui a opção de header é menu em inglês e aí aqui a gente vai dar um nome para o nosso modelo esse vai ser um modelo que a gente vai estar criando com plugin Elementor vou escrever só menu mesmo vou clicar em criar modelo Lembrando que se não apareceu

para você aquelas funções anteriores ali é porque você não comprou o elementor pro tá aí você tem duas opções ou você volta o vídeo compra o elementor pro ou você assiste um outro vídeo aqui no canal para aprender a criar menus com elemento vai ter aqui na descrição do vídeo se você quiser tá ó você pode fechar esse daqui e a gente vai começar nossa configuração Ah tá faltou uma coisinha antes a gente vai vir aqui no painel administrativo do Wordpress vai vir em elementor configurações vai vir aqui em Recursos e a gente tem que

deixar ativado container flexível Flex Box container Xbox contêiner é a nova tecnologia do Elementor e eu tô sempre criando os vídeos aqui de site completo com essa nova tecnologia tá E aí para ativar a gente vem aqui container deixem ativo Desce aqui embaixo clica em salvar alterações tá aí você vem aqui recarrega essa página aí se você clicar no Mazinho e tiver aparecendo essa setinha para baixo para o lado já vai estar ativo aqui para você a função do container outra coisa que a gente vai ativar também é o Grid container que é outra configuração

recente que o Elementor lançou para ajudar a gente também é essa daqui tá vendo Grid container você vai clicar aqui vai clicar em ativar vai clicar em salvar e se você recarregar Quando você clicar aqui vai ter as duas opções que é o Flex Box normal e o Grid container tá tem vídeo só sobre Grid container aqui no canal a gente vai usar em algumas partes beleza vamos de uma vez por toda começar a nossa configuração a gente vai vir aqui vai clicar no maisinho vou pegar aqui o Grid vou pegar esse daqui tá vendo

que ficam do lado do outro que aí eu não preciso configurar aí eu vou vir aqui na biblioteca vou pegar primeiro uma lista de ícone vou arrastar para cá aí eu vou excluir todos Vou deixar só um E aí aqui eu vou colar esse endereço aqui né sempre bom quando a pessoa entra no site de uma clínica de um lugar físico para as primeiras coisas que ela procura aqui é o endereço e o telefone então é bom ter essas informações aqui a gente vai colocar o endereço aqui nesse íconezinho a gente vai clicar e aí

a gente vai procurar pelo ícone de mapa que é esse a gente vai selecionar e vai clicar em inserir a gente vai voltar aqui na biblioteca vai pegar o vídeo de redes sociais só digitar social que vai aparecer aqui vai arrastar aqui para o lado aí ele vem com esses padrões e a gente pode excluir alguns e adicionar os que a gente quer eu vou deixar aqui Instagram Tik Tok Facebook WhatsApp eu já tenho Facebook aqui né vou adicionar mais um aí eu vou mudar vou colocar o Instagram vou adicionar mais um vou mudar vou

colocar aqui o WhatsApp vou adicionar aí nesse daqui eu não tenho o do TikTok então eu vou enviar o arquivo svg vou clicar aqui em ativar para a gente conseguir subir arquivos svg para cá vou clicar nele enviar arquivos vou vir aqui download e vou pesquisar pelo ícone do TikTok que eu tenho aqui é esse aqui lembrando que eu vou deixar lá no material para vocês vou clicar aqui em Abrir vou clicar em inserir mídia ele vai ficar aqui o íconezinho do TikTok para mim pode arrastar e eu der nada do jeito que você quiser

e aí para pessoa conseguir passar o mouse aqui conseguir clicar no ícone você tem que vir em cada um desses e colocar o link aqui tá vendo eu vou colocar em todos o link aqui do meu Instagram só para poder exemplificar para vocês meu Instagram é esse inclusive Me segue lá eu sempre deixo aqui no Stories caixinha de perguntas respondendo dúvidas de vocês Então você vai colocar aqui o link Lembrando que todo link que redes sociais você tem que clicar aqui na engrenagenzinha garantir que esteja abrindo uma nova janela e garantir que esteja marcado na

flor também tá aí você vai vir e todas as redes sociais aqui você coloca o link correspondente que a rede social tá beleza esse ícone aqui do Facebook eu vou clicar aqui e vou mudar eu vou vir em todos os ícones aí aqui do lado já vai ter o do Facebook vou clicar em inserir para a gente ficar com o mesmo padrão de ícones que a gente tem nos outros tá aí eu vou vir aqui em forma vou virar arredondado vou mudar para círculo vou vir em alinhamento vou deixar aqui alinhada à direita vou vir

em estilo tamanho vou deixar ele bem pequenininho aqui já tamanho 12 vou vir aqui em cor vou mudar para personalizar essa cor primária eu vou pegar essa cor gelo que eu tenho essa cor secundária eu vou pegar essa primeira aqui que é marronzinho vou vir aqui no Meu Container principal vou vir em estilo tipo de fundo vou vir aqui vou pegar essa cor salmão que eu tenho aqui e aí esses ícones eu vou ver neles vou vir aqui nessa cor gelo vou vir aqui vou arrastar a Barrinha para ele ficar transparente tá vendo não quero

que fique bem quase invisível aqui pronto vou aumentar um pouquinho vou deixar tamanho 13 vou vir aqui ícone ao passar o mouse vou deixar aqui grow para que quando a gente passar o mouse ele cresça tá nesse daqui eu vou vir em estilo texto vou ver aqui tipografia vou pegar esse secundário vou mudar a cor aqui para marrom também vou diminuir um pouquinho aqui o tamanho vou deixar tamanho 15 e peso 400 vai ficar sem essa Barrinha vou vir aqui nesse container vou vir aqui em layout vou deixar eles aqui alinhados ao centro Para não

ficar um para cima outro para baixo vou vir aqui em avançado vou vir aqui impede vou deixar 5 de pede vou vir aqui vou virar de novo vou pegar outro aqui com dois vou vir vou pegar o ícone de site logo ele não tem nenhum configurado Então a gente vai primeiro ó clicar aqui nessa setinha clicar em salvar raspoin para não perder nada vai vir aqui entende logo do site para a gente configurar né a nossa logo aí eu vou clicar aqui Enviar aqui vou arrastar a imagem da minha logo para cá eu vou deixar

para vocês aqui a imagem da logo então se você quiser você vai lá no dry você vai pegar né Essa louco vai clicar em abrir vai arrastar para cá vai clicar em selecionar ela vai ficar assim o five com a gente já pode configurar também o five ícone aquele íconezinho que fica ali em cima tá vendo por padrão ele vence mundinho se a gente quiser que fique o íconezinho bonitinho aqui da nossa logo a gente vem clica enviar arquivo seleciona vou deixar para você o five também é esse aqui vai clicar em Abrir selecionar E

aí vai clicar em atualizar Prontinho a gente já pode clicar no x E aí ó a gente já vai deixar aqui alinhado aqui à esquerda vamos vir aqui na biblioteca vamos pegar o widget aqui de WordPress menu vamos arrastar para cá ele já vai puxar o nosso menu que a gente criou tá vendo a gente pode voltar aqui no nosso container aí você vai clicar na imagem vai deixar aqui alinhada à esquerda aí você vai vir aqui em estilo largura largura máxima vai deixar 39%. isso aqui é de acordo com o tamanho da minha imagem

tá como eu quero usar ela maior depois aí eu tô controlando aqui só a largura aí você vai fazendo assim tá vendo ó arrastando aqui vendo qual o tamanho que você acha que fica legal aí para sua tá vou deixar 39 beleza aí aí nesse aqui no menu você vai vir aqui estilo tipografia você pode vir aqui pegar o secundário ainda não é o que a gente precisa a gente vai clicar aqui no lápisinho vai terminar de configurar eu vou colocar aqui tamanho 16 peso 400 Ok a cor eu vou colocar aqui no mundinho vou

selecionar essa do primário aqui em conteúdo eu vou mudar o estilo aqui do meu tá vendo esse meu esse meu traçado que tá aqui eu vou mudar o estilo da animação dele eu vou colocar esse dropinho aqui que aí ele vai aparecer assim aí eu vou vir aqui nesse estilo no Hover que a ação de passar o mouse eu não quero que mude a cor então vou deixar o mesmo marrom e aqui no Pointer o Pointer é esse tracinho que aparece embaixo eu também vou deixar de marrom eu quero que apareça só o Pointer aqui

tá vendo aqui a largura do Pointer eu vou deixar um Pera aí apareça fininha assim beleza agora a gente vai configurar o espaçamento eu vou aqui nesse container vou vir aqui em colunas né a gente vai configurar o espaçamento das colunas vou clicar aqui vou clicar no lápisinho aí eu vou colocar um fr2 FR e aqui vai ficar na proporção aqui de um texto para dois terços tá se você achar que aqui ficou muito pequeno seu o seu menu é grande tá quebrando você pode aumentar aqui tá vendo ó colocar três FR que aí vai

ficar assim tá eu acho que eu vou até deixar Nossa proporção aqui beleza aí aqui o menu a gente vai clicar nele vai vir aqui em conteúdo vai deixar ele aqui alinhado à direita também para ele ficar para cá e a logo ficar para cá vou vir aqui nessa nesse contenê de novo aí a gente vai ver aqui em lacunas lacunas é o espaçamento entre as linhas tá vendo percebe que na hora que eu fecho ele fica com espaçam aqui a gente precisa vir aqui em lacunas a lacuna da linha vou deixar zero para ele

não ficar com Nenhum espaço aí ficar só o espaço aqui do container nesse aqui de cima eu vou fazer a mesma coisa eu vou clicar vir aqui em lacuna lacuna da linha vou deixar zero ele tá colocando para os dois aqui mas tudo bem Ó aí agora ficou do jeito que eu quero fininho ali em cima e Fininho aqui embaixo beleza sempre clicando aqui nessa setinha clicando aqui em salvar rascunho para isso acontecer alguma coisa você não perder tá aí a gente já tem aqui a configuração do menu para o desktop que é o computador

agora a gente vai configurar para o mobile que é para o celular ó se você clicar aqui em modo de responsivo ele vai aparecer essas três opções computador tablet e celular eu vou ensinar você configurar aqui para o celular mas se você quiser você pode clicar aqui no tablet e mudar as configurações para tablet também para ficar do jeitinho que você quer para tablet tá vou ensinar aqui para celular ó primeira coisa que a gente vai fazer a gente vai vir aqui nesse container aqui de cima vai mudar aqui as configurações de coluna eu vou

vir aqui vou alterar para o lapisinho aí eu vou deixar aqui dois fr aí eu vou vir aqui nesse item vou vir em conteúdo vou deixar ele Centralizado vou vir nesse aqui também vou vir em estilo vou deixar Centralizado vai ficar uma abaixo do outro ó Sempre que você quiser ver como que vai ficar no celular é só você fechar a abinha tá vendo vai ficar assim aí nesse de baixo eu vou vir vou vir aqui em colunas vou deixar duas ele tava mostrando só um aqui né tava em lápisinho mudei para FR para poder

configurar as colunas né aí tá duas aqui aí aqui nessa imagem eu vou aumentar vou deixar ela 100% e aqui no menu eu vou vir aqui vou deixar ele configurado para direita vou vir aqui estilo mobile vou vir aqui em background vou pegar esse salmão aqui vou vir aqui em Coco vou pegar esse marrom vou vir aqui em borda em rádios vou deixar dois ele fica assim se eu clico aqui para abrir ele tá desconfigurando o menu Tá vendo porque tá faltando a gente fazer uma configuração a gente tem que vir aqui no menu ver

em conteúdo e deixar ativado full widget que aí assim quando a gente clica ele desce aqui na tela toda tá Voltando para configuração a gente vai vir aqui em estilo aqui menu drop drop é esse menu que aparece quando a gente clica aí aqui no normal o texto da cor a gente vai deixar esse marrom o Hover que a ação de passar o mouse no texto da cor a gente vai ver que vai pegar a cor branco o background que é a cor de fundo a gente vai ver e vai pegar esse marrom então ele

vai ficar assim ó quando a gente passar o mouse vai ficar de marrom e aí a gente vai fechar a gente vai vir aqui no container aquele coluna ficou desconfigurada a gente tem que colocar dois não tinha percebido que tava tava errado aqui tá a gente tem que deixar dois aqui Lembra tava no lápisinho gente muda para rfr deixa dois e aí nesse caso a imagem a gente tem que vir e diminuir ela mesmo deixar ela Menorzinha assim OK aí vamos ir no container vamos vir aqui alinhar itens vamos deixar Centralizado para que não fiquem

para baixo para cima aí vai ficar assim o nosso menu no mobile aí voltando aqui para o desktop as configurações continuam do jeito que a gente deixou tá vendo que a gente configurando no mobile fica no mobile o que a gente configurando desktop fica no desktop aí agora a gente vai publicar isso daqui para que Ele apareça lá no nosso site porque por enquanto se a gente acessar lá ainda não aparece ó só aparece quando a gente publica para publicar você clica aqui em publicar clique em adicionar condição vai aparecer aqui entre site é assim

mesmo você clica em salvar se você por acaso já tiver clicado em publicar e não tiver visto É só você clicar nessa setinha clicar aqui em display conditions que vai aparecer essa mesma linha aí é só fazer a mesma coisa adicionar e salvar aí se você recarregar aqui o site já vai estar aparecendo o menu ele aparece em todas as páginas olha ok agora a gente vai para o layout do nosso rodapé que eu esqueci aqui no menu que é vir aqui virei estilo aqui no espaçamento horizontal que esses pensamentos aqui entre eles eu vou

deixar zero aqui no espaçamento vertical eu vou deixar cinco e aqui no espaçamento entre os itens eu vou deixar 30 aí ele vai ficar assim tem que lembrar de vir aqui no container vir aqui em alinhamento dos itens e deixar Centralizado para eles ficarem certinho não ficar um para cima outro para baixo outra coisa que eu fiz no menu lá do outro modelo que eu esqueci de pôr aqui é configurar para ele ficar fixo então né vindo aqui no container principal a gente vem avançado vem aqui efeitos de movimento aqui em fixo a gente vai

deixar superior aí vamos deixar aqui ativa em todas as opções e aí quando a gente rolar o nosso site aí o menu ele vai ficar fixo tá vendo ele vai ficar assim ó igual tá aqui tá vendo ele vai ficar fixo aqui em cima aí a gente tem que vir também vir aqui estilo tipo de fundo e colocar na cor branca para que ele não fique transparente em cima dos itens e bagunçando aí é só você clicar aqui em atualizar agora sim agora sim está pronto agora sim vamos para o layout do rodapé eu já

deixei o site de modelo aqui na página para eu poder ir só selecionando aqui copiando Os destinos Então vamos lá você vai vir aqui dentro do painel administrativo do WordPress vai vir em modelos Adicionar novo aí você vai selecionar a opção de rodapé se tiver em inglês no seu pode ser que esteja escrito folter você vai dar um nome eu vou colocar rodapé mesmo pode escrever tá aqui dentro clique em criar menu é a mesma coisa sempre vai ter modelinhos aqui que se você quiser aproveitar é só clicar em inserir assim mas eu vou criar

do zero Então vou fechar e agora eu vou pegar um deixa eu ver aqui um dois três quatro vou pegar aqui um container aqui no FlexBox vou pegar um container que tem quatro dentro que é esse daqui aí já vou vir aqui em avançado vou vir em pé de impedem sempre que eu falar pede é o espaço de dentro das coisas imagem é o espaço de fora então ó tá vendo essa limitação Rosinha Aqui é onde começa e termina o container aí eu vou colocar 50 tá vendo ele vai começar a partir daqui e se

eu falar margem margem é o espaço de fora então ó por exemplo vou colocar 50 do lado de fora tá vendo ó ele colocou espaço do lado de fora tá Então essa é a diferença entre imagem e pede Beleza agora eu vou vir aqui no estilo tipo de fundo vou vir no mundinho vou pegar essa cor salmão essa segunda cor que a gente configurou sempre vai clicando aqui clicando em salvar para não perder nada tá agora eu vou vir aqui na biblioteca vou pegar a logo do site arrastar para cá vou deixar ela centralizada vou

vir aqui na biblioteca vou pegar um Edition arrastar para cá já vou vir aqui vou copiar esse textinho que eu deixei vou colar aqui vou vir aqui em estilo tipografia vou deixar aqui tamanho 16 peso 600 vou vir aqui na biblioteca vou pegar uma lista de ícones vou arrastar Aqui para baixo vou excluir todos aí vou começar desse primeiro já vou copiar aqui esse telefone que eu coloco aqui pessoal é um telefone fixo tá não existe Sempre coloca o telefone fictício aqui aí a intenção aqui é você colocar os dados de contato né colocar os

telefones ali faltou mas eu vou colocar um ícone aqui só você clicar aqui em cima eu vou pegar o ícone de fone esse daqui vou colocar aí vou duplicar eu vou colocar o ícone do WhatsApp também e vou colocar aqui vou duplicar e vou colocar o e-mail tem vídeo aqui no canal ensinando a criar e-mail profissional como esse aqui tá com o próprio domínio é gratuito lá na Hostinger vou clicar aqui vou pegar o vídeo de envelope pronto vai ficar assim aí agora vou clicar vou clicar em salvar as coisas aí para não ter que

fazer de novo vou ver aqui em cima tá vendo que tem um menu aqui em cima eu posso só clicar aqui em cima que ele vai abrir o modelo do menu vou clicar em cima dessas redes sociais aqui clicar com o botão direito clicar em copiar agora eu vou colocar aqui embaixo e voltar para o rodapé pronto vou colocar aqui em cima e clicar vou deixar aqui Centralizado vou vir aqui na estilo na cor primária eu vou aumentar um pouquinho o contraste e vou vir aqui no tamanho do ícone vou aumentar um pouquinho vai ficar

assim vou aumentar também o espaçamento entre eles ok aqui no texto eu vou clicar vou vir em texto eu vou aumentar para tamanho 13 vou vir na imagem vou vir no estilo em largura máxima ou diminuir um pouquinho deixar aqui mais ou menos 505 por cento . aliás vou vir aqui vou deixar essas redes sociais alinhadas aqui para esquerda vai ficar melhor OK agora vou pegar esse título clicar com o botão direito copiar clicar aqui dentro do container colar aí eu vou copiar os títulos que já tem aqui ó institucional por exemplo vem aqui colo

aqui vou virar estilo vou aumentar o tamanho dele aqui deixar tamanho 20 vou duplicar Ah está para cá duplicar e arrastar para cá eu já vou copiando aqui os outros títulos Já venho e colo já é a mesma coisa com outro Já venho aqui e colo aí agora vou colocar aqui o institucional é para a gente fazer como se fosse um menu sabe colocar as páginas principais aqui do site que eu vou colocar nossa home especialidades blog etc a gente pode aproveitar esse que já tá aqui você clica aqui clica em duplicar arrasta para cá

clica nele vem conteúdo e vou excluir todos deixar o primeiro vou tirar o ícone né porque a gente não vai usar ícone aqui aí eu vou colocar home aí todos aqui você vem no link e coloca o link tá para a pessoa conseguir clicar só você escrevendo aqui que já aparece a página se não aparecer você passa o mouse ali em cima do menu tentar fechar E aí por exemplo a especialidade você clica no botão direito copiar endereço do link aí já você já Copiou o link vou colocar aqui duplicar o link aqui aí esse

daqui vai ser especialidade Pronto agora eu vou clicar aqui vou vir em estilo texto tipografia vou aumentar aqui é o tamanho 16 vou vir aqui em lista em espaçamento vou aumentar um pouquinho espaçamento vou clicar com o botão direito duplicar arrastar Aqui para baixo do especialidades e aqui a gente vai colocar as especialidades ó vou primeiro Excluir todos aqui começar a escrever nas especialidades eu vou colocar as especialidades que eu tenho se você tiver fazendo para um site por exemplo você pode vir colocar os tipos de serviços né que vocês fazem tá E aí você

faz uma linkagem para onde que vai ser o serviço como a gente ainda não tem essas páginas especialidades eu vou deixar para brincar com vocês no final tá Por enquanto vou só criar que não vou colocar os links Depois eu ensino como colocar então modelação aí você vai fazer a mesma coisa duplica e coloca aqui o título Pronto agora eu vou vir aqui na biblioteca vou pegar o Edition de ícone que é esse aqui que já tem Um textinho Vou colocar aqui embaixo vou vir aqui neste estilo vou colocar o ícone para esquerda vai ficar

assim aí aqui a intenção é que você coloque o endereço do local né para pessoa conseguir encontrar eu vou clicar aqui vou vir em conteúdo aí aqui no título colocar na escrito unidade 1 que no caso aqui eu tô simulando como se fosse uma clínica que tem várias unidades né se tiver só uma unidade já não precisa colocar aí você pode tipo não colocar esse título aqui tá se você não quiser ou então você coloca o endereço aqui no título tanto faz aí aqui embaixo eu vou já copiar esse endereço aqui também o endereço fictício

tá aí vou colar aqui aí já vou clicar eu já vou clicar aqui enviar arquivo sbg eu vou enviar esse íconezinho de mapa que eu tenho aqui eu vou deixar para vocês que é esse daqui aí você vai clicar em série mídia aí vou vir aqui neste estilo conteúdo nesse primeiro aqui eu vou deixar tamanho 20 e peso 600 também aliás vou deixar tamanho 15 aqui nesse de baixo eu vou trocar só a cor então vou clicar aqui para selecionar e vou selecionar essa cor marrom vou vir aqui nesse espaçamento que é o espaçamento entre

o título e o textinho de baixo vou diminuir para três vou vir aqui no ícone vou diminuir o tamanho vou vir aqui em Box vou deixar aqui em alinhamento vertical meio vou voltar aqui no ícone e a cor eu vou pegar esse salmão aqui mais laranjadinho vai ficar assim aí eu vou vir aqui avançado vou virar em borda tipo de borda vou deixar sólido vou desvincular aqui ó quando tá assim você coloca a largura da borda ele fica em todas as extremidades a gente desvincular aí você pode colocar só onde você quiser aí eu vou

pôr no inferior que aí eu vou deixar só um só para fazer um risquinho assim e aí eu vou vir aqui no mundinho vou pegar essa cor laranjada para ficar esse riquinho assim alaranjado tá vou voltar aqui em avançado vou vir aqui vou deixar cinco de pele vai ficar assim aí eu vou duplicar e vai ficar assim aí beleza aí agora por causa do tamanho dos textos tá ficando visualmente desalinhado aqui né então a gente vai vir aqui nesse container vamos vir aqui em espaço entre os elementos né Para a gente configurar o espaçamento entre

um container e outro aí eu vou mudar aqui para porcentagem vou deixar 3% de espaço entre eles vou vir aqui na imagem também vou deixar ela 100% mesmo vou vir aqui vou aumentar o tamanho desse aqui para 27 vou diminuir um pouquinho esse aqui a 22 e vou dar mais uma diminuidinha nele aqui para 20 eu vou aumentar o desse aqui para 29 ele vai ficar assim aliás eu vou diminuir de novo essa largura dessa imagem aqui deixa assim mais harmônico 53 beleza aí vai ficar assim sempre clicando aqui clicando salva rascunho para não perder

nada agora a gente vai fazer essa parte de cima aqui colocando esse mapinha a gente vai clicar aqui vai clicar para pegar um container vamos pegar um container ou setinha para baixo vamos ver aqui na biblioteca vamos pegar o Elite de mapa vamos arrastar ele para cá aí aqui a gente coloca o endereço eu vou colocar só o Centro Uberlândia tá mas aí no seu caso você coloca o endereço correto aí do seu estabelecimento tá aí eu vou vir aqui no estilo vou vir em filtro CSS vou tirar aqui a saturação para ficar em preto

e branco e vou tirar um pouquinho o contraste para ficar um pouquinho mais escuro aí vai ficar assim vou vir aqui avançado vou vir embora vou deixar aqui 10 de arredondamento aliás vou deixar cinco só de arrendamento Beleza vou vir aqui nesse container vou virar avançado vou virar impedem que é o espaçamento de dentro vou deixar zero guriz vincular os valores de imagem que é o espaçamento de fora e vou colocar um espaçamento negativo aqui colocar mais ou menos 40 E aí nesse container aqui eu vou vir vou vir avançado vou vir aqui impede que

é o espaço de dentro e vou colocar 90 aqui no superior se o senhor não tiver mudando só no superior é porque ele tá assim com essa chavinha ligada aí você tem que clicar aqui para desvincular que aí você consegue mudar só o de cima tá aliás vou deixar 120 para ficar um espaço lábio aí percebe que ele tá ficando escondido aqui atrás eu vou ter que vir aqui virem avançado virem ver ainda que se vou deixar um para ele ficar aqui embaixo vou vir aqui na margem vou aumentar um pouquinho aqui 46 vou clicar

aqui clicar em salvar ele vai ficar assim se você quiser ajustar mais a cor a nitidez vem aqui no estilo filtro que aí aqui você vai aumentando tá realmente o contraste diminui o contraste deixar ele um pouquinho mais parecido com aquele outro tá ali mais clarinho Beleza se você quiser aumentar a altura também você vem aqui no conteúdo em altura aumenta aqui e o zoom também ó você pode aumentar por aqui que ele vai mostrando mais próximo aqui da região clicar aqui clicar em salvar agora eu vou configurar para o celular vou clicar aqui e

responsivo vou colocar para o celular vou vir aqui nesse container do mapa vou vir aqui impede vou colocar 20 de pad vou vir aqui nesse nosso container quando acontece isso você não consegue clicar aqui você pode vir nesse navegador que aí ele abre aqui para vocês containers ó esse vai fechando aqui que você consegue visualizar a gente tem dois container existe de cima que tá o mapa e esse de baixo e É nesse de baixo aqui que a gente vai configurar aí eu vou vir aqui vou colocar 20 de pads primeiro aí vou desvincular E

aí nesse de cima eu vou colocar 50 vai ficar um espaçamento legal ali o restante já tá configurado bonitinho vou clicar aqui clicar em salvar Ah tá faltou uma coisinha que a gente colocar aqui é todo direitos reservados né vou vir aqui vou pegar um container com a setinha para o lado agora eu vou vir vou pegar um título arrasta para cá vou vir aqui na tag dinâmica vou vir aqui embaixo em data e hora atuais vou clicar aqui vou clicar em formato da data vou clicar em personalizar vou excluir tudo e deixar só o

y de yers que amo exclui tudo deixar só o ano para ele ficar puxando só o ano automaticamente vou vir em avançado E aí depois eu vou dar um espaço e vou colar esse textinho todos os direitos reservados aliás depois a gente configurou aqui ele vai aparecer depois do texto ó aí ele vai ficar sempre puxando atual e depois dos direitos reservados faltou aqui esse cezinho aí aqui no antes eu vou colocar esse c e um espacinho Mas vai ficar assim ouvindo tipografia vou pegar essa tipografia aqui de texto vou duplicar isso aqui vou vir

aqui no container vou deixar aqui ó espaço entre para um ficar de um lado outro ficar do outro vou clicar aqui no container vou vir aqui estilo tipo de fundo vou clicar no mundinho vou pegar esse salmão aqui que a cola de cima vou ver aqui em borda tipo de borda sólido vou desvincular vou colocar só um aqui no superior vou vir aqui na cor vou pegar esse marrom aí aqui eu vou pegar já esse textinho aqui que é para a gente colocar as políticas de privacidade aí você pode excluir isso daqui colar aí aqui

em link a gente vai pesquisar pela página de políticas de privacidade vamos por o link dela aqui pronto aí a gente vai clicar aqui clicar em salvar agora vamos colocar aqui no mobile de novo para a gente ver como é que ficou a gente pode vir aqui no container virem layout vamos deixar aqui alinhados ao centro e aliás ao centro e o espaço aqui entre os elementos a gente pode deixar zero Pronto agora sim a gente vai publicar para aparecer em todo o nosso site só você clicar aqui em publicar adicionar condição tem que aparecer

todo o site aqui e clicar em salvar Lembrando que se você já tiver clicado em publicar e não tiver mais aqui o botão só você clicar na setinha clicar em exibir condições que vai estar aqui tá é só clicar em adicionar condição e salvar Beleza agora se a gente acessar aqui qualquer página do nosso site a gente vai ter que o Menudo até pronto vamos fazer só mais uma configuração a gente vai vir aqui nesse container que nem estilo tipo de fundo vamos deixar transparente vamos irem avançado pede vamos desvincular né E aqui no superior

vou deixar 50 para que se a gente tiver fazendo alguma página que tiver alguma cor de fundo não vai interferir né vai ficar a cor de fundo até aqui e vai ficar um espaçamento entre o final do conteúdo da página e aqui o nosso rodapé não vai ficar grudado né pronto vai ficar aqui atualizado a gente atualizar Ele até fica um espaço a mais aqui beleza agora nós vamos passar para construção da nossa página home primeira coisa que a gente vai fazer aqui antes de começar a criar eu vou te ensinar a criar um banner

como esse esse banner pessoal ele vai servir para vários tipos de empresas que tenham um profissional à frente assim eu que tem alguém que represente principalmente site de advogado essas coisas o link de estética por exemplo tem um layout mais clean né Qualquer coisa relacionada à estética saúde beleza você tem esse layout assim mais clean né Então essa moça aqui ela é uma modelo eu peguei no site do freepik o freepik é um banco de imagens ele tem a parte grátis ele tem a parte paga tá eu tenho a parte paga dele então eu pego

coisas pagas aqui mas tem várias imagens grátis também eu pesquisei por mulher de terno branco se não me engano branco e aí eu achei as imagens dessa moça e baixei aqui ó baixei a imagem dela ó tá vendo quando tá verdinho assim significa que é gratuito a imagem você clica aqui e você consegue baixar tá eu baixei a imagem dela E aí eu também pesquisei aqui no freepik por fundo branco e aí né De acordo com o seu tipo de layout você vem aqui pesquisa e aí eu peguei um fundo branco aqui não me lembro

qual desses aqui foi mas tá aberto aqui é esse daqui tá vendo e aí também você escolhe um aí que você acha melhor clica aqui em fazer o download e beleza quando você baixa uma imagem assim Pode ser que ela venha a imagem normal né biquíni em download e aí você olha aqui no seu download tá imagem normal aqui tá vendo e pode ser que ela venha uma pasta zipada como essa daqui por exemplo tá vendo ó essa pasta aqui se ela vier uma pastas de espada assim você vai clicar com o botão direito em

cima vai clicar em extrair tudo clicar em Ok E aí ó ele vai te levar aqui para imagem tá vendo aí você pega a imagem daqui arrasta para pasta que você acha melhor no seu computador beleza feito isso aí a gente vai vir para o canva para a gente poder criar o nosso banner tá ó você vai clicar aqui o canva é um site para quem não sabe é um site que você consegue criar layout de imagem manipular imagens sobre ele aqui vou mostrar como criar esse banner clique em criar design tamanho personalizado a gente

precisa de um banner de 1920 de largura e 650 de altura todo banner ó Isso serve também para se você for pedir para algum design fazer para o cliente te mandar que você quiser usar assim na extensão da tela toda tem que ter 1920 de largura tá senão fica embaçado fica pequeno fica cortando tem que ter 1920 ó já criou aqui a estrutura do jeito que a gente quer aí você vai vir aqui vai vir no seu computador né vai pegar a imagem no meu caso esse fundo branco vai arrastar para cá vai clicar aqui

o botão direito em cima vai clicar em definir como plano de fundo e aí o meu caso eu quero que fique com essa sombrinha aqui que ela tem quase mostrando então eu vou clicar aqui tá vendo aí você consegue clicar e arrastando a imagem um pouquinho para cima para poder deixar no lugar que você quer tá aí agora você vem pega a imagem da mulher no meu caso eu usei essa daqui aí você vem arrasta pega a imagem aí da pessoa da empresa e aí aqui a gente vai cortar a gente vai clicar aqui em

cima tá vendo cliquei duas vezes ele aparece pra gente cortar aí eu vou selecionar aqui arrastar para cá arrastar para cá e vou clicar aqui em pronto pronto aí eu vou aumentar aqui o tamanho dela e vou clicar aqui em cima e editar foto aí eu vou clicar aqui em remover fundo essa é uma função paga aqui do Campo Tá mas é baratinhos pro 34,90 se você não quiser pagar porque o campo pro ele tem várias funções legais aqui para criar banners manipular a imagem você não quiser pagar Tem vários sites na internet faz isso

também tem um site do adobes pesquisa aí na internet e ver como tira fundo de imagem tá se você tiver aqui no campo você vai clicar em remover eu gosto muito né removedor do carro porque ele remove perfeitinho beleza aí como eu já conheço a imagem dessa mulher aqui eu vou dar uma ajustadinha que o cabelo dela fica meio esquisito ali então eu vou clicar aqui nessa setinhas vou clicar aqui em apagar aí eu vou clicar aqui e passar bem gente o cabelinho dela aqui eu sei que tem uns aqui do lado de cima não

dá para ver assim Mas na hora que a gente expande o banner dava para ver pronto aí vou clicar aqui para voltar vou expandir ela aqui deixada tamanho que eu quero que fique colocar aqui na posição que eu quero que fique é bom que fique mais ou menos aqui no meio tá para poder deixar um espaço hábito tanto de cá quanto de k para a gente poder fazer tá vendo que ela tá bem aqui no meio e aí tem espaço de cai de cá tá então deixa mais ou menos assim no meio ó lá a

posição dela o cotovelo termina mais ou menos aqui tá você tem que deixar a imagem ela passando para cá como se a pessoa tivesse apoiada em cima de alguma coisa que tá aqui tá não deixa a imagem assim quebrada cortada assim não fica horrível horrível mesmo não deixa sempre a imagem finalizando aqui na extremidade do Banner tá aí você vai posicionar a pessoa que é agora eu vou fazer uma sombrinha percebe que tem uma sombra aqui atrás dela tá vendo vou vir aqui nele elementos aí você vai vir aqui e vai pesquisar por sombra geralmente

já fica aqui se não tiver só você escrever tá sombra aí vai aparecer várias sombrinhas aqui eu vou pegar essa daqui e aqui você consegue modificar a cor da sombra tá eu vou expandir ela um pouquinho vou deixar aqui vou deixar finalizando assim em cima da moça vou clicar em cima vou clicar em camada vou clicar em camada vou clicar em mover para trás para ficar atrás da moça e aí eu vou ajustando colocando aqui para baixo só para poder dar uma profundidade para ela mesmo não deixa muito passando não só para poder dar uma

profundidade para ela descolar do fundo você pode clicar aqui arrastar para cá para você conseguir pegar a sombra também aí eu vou vir aqui transparência vou diminuir um pouquinho vai diminuir a intensidade pronto depois eu almoço aqui para deixar Beleza você vai ajustando aí do jeito que você achar melhor aí uma vez que você tiver configurado aqui aí você vai clicar aqui em compartilhar clicar aqui embaixo e baixar e pronto Nós já vamos ter feito aqui o nosso banner vou fechar aqui o canva eu também vou deixar esse banner pronto para vocês se você quiser

usar tá lá no nosso drive aí agora a gente vai começar a criar nossa página 1 estando aqui ó clicando aqui no menu a gente já cai na página home se você quiser você pode só clicar aqui em cima e editar página tá sempre que você tiver na página você pode clicar aqui ou então você pode vir aqui dentro do painel administrativo páginas todas as páginas Sempre que você quiser editar Você pode passar o mouse em cima da página e clicar aqui também editar E aí a gente vai editar com Elementor clica aqui em editar

com Elementor beleza primeira coisa a gente vai vir aqui na engrenagem vai vir em largura da página e vamos deixar Elementor largura Total isso vai fazer com que suma esse títulozinho que fica lá em cima e deixa a tela toda em branco para a gente criar vamos vir aqui vamos pegar um FlexBox vamos chegar a um container com a setinha para o lado vamos ir em estilo tipo de fundo imagem arquivo e vamos enviar aquele banner que a gente fez sempre bom para o su você vir aqui em título e colocar o nome do Banner

e o nome do site tá por exemplo Anastasia estética banner home tá que aí vai achando em todos os lugares na internet aí clica em selecionar vou vir aqui em tamanho de tela vou deixar preenchimento completo vou vir aqui em layout vou vir aqui em altura mínima vou deixar 650 vou voltar aqui no estilo vou deixar em posição vou deixar em Centralizado vai ficar assim aí agora a gente vai pegar esse texto aqui eu já vou copiar clicar aqui copiar aí eu vou vir aqui vou pegar um título arrastar para cá vou colar ele aqui

esse título que eu peguei vou ver no estilo vou ouvir na cor já tá já tá na cor certinha aqui né já vou copiar esse texto que tá aqui embaixo clicar em copiar vou clicar aqui em duplicar esse título vou vir aqui vou colar esse textinho vou ver aqui nesse estilo tipografia vou pegar esse texto 2 vou vir aqui vou vir em layout vou deixar aqui na verdade eu tinha colocado errado né vou deixar um abaixo do outro aqui que é para um ficar baixo do outro vou vir aqui nesse texto vou vir em avançado

vou ver em largura vou deixar personalizado vou deixar em porcentagem vou deixar 50% aliás vou deixar aqui 54% vou vir aqui nesse de baixo vou verem avançado largura personalizado certifique-se de que está a porcentagem deixar 54% também vou vir aqui em estilo vou vender tipografia vou aumentar o tamanho desse aqui para 16 vou vir aqui na cor vou deixar esse secundário aqui vou vir vou pegar um botão vou arrastar Aqui para baixo vou escrever aqui no texto do botão agendar consulta vou vir no ícone vou clicar vou pesquisar o ícone de WhatsApp seleciono é que

você colocaria o link do WhatsApp tá vou vir aqui nesse estilo tipografia vou pegar essa de texto 2 cor do texto vou pegar essa primária Hover vou vir aqui na animação passar o mouse vou deixar grow para na hora que a gente passar o mouse ele expandir assim vou vir aqui me pede vou deixar 10 aqui de pede o desvincular E aí aqui na esquerda eu vou deixar 20 e na direita vou deixar 20 para ele ficar um pouco mais estreito vou vir aqui em sombra vou clicar aí eu vou vir aqui em cor vou

diminuir um pouquinho a intensidade vou ver aqui em borrar vou aumentar e vou vir aqui em vertical e trazer essa sombrinha Aqui para baixo para ficar com a profundidade eu posso diminuir um pouquinho esse vertical aqui beleza aí eu vou vir aqui no container vou vir aqui em justificar conteúdo vou deixar alinhado para o centro sempre clicando aqui na atualizar tá aí já criamos aqui a primeira parte agora a gente vai criar esses cardzinho ó já vou copiar esse título aqui aí para fazer esse aqui a gente vai vir vai pegar um container vai pegar

uma grade aqui eu vou pegar uma grade de quatro né que é esse aqui vou vir aqui na biblioteca vou pegar uma caixa de ícone peça vou arrastar para cá aí já vou copiar aqui os títulos ó colar o título aqui já vou copiar o textinho de todos e colocar aqui aí eu vou ir duplicando e fazendo a mesma coisa esses textos aqui pessoal eu pedi para o chat GPT criar para mim que é uma inteligência artificial tem vídeo sobre ela aqui no canal tá então se você tiver em dúvida aí de como criar conteúdo

aqui para o seu site você pode pedir para o chat aprender criar para você Na verdade eu tinha pegado uma de três né Eu preciso de uma de quatro colunas Mas tudo bem É só clicar aqui vir aqui em colunas e aumentar para quatro ele já vai ficar aqui aí eu vou vir nesse primeiro já vou vir aqui no estilo já vou vir aqui nesse conteúdo vou vir aqui em tipografia aqui do título né vou deixar também 16 600 o peso aqui para o título e aqui no texto ele já tá com tamanho que eu

quero deixa eu só conferir aqui que é 12 400 aí eu vou vir aqui nesse conteúdo vou vir aqui Enviar ícones svg eu tenho os ícones que eu usei aqui e eu vou deixar para vocês tá então esses daqui vai estar lá no nosso drive Lembrando que tem outro site aqui que você consegue pegar ícones dessa VG inclusive gratuito eu ensinei no canal já vou clicar na atualizar quando a gente envia todos de uma vez ele não aparece todos aqui para gente a gente pode recarregar a página tá clicar aqui e vai conhece ver gente

ver qual que foi o primeiro que eu usei foi esse daqui na verdade selecionar ele aí eu posso clicar aqui clicar copiar clicar com o botão direito colar estilo nos outros e colocando ícone nos outros também ó aí esse de tratamentos faciais eu não subi depois eu vou subir aqui certinho pronto aí agora a gente vai vir aqui em avançado pede Vamos colocar 30 de padim agora a gente vai vir vai vir aqui em fundo aqui em tipo de fundo eu vou colocar esse código de cor aqui tá vendo anota aí para deixar bem branquinho

quase transparente tá vendo ó que a setinha tá bem para cá com as transparente e aqui em borda vou colocar tipo de borda sólido o desincular aqui e vou deixar aqui só no inferior e vou vir aqui na cor e vou pegar essa cor salmão mais clarinho que a gente tem aqui aí a gente vai fazer o seguinte vai clicar com o botão direito copiar colocar com o botão direito e colar o estilo em todos os outros agora a gente vai vir nesse container aqui vai vir aqui em avançado vai desvincular os valores de imagem

e vamos colocar 107 menos 107 para ele subir aqui para cima tá vendo ele tá ficando transparentinho aqui em cima aí a gente vai fazer o seguinte a gente vai vir em cada um dos itens vai vir aqui em CSS personalizado você vai copiar esse código que tem aqui ó igualzinho também vou deixar lá no Drive Se Você Quiser copiar de lá você vai colar aqui que a gente vai fazer um bloco aqui aí você vai vir em todos os itens vai virar esse personalizado Vai colar esse bloco a gente fazer um desfoque você vai

conseguir ver mais isso aqui em cima da foto da mulher tá vendo ó que fez um desfalquezinho ficou bem bonitinho aí falta outra coisa a gente vai vir aqui também vai vir emboramente vamos deixar 5 para ficar arredondamento bonitinho aqui já vamos aproveitar aqui enfeites de movimento vamos vir aqui em animação de entrada Vamos colocar find up aí vamos deixar aqui lento Vamos colocar 300 que ele vai fazer essa animação de entrada bonitinha quando a gente carregar o site aí eu vou vir aqui em estilo e ícone também vou diminuir um pouquinho o tamanho do

ícone diminuir o espaçamento entre o ícone e o texto aí eu vou clicar em copiar clicar em colar estilo em todos os outros e vai ficar assim vou clicar em atualizar E aí ó se a gente acessar aqui a página eles aparecem assim gradualmente caminhão bonitinho agora vamos para essa sessão aqui de baixo ainda na verdade antes faltou uma coisinha aqui no modelo eu tinha deixado essa palavra que essas palavras sua beleza um pouco mais boa de né mais grosso e esqueci de fazer isso aqui a gente vai fazer o seguinte a gente vai fazer

uma gambiarra para gente fazer isso para não precisar digitar o código você vai arrastar o Edition de texto para cá vai pegar esse título copiar rolar ele aqui dentro aí aqui ó nessas palavras a gente vai selecionar e clicar aqui em bold aí a gente vai vir em texto tá vendo ele já gerou para a gente aqui HTML a gente copia vem aqui e cola pronto aí esse aqui a gente já foi de uso ele só para pegar o código e aí vai ficar aqui com esse efeito da imagem que mais bom de ficar bem

bonitinho uma outra coisa que eu percebi que faltou que também a sombrinha que eu coloquei em todos os cards a gente vai vir aqui vai vir avançado vai vir em borda vai vir em sombra aí você vai vir aqui vai copiar esse textinho igualzinho colar aqui né aí aqui a gente vai colocar aqui menos um aqui 10 aqui 32 e aqui menos 13 já vai ficar o contorno certinho aqui vai dar uma profundidade aí a gente vai clicar em copiar e colar o estilo em todos os outros Pronto agora ele deu uma profundidade a mais

com mais bonito agora nós vamos para essa segunda parte aqui que seria uma parte mais para demonstrativo das especialidades se for o caso de uma empresa por exemplo que presta Algum serviço por exemplo de engenharia Algum serviço de imagem daria para colocar aqui também um Carrossel né com o portfólio algo do tipo nesse caso aqui como é uma clínica vou deixar aqui o Carrossel de alguma alguns resultados que é uma das coisas que mais vendem né nossa inserir uma sessão para você fazer um demonstrativo daquele tipo de produto ou serviço que a empresa vende todas

as imagens que eu estou usando aqui são imagens fictícios de bancos de dados né lá do freepik que eu peguei no seu caso quando você tiver fazendo o seu ou do seu cliente aí você vai pegar a imagens reais do serviço do projeto tá E aí eu vou ensinar para vocês virem aqui no campo e redimensionar as imagens para que elas fiquem no tamanho certinho para não ficar um Carrossel feio com imagem uma maior do que a outra tá então a gente vai vir aqui no campo vai vir criar design tamanho personalizado e a gente

vai colocar o tamanho que a gente quer eu vou querer colocar aqui de largura 300 e de altura 350 eu vou clicar em criar aí a gente só joga as imagens para cá e redimensiona eu vou deixar para vocês no Drive né as imagens aqui que eu tô usando no projeto aí eu vou deixar lá no Drive as imagens já do tamanho certinho tá mas aí nas suas do projeto real você faz assim aí é só você ir ajustando aí se você quiser você pode adicionando outras aqui embaixo que aí você pode baixar todos de

uma vez ó só arrasta para cá e ajustando quando é assim que nessa daqui ela tá se a gente expandir ela vai cortar muito tem como você clicar duas vezes em cima dela tá vendo para você dar uma cortada na extremidade assim que aí você deixa do tamanho que você acha que que vai funcionar que aí se você expandir não vai cortar muito o que realmente importa para ver aqui né aí você vai fazendo isso eu vou fazer com todas aqui e te mostro Olha já fiz de várias aqui aí é só você clicar aqui

em cima e compartilhar baixar aí você marca aqui deixa marcadinho para ir todas as páginas e você clica em salvar baixar em salvar aí ele vai baixar uma pasta zipada aí ó você vem aqui ele vai vir assim você clica com o botão direito e extrair tudo dá ok E aí vai vir uma pastinha com todas as imagens já do tamanho certinho tá aí para o s ou seria interessante você vem cada uma das imagens e escrever o nome sabe por exemplo aqui você vem renomeia com botão direito renomear escreve Lipo de papada Anastácia e

etc sabe assim para ajudar no S1 beleza OK agora a gente vai vir aqui vai pegar um container do Flex box com a setinha para baixo Vamos ir avançado pede Vamos colocar 70 aqui de pede vamos ver aqui na biblioteca vamos arrastar um título para cá vamos deixar ele Centralizado vamos duplicar para a gente fazer um subtítulo aí eu já vou copiar aqui e já vou colar também já vou copiar esse substituto que eu tenho aqui embaixo e vou colar agora eu vou vir aqui no estilo ou vim tipografia vou pegar essa tipografia aqui de

texto 2 vou aumentar um pouquinho aqui vou vir aqui na cor e vou pegar essa cor secundária que a gente tinha cadastrado vou vir aqui nesse título de cima vou virar estilo tipografia vou deixar tamanho 30 e para fazer esse carrosselzinho aqui eu vou precisar ativar uma configuração do Elementor ó vou clicar aqui em atualizar para não perder nada e vou acessar aqui o painel admisfério de preço aí eu vou vender Elementor a configurações recursos vou ativar essa opção aqui elementos alinhados vou clicar vou clicar em ativo e salvar agora a gente pode recarregar nossa

página aqui nem eu vou pesquisar aqui na biblioteca por Carrossel esse Carrossel aqui vou arrastar ele para cá vou excluir todos deixar só um vou clicar aqui na biblioteca vou arrastar uma imagem aqui para dentro aquele tamanho da imagem eu vou deixar completo e vou ouvir e vou upar as imagens que eu Redi mencionei para cá ó vou selecionar todas já vou jogar para cá para já deixar aqui dentro do WordPress já vou selecionar essa aqui aí eu vou vir dentro desse contêiner aqui vou clicar em avançado vou vir pede em que o espaçamento de

dentro e vou deixar zero agora eu vou vir no lápisinho e vou duplicando esses slides aqui ó tá vendo eu fiz as configurações de uma foto aí agora eu posso ir clicando nas outras aqui e só alterando a foto aí você vai fazendo isso é para aparecer as outras só clicar na setinha aqui do lado que vai aparecer nos só clica em cima da imagem e vai alterando falta mais uma aqui para quantidade que eu queria só dupliquei ali Prontinho agora a gente vai fazer umas Configurações agora eu vou configurar essas bolinhas aqui Você vai

clicar nesse lápis que está aqui na extremidade preste sempre atenção do que você está editando você consegue ver isso aqui em cima tá vendo no editor do Elementor você consegue ver o que que você está clicando então por exemplo se eu clico aqui ó eu consigo ver que eu tô editando a imagem então para você saber que você está editando Carrossel você tem que clicar e ver aqui OK vou vir aqui no estilo paginação que são essas bolinhas aqui vou vir em cu vou pegar essa cor aqui salmão que elas já vão ficar na cor

vou vir aumentar da mãe delas vou ativar o Custom position e vou deixar aqui alinhados para o final também vou vir aqui em espaçamento e vou aumentar um pouquinho o espaçamento para que ela fique um pouquinho afastada aqui do nosso Carrossel agora eu vou configurar as setinhas que são as navegações vou vir aqui em navegação vou vir aqui em cor vou pegar essa secundária que essa marronzinha e vou vir aqui em tipo de fundo vou vir em cor vou pegar essa essas gelo aqui vou vir em arredondamento vou deixar 30 e vou vir em padding

eu vou colocar 10 e vai ficar assim no Hover que a ação de passar o mouse Eu percebo que ela tá ficando branquinha eu vou mudar aqui a cor para esse secundário mesmo para ficar da mesma cor não quero que mude não pronto vou clicar em atualizar aí já está aqui o nosso Carrossel aí agora eu vou clicar aqui em cima vou virar avançado vou vir aqui na imagem vou desvincular o valor de imagem clicando aqui e no superior eu vou colocar 30 para não ficar tão grudado aqui vou clicar em atualizar já vamos ter

feito aqui a nossa sessão agora vamos para essa que é de especialidade vou pegar um container Flex box com a seta para baixo o Vini avançado vou colocar 70 de pads vou ver em estilo tipo de fundo imagem vou pegar essa imagem que eu tô usando aqui que é uma imagem de mármore que eu também achei lá no freepik essas imagens de mármores são ótimas para fazer essas sessões assim com o fundo um pouco diferente porém neutro fica bem bonito e serve para vários tipos de projeto tanto para projetos com a paleta mais pesada quanto

para uma paleta mais clean como essa tá então fica aí a dica Vou enviar o arquivo Ah E aí lembre-se que você toda vez que você for colocar uma imagem de fundo que seja na extensão da tela toda você tem que vir no canva e tem que redimensionar a imagem para 1920 de largura então você vem tamanho personalizado coloca 1920 por 650 E aí você sobe a imagem para cá para redimensionar ela e baixa Ok para ficar no tamanho correto já vou deixar essas imagens desse projeto aqui para vocês lá no nosso drive Você vai

vir vai arrastar imagem para cá na verdade eu percebi que eu tinha feito de outra forma não é que em estilo que a gente vai colocar a imagem não aqui em estilo a gente vai vir em cor vai pegar essa cor gelo que a gente configurou E aí aqui em sobreposição de fundo é que a gente vai colocar a imagem do mármore a gente vai ver que tipo de fundo aí vamos colocar a imagem do mármore aqui que é ele não fica muito nítido ele fica um pouco mais transparente E aí a gente vai diminuir

um pouquinho aqui deixar mais ou menos 45 Beleza agora a gente pode vir na biblioteca arrastar um título para cá deixar Centralizado podemos vir aqui já vou copiar esse título aí você cola ou escreve aqui o que você quer também já vou copiar esse subtítulo aí a gente pode duplicar esse aqui de cima e arrastar ele para cá ele já tá configurado do jeito que a gente quer só colomos o texto Ok sempre clicando aqui me atualizar para não perder nada tá agora a gente vai fazer essa sessão essa daqui é um tabs tá vendo

que a gente usa um Edition do Elementor E aí que é uma sessão onde você vai mostrar o serviços especialidades Eu dividi por categorias vou te ensinar a rede mencionar as imagens para deixar arredondadas assim é bem semelhante que a gente fez aqui no campo você vai vir aqui vai vir em criar design vai pegar aqui tamanho personalizado vai colocar o tamanho que da imagem que você quer a gente vai deixar tamanho 400 por 400 aqui Criar novo design aí você vai vir aqui em elementos vai vir aqui em molduras vai pegar essa Redonda vai

esticar ela deixar aqui no tamanho máximo que der sem cortar tá ela tem que ficar a figura arredondada sem cortar e tá cortando um pouquinho aqui E aí você vai colocar todas as imagens que você quer aqui eu já até tenho elas aqui em upload porque eu já fiz isso aqui antes né é só você arrastar as imagens para cá se você tiver arrastando seu computador também a mesma coisa só colocar em cima que ela vai ficar arredondada aí você pode duplicando duplica a página aí você arrasta outra imagem duplica arrasta outra imagem Aqui para

baixo e no final você clica em compartilhar baixar preste atenção essa você tem que marcar essa opção de fundo transparente é muito importante senão vai ficar um quadrado branco aqui de fundo e a gente quer que esse fundo fique transparente para ficar bonitinho aqui em cima da sessão tá ok então é muito importante que você marca como transparente Beleza depois que você baixou aí agora a gente vai começar a criar essa sessão vamos na biblioteca pegar o widget de tablet do Elementor aí você vai pegar esse vídeo enche de águas arrastar para cá aí nele

a gente consegue construir o que a gente quiser vamos primeiro criar essas abinhas aqui ó um é de harmonização facial já vou até copiar aqui de cima aí eu vou vir vou colar o título a outra é de ultrassom microfocado a outra de tratamentos faciais e vou duplicar para colocar essa outra que é o de harmonização corporal beleza aí eu vou vir nessa de harmonização facial vou vir aqui vou pegar um elite de caixa de imagem É esse aqui vou arrastar para cá E aí eu vou duplicar ele vou clicar nesse container vou deixar ele

alinhado na horizontal eu vou configurar vou vir aqui estilo conteúdo no título eu vou vir tipografia vou pegar esse secundário aqui na descrição vou virar tipografia vou deixar essa de texto mesmo e na cor eu vou deixar essa secundária aqui para ficar marronzinho aí agora o que a gente vai fazer é copiando cada um desses itens e colando aqui o título a descrição é uma descrição fictícia então vou deixar essa que está aqui mesmo E aí você vai fazendo isso em todos os cards no seu caso né como é um projeto real você vai escrever

certinho O legal é que você coloca o mesmo tamanho de texto para todos os cards para não ficar feio se você tiver dificuldade pode ir no site do chatGPT e pedir para ele gerar um texto igual dos itens que você quiser ok a gente vai fazer isso eu vou duplicar aqui para deixar seis e vou vir aqui nesse container vou mudar de Flex box para grade vou deixar três colunas e duas linhas porque eu quero que fique três aqui e duas linhas por enquanto ok aí eu vou terminar de preencher esses daqui esses títulos pronto

vou vir nesse e vou começar a colocar as imagens já tem essas imagens arredondadas aqui eu vou inclusive deixar aqui para vocês no Drive E aí depois de colocar todas as imagens títulos e textos a gente vai ver nesses cards de cima vamos clicar com o botão direito copiar vamos vir aqui nesse Card clicar com o botão direito colar o estilo que já vai ficar com configuração certinha eu só vou tirar dele essa configuração de efeito de movimento então vou abrir avançado efeito de movimento e vou tirar Vou deixar só essa de faedinho que é

de aparecer para não ficar tão bagunçado aqui porque tem muitos né a imagem eu vou vir aqui nesse estilo e vou deixar ela tamanho tamanho 52 o espaçamento eu vou deixar vou diminuir passar somente entre o texto e a imagem vai ficar assim E aí se a gente tiver em avançado CSS personalizado ele já trouxe aquela configuraçãozinha do Blu né eu vou clicar aqui com o botão direito copiar e vou colar o estilo em todos os outros cards sempre clicando aqui em atualizar aí a gente vai fazer a mesma coisa nos outros nas outras abinhas

então por exemplo aqui seria todos os de harmonização facial agora eu vou vir vou copiar um desses cards vou vir aqui nesse de ultrassom microfocado vou colar aí vou duplicar aqui também deixar seis vou vir aqui nesse container mudar aqui de Flex box para grade deixar né três colunas duas linhas ele já vai ficar aqui e aqui obviamente eu tenho que mudar né teria que mudar Aí eu tenho que colocar uma imagem referente a outra só micro focado e colocar o título aqui né nesse caso aqui eu coloquei só escrito ultrassom microfoncado e deixei tudo

igual mesmo coloquei a imagem também tudo igual aí no seu se você tiver mais opções você vem Coloca mais opções né eu vou fazer aqui de cada um aí você vai repetir a mesma coisa em cada um das tabs você vai vir aqui nessa Vai colar uma caixinha vai duplicar vai vir aqui vai deixar em grade Ok vou fazer nessas outras e vou substituir os títulos e imagens e já volto pronto ó já deixei aqui ultrassom microfoncado tratamentos faciais e amamentação corporal agora a gente vai configurar Aqui as nossas tabs vamos vir aqui em estilo

aqui em Abas né aí tipo de cor do Normal normal é quando não tá não tá ativo nem Passamos o mouse que é esses aqui tá vendo eu vou vir aqui em tipo de fundo e vou deixar esse gelo vou vir aqui também na tipografia aqui nos títulos vou vir aqui na cor vou deixar esse marrom para ficar um pouco mais escuro vou vir aqui na tipografia vou deixar essa de texto 2 vou voltar aqui nas Abas vou virar arredondamento vou deixar 5 vou vir aqui nos títulos aí agora eu vou configurar o ativo que

é esse daqui tá vendo vou mudar a cor para esse marrom também e houver cação de passar o mouse eu também vou mudar a cor para esse marrom que vai mudar só a cor de fundo vai ficar assim aí eu ouvi neste container aqui também de baixo vou vir em avançado vou deixar 30 de pad vou fazer isso nos outros também cada um dos containers eu vou vir me avançado vou deixar 30 de pés avançado 30 de padding avançado 30 de pedi avançado 30 de pé Ok vou clicar em atualizar na outra eu não coloquei

mas nesse aqui a gente pode adicionar mais um botão de agendamento eu vou clicar nesse copiar clicar aqui embaixo clicar aqui nesse subtítulo clicar em colar eu vou arrastar essa tábua para cima pronto aí o botão vai ficar aqui embaixo de tudo vou clicar nele vou deixar aqui Centralizado vou clicar em atualizar e vai ficar assim a nossa sessãozinha Ok vamos para essa agora que a sessão de conheça Nossa Clínica vou te ensinar a primeira a fazer essa imagem aqui também é no campo pessoal você vai vir aqui né no campo no início eu vou

deixar para vocês o link Dessa arte aqui tá vendo eu pesquisei aqui por sobre mim aqui no canva e que tem várias Artes legais ó inclusive outras que você pode pegar essa daqui também tá bem legal essa imagem aqui com essa fitinha colada não é mas eu achei essa aqui de Sobre Mim de psicóloga tá vendo e aí eu peguei ela peguei esse item aqui tá vendo era essa daqui tá vendo eu peguei só essa moldura de imagem que eu achei bonita copiei eu posso fechar vir aqui em criar design tamanho personalizado aí eu vou

colocar aqui tamanho 400 de largura por 530 criar design E aí eu colei aqui e eu posso só dar uma diminuidinha para que ela não corte nas extremidades tá vendo acertar ela aqui certinho e substituir a imagem que está aqui dentro tá aí no caso eu peguei a imagem da doutora lá né que foi uma das imagens que eu peguei no freepik também eu vou deixar para você no Drive e arrastei aqui para cima é uma moldura comum tá vendo aí a gente vai clicar em compartilhar baixar e tem que marcar fundo transparente vamos clicar

em baixar aí Prontinho você já vai ter a sua imagem que com essa moldura aí Lembrando que se você tiver gostado de outras referências como por exemplo por exemplo essa redondadinha aqui ou essa daqui é só você fazer a mesma coisa clica em cima clique em personalizar modelo aí você vai pegar somente a imagem ó dá uma arrastadinha para ver se você tá pegando tudo se não tiver da control Z né para fazer as alterações que você fez aí você arrasta tá vendo que aí você pega todos os elementos clica nele control c ou como

dizer se for no Mac e aí você vem mesma coisa cria design também personalizado 400 e cola aqui e aqui nesse caso você não consegue ver essas fitinhas porque elas são brancas e o fundo é branco aí você teria que colocar uma cor de fundo para você ter certeza que veio tá vendo é que no caso dela realmente não veio a gente pode vir aqui copiar copia Cola aqui em cima ajusta colocar só uma para você ver a justa E aí a gente colocou essa cor de fundo só para a gente conseguir ver a fitinha

mas aí quando você for salvar você tem que tirar vem aqui deixa fundo branco mesmo compartilha baixar e deixar fundo transparente Ok beleza Vamos ir pegar um Flex Box duplo estilo tipo de fundo cor gelo avançado pede 70 biblioteca título arrasta para cá vamos colocar o título aqui vou vir nesse aqui clicar com o botão direito copiar ouvir nesse clicar com o botão direito colar estilo clicar deixar ele Centralizado para esquerda vídeo na biblioteca vou pegar uma caixa de ícone arrastar Aqui para baixo vira estilo deixar o ícone para a esquerda vir aqui copiar o

texto virei conteúdo colar copiar o texto e o título e colar aqui e vou duplicar duas vezes e também vou copiar o título e o texto dessas outras duas aí a gente vai vir aqui em cada um dos itens vamos Enviar um arquivo svg que é os íconezinhos a gente colocar e até tenho esses aqui O primeiro é esse daqui da mulherzinha o outro é esse que é aí o outro é esse aqui de grupo né agora a gente vai vir aqui vai ver em estilo conteúdo tipografia a gente vai pegar essa secundária aqui no

de baixo a gente vai pegar a cor e vai colocar essa secundária tipografia já tá certinho aqui no box a gente vai deixar no meio para o ícone ficar aqui no meio vamos ver aqui em avançado impedem que vamos colocar 20 de pede vamos ver aqui embaixo em borda tipo de borda vamos deixar sólido vamos desvincular os valores aqui da largura e vamos deixar só na inferior e vamos deixar na cor salmão e vai ficar assim a cor do ícone também a gente vai mudar a gente vai ver em estilo ícone a cor a gente

vai deixar salmão vamos vir aqui no conteúdo em espaçamento do título Vamos diminuir um pouquinho vamos clicar com o botão direito copiar e clicar com o botão direito e colar estilo nos outros aí já vai ficar assim vamos ir na biblioteca pegar uma imagem arrastar para cá pegar uma imagem subir aquela imagem que a gente fez lá no canva essa aqui abrir inserir ela aqui vamos vir aqui nesse container principal vamos vir aqui em ar itens vamos deixar centro atualizar e a gente já vai ter terminado essa sessão agora a gente vai fazer essa sessão

de nosso espaço para a gente poder colocar as imagens né da empresa Vamos fazer assim a gente vai primeiro clicar nesse container duplicar aí a gente vai vir nesse container principal vai vir em layout Vamos colocar aqui envolver né para ele quebrar a linha e aí é com esse container aqui que a gente vai trabalhar a gente vai vir aqui na largura dele vamos mudar de 50 para 100 verificar em 100% do espaço podemos excluir aqui essa imagem está aqui dentro vamos ver aqui no container Vamos ver em estilo tipo de fundo Vamos mudar para

branco Vamos ir embora arredondamento colocar cinco vamos vir aqui copiar esse título colar ele aqui vou copiar esse subtítulo ficar com o botão direito e colar vamos ver no container avançado Vamos colocar aqui 35 de pede vamos ver nesse título deixar Centralizado nesse daqui já está Centralizado aí eu vou copiar e colar aqui substituir nosso espaço e o subtítulo OK agora vamos fazer o mesmo Carrossel lá de cima o mesmo que a gente fez aqui tá vendo Então como ele já tá basicamente pronto a gente vai clicar nele copiar vir aqui clicar com o botão

direito colar vou vir nesse subtítulo vou diminuir ele vou virar tipografia vou colocar essa de texto aliás vou aumentar um pouquinho vou deixar tamanho vou vir aqui no Carrossel vou excluir todos deixar só um ó aí vai ficar só uma imagem aí eu vou ir substituindo as imagens vou clicar aqui enviar arquivo eu vou deixar para vocês no Drive se você quiser redimensionar também tem ensinando mais para cima ou arrastar todos para cá vou ir selecionando uma coisa que a gente não fez no lado no de cima que a gente poderia ter feito é clicar

aqui na imagem vire estilo arredondamento colocar 5 de pede para ficar arredondado mais bonitinho vou fazer isso em todas as imagens agora é só ir duplicando e mudando a imagem mas nessa daqui eu quero que apareça quatro então eu vou vir aqui slides and display eu vou colocar quatro pronto aí vai ficar assim eu vou vir aqui nessas imagens Ou se você quiser alterar também é só ir vendo cada uma das imagens estilo arredondamento colocar cinco tá vendo vai ter arredondado a ponta aí você clica com o botão direito copia e vai nas outras imagens

e clica em colar estilo aí você vai passando cada um colar estilo colar estilo e todas vão ficar com a borda arredondada sempre atualizando para não perder nada ok Beleza vai ter ficado assim agora vamos para essa sessão de nossa equipe tá como essa sessão aqui ela foi feita com fundo de mármore Igual essa aqui de cima eu vou copiar essa sessão vou vir aqui embaixo clicar com o botão direito colar vou vir aqui vou pegar essa caixa de imagem copiar vou colocar no tabs excluir vou arrastar um edito de container para cá vou colar

aqui dentro aquele Card que eu tinha pego aí eu vou vir aqui nesse container vou configurar ele com a setinha para o lado e vou duplicar esses cards aqui até ficar com quatro aí agora é só a gente olhando aqui e substituindo pegando o texto aqui o nome das doutoras e substituindo E aí aqui nessa parte eu coloquei um texto fictício né esse CRM que que é um código de médico fictício também né obviamente coloquei o número fictício E aí para ficar assim com a quebra de linha a gente faz assim ó esse textinho é

aquele padrão que já tem né Mas para ficar com esse com essa quebra de linha você faz assim ó eu vou colocar aqui CRM ou tá alterando nesse último ele não quebra a linha se a gente não colocar uma tag HTML de maior sinal de menor e no meio BR Olha lá quebrou a linha se você quiser que quebre outra você pode copiar colar aqui do lado ou quebrou duas linhas tá vendo aí você pode fazer isso ela pode copiar e colocar nos outros e atualizar esse botãozinho aqui de saiba mais eu vou mostrar daqui

a pouco quando eu tiver feito as páginas individuais de cada um aí a gente volta e link aqui com esse botãozinho ok beleza Associação aqui foi bem tranquila porque ela já tava praticamente pronto falta só a gente substituir os títulos né de nossa equipe aqui e o subtítulo agora vamos para esta sessão aqui que a sessão de contato agora vamos fazer essa sessão que a gente chama de paralax né com essa imagem que parece que o site está passando por cima dela fica bem legal primeiro a gente vai pegar um container pode ser com a

setinha para baixo mesmo aí a gente vai vir aqui em altura mínima vamos deixar 420 de altura vamos ver no estilo tipo de fundo vamos pegar a imagem eu já tenho a imagem aqui que está na largura certa de 1920 tá e mais para cima eu ensinei vocês a colocar essa imagem nessa largura certinha então dá uma olhadinha lá mais para cima que eu ensinei no campo como fazer isso tá mas já vou deixar a imagem no tamanho certo lá no banner lá no Drive o tamanho da imagem a gente vai deixar completo tamanho da

tela preenchimento completo posição Centralizado e anexo nos deixar fixo essa opção de fixo que faz da esse efeito da imagem passando por cima tá a gente vai vir aqui em sobreposição de fundo Vamos colocar a cor preta para poder ficar com esse fundinho mais escuro Ok para dar um contraste agora aqui a gente vai pegar um container concerta para baixo vamos vir aqui na biblioteca vamos arrastar um container aqui para dentro vamos ver aqui de novo vamos arrastar um container para dentro desse vamos duplicar aí a gente vai vir nesse contêiner de fora vamos deixar

alinhado na horizontal para ficar um do lado do outro aí nesse container aqui de fora A gente vai vir avançado Vamos colocar 30 de pele as 35 te pede aí a gente vai vir aqui nessa caixa vamos vestir Aliás ele avançado fundo vamos pegar a mesma cor que está aqui vamos ver nesse aí vamos vir aqui nesse tipo de fundo colar com aqui vamos ir embora arredondamento vamos deixar 10 Vamos colocar uma sombra aí a gente vai vir aqui em cima vamos ver como que tá a sombra daqui ó avançado borda e a sombra aqui

tá vou copiar o código da cor para ficar com a cor igualzinha menos um 10 32 menos 13 vamos fazer a mesma coisa vamos ver aqui borda sombra menos um 10 32 menos 13 e a cor E aí a gente deixa mesmo intensidade da sombrinha aí em borda a gente vai deixar sólido vamos desvincular e apenas no inferior vamos deixar um e vamos pegar essa cor aqui e vai ficar com aliás a conta errada é essa cor mais clara que salmão Beleza agora vamos pegar esse título copiar colar ele aqui vou deixar ele alinhado à

esquerda vou vir aqui neste de cima copiar ouvir nesse e colar o estilo eu vou deixar aqui em conteúdo alinhado para esquerda novamente agora a gente vai clicar em atualizar Vamos abrir aqui o nosso rodapé para a gente copiar esse widget de endereço que já está pronto então é só clicar aqui no rodapé vou clicar copiar Aí eu clico aqui em cima de novo em editar a página que eu vou voltar para página home aí eu desço vou clicar com o botão direito clicar em colar atualizar lutar com o botão direito duplicar com o botão

direito duplicar aí aqui eu vou mudar aqui no meu lugar só para unidade 2 aí no seu caso você muda o endereço se tiver né duas unidades de interesse não já deixa só um aí nesse aqui eu vou mudar porque esse aqui estão os contatos né Aí eu tenho esse íconezinho aqui de contato e eu vou deixar para vocês aí você vai enviar o arquivo spg aí você vai pegar aqui aí você vai colocar aqui os dados eu vou pegar esse título aqui de atendimento até às 18 horas vou colocar aqui vou pegar esse daqui

que são os telefones e os telefones e os e-mails para quebrar a linha a gente vai colocar sinal de maior sinal de menor e no meio BR aí vamos copiar e colocar aqui embaixo também que ele vai quebrar a linha aí agora a gente vai vir aqui vamos Enviar um arquivo aí a gente vai pegar esse vídeozinho aqui nesse aqui também pior que VCG é importante que a gente Siga um padrão tá com esse daqui por exemplo as linhas estão loucas né não está preenchido por dentro os de cima também tem que ser na mesma

identidade para não ficar bagunçado Ok vamos ver aqui no estilo ícone tamanho Vamos aumentar o tamanho dele conteúdo tipografia Vamos aumentar o tamanho do título também e aqui na descrição também vamos aumentar o tamanho aí vamos colocar com o botão direito copiar colocar com o botão direito colar estilo botão direito colar estilo aí eu vou vir nesse vou virar avançado Vou colocar aqui de pé de 20 vou colocar e copiar e colar o estilo nos outros e vai ficar assim aí eu vou vir aqui neste contêiner vou virar avançado vou deixar cinco aliás vou deixar

10 de pede vou desvincular e aqui nesse pé de desse espaçamento aqui aí no pé de me dar direita eu vou colocar 150 agora eu vou duplicar esse título arrastar ele para cá vou aproveitar já vou copiar esse aqui vou colocar aqui colar já vou copiar esse subtítulo aí eu vou vir aqui nesse copiar clicar aqui colar e substituir substituir deixar alinhado para esquerda vou vir aqui ouvir estilo tipografia vou diminuir o tamanho dele vou vir aqui na biblioteca vou pegar um widget de formulário vou arrastar para cá eu vou só te ensinar a configurar

o formulário aqui o layout mas para aprender como formar funciona ou não onde você recebe os e-mails etc etc tem vídeo aqui no canal explicando mais a fundo tá vou deixar para você a gente não perder muito tempo aqui tá eu vou deixar nome e meio telefone aí Aqui você pode duplicar nos campos ou então Adicionar novo ou adicionar um novo arrastar aqui para cima aí eu vou pegar o Type de telefone aí eu vou colocar aqui telefone e vou copiar e vou colar aqui dentro também telefone aí eu vou duplicar aí se eu vou

mudar para select ou seleção selecionar que é essa abinha aqui de selecionar aí aqui eu vou colocar algumas opções ó que eu coloquei harmonização facial a organização corporal aí você vai escrever um abaixo do outro aqui nesse campinho que aí vai ficar as opções ó cada linha que você fizer vai ser uma opção Ok E aí aqui no rótulo a gente vai colocar assunto que é o nome aqui desse Campo aí eu vou vir nesse do e-mail em largura da coluna vou deixar 50% e vou vir nesse do telefone e vou deixar 50% para que

um fique do lado do outro aí eu vou vir aqui em rótulo e vou desativar para não ficar aparecendo os títulos vou vir aqui em tamanho do campo vou deixar grande vai ficar assim vou vir aqui estilo Campo cor do fundo eu vou deixar esse salmão aqui deixar o salmão também cor do texto eu vou deixar esse secundário tipografia eu vou deixar essa texto 2 botões na tipografia vou deixar esse texto 2 também no Hover eu vou vir na cor de fundo e vou deixar esse marrom vai ficar assim e também vou deixar grow que

a animação de passar o mouse assim OK a cor de fundo aqui do Campo eu vou vir aqui nela e vou diminuir um pouquinho a intensidade para ficar tão grossa aí agora eu vou vir aqui vou copiar esse título que eu não tinha mudado né vou mudar para cá vou pegar esse container aqui o principal ouvirem avançado vou vir a imagem vou desvincular os valores de imagem e na superior que a margem de cima eu vou colocar uma margem negativa que aí a gente sobe ele aqui para cima e aí eu vou colocar aquele código

de blue vou vir nesse daqui vou virar avançado personalizado vou copiar vou vir nesse container aqui quando isso acontece quando você não consegue pegar o container você vem aqui navegador tá vendo aí você vem tenta selecionar tentar achar vai fechando os containers que fica mais fácil de você achar o container que a gente está tá querendo ele está dentro desse aqui esse é esse principal aí a gente abre e aí tem um container de baixo que é onde está a cor que é esse aqui aí você vem avançado e coloca o Blue a cor acho

que a gente pode aumentar um pouquinho a opacidade dela para ficar mais visível ainda vai ficar com dorzinho aqui mas está ficando visível agora a gente vai fazer essa parte aqui dos posts para a gente criar ela primeiro a gente precisa criar os posts dentro do nosso WordPress presta bastante atenção nessa parte que é o restante das páginas vão depender muito desses posts aqui ok então por favor presta bastante atenção eu vou te ensinar a fazer três tipos de post tá ó para você criar um post aqui no WordPress ó um post é uma uma

página que você nomeia ela com título Coloca uma foto para ser a foto destaque dela e coloca um texto certo e aí você consegue criar várias páginas falando sobre diversos assuntos que você quiser e você consegue chamar essas páginas aqui assim ó encartezinhos em formato de posts então posts nada mais é do que páginas que a gente consegue categorizar dividir e organizar eles ali em páginas ou em uma página só por categoria por tag por assunto Tá bom e isso fica aqui dentro do wordpression nessa aba de posts é assim que a gente forma o

nosso blog a gente cria vários posts E aí a gente coloca na nossa página de blog um blog é isso é uma página onde tem todos os posts que a gente criou e a gente consegue separar por categoria por tag por assunto tá aí para criar um post você vai vir aqui em Post acionar novo é sempre assim poxa de Adicionar novo aí aqui você vai colocar o título eu vou abrir esse daqui para já copiar o dele ó vai copiar o título Vai colar o título aqui e você vai copiar o texto ou escrever

o texto todos esses textos aqui são fictícios eu pedi para o chat GPT gerar Tá bom então escreve ou então vai lá e pede para o chá de app geral texto para você só você pedir Gere um texto com esse assunto já era um texto com esse título já no texto para isso tem vídeo aqui no canal te ensinando a pedir um chá de APT para criar coisas para você tá aí você vai sempre clicar aqui na abinha de post aqui em cima aí você tem algumas coisas para fazer primeiro você vai selecionar uma categoria

para ele tá isso daqui eu tô falando de harmonização facial né então eu vou colocar ele na categoria de harmonização facial vou clicar em adicionar categoria aí aqui eu vou colocar o nome da categoria A harmonização facial para a gente conseguir pesquisar por categoria dividir por categoria depois tu é muito importante que você coloque uma categoria tá quando você está escrevendo aqui que você tá adicionando uma nova você clicar no enter aí ele já adiciona tá vendo marcado com um chequezinho aí agora você tem que vir e colocar uma imagem destacada A imagem destacada é

a imagem que vai aparecer aqui na página do próprio post e também aqui no cardzinho tá então você não pode esquecer de pôr essa imagem também tu vai clicar aqui para definir a imagem vai subir ela vou deixar as que eu usei aqui no projeto para você mas aí você pode tirar essas fotos dos seus produtos serviços de acordo com seu projeto Você pode buscar em bancos de imagens também ok então você vai subir aqui a imagem e vai clicar aqui em publicar duas vezes tá vendo publicar publicar aí pronto se a gente voltar aqui

no WordPress aqui em posts todos os posts a gente já vai ver que tem esse aqui legal que a gente exclua esse post teste que é chamado de olá mundo que é um post que WordPress cria por padrão quando ele instala tá você pode clicar em lixeira nos ver assim você consegue excluir se você tiver excluído algum curso sem querer só vir aqui no lixo clicar em restaurar tá você vai conseguir restaurar aí se você quiser editar alguma coisa do poxa é só você clicar aqui editar que aí você consegue editar o título Editar o

texto aqui dentro do post Você pode adicionar imagem Se você quiser eu clico aqui coloca mais imagens aqui no meio ilustrativas tá fica a seu critério aí sempre que fizer alguma atualização atualiza Ok beleza aí você vai vir aqui e vai fazer quantos posts você quiser e também recomendo que você crie posts para as especialidades por exemplo aqui na nossa página home a gente criou aqui as especialidades né que são os serviços que a empresa oferece tudo mais E lembra que eu falei para você que depois a gente vai linkar para ir para página de

cada um então nas especialidades Eu recomendo que você crie uma páginazinha falando sobre cada uma aí você vai fazer assim por exemplo eu tenho a especialidade rinomodelação né aí eu vou vir aqui Adicionar novo vou para o título vou por o texto Lembrando que o texto pediu para o chá de apetejar colo aqui o texto vou vir aqui em Post aí aqui na categoria eu vou adicionar uma categoria E vou chamar de Especialidades aí todos os posts que eu for criar para as especialidades eu vou marcar essa categoria tá vou marcar essa categoria especialidades para

que a gente consiga limpar ela lá mais para frente aí vem aqui definir a imagem vou subir a imagem aqui publicar publicar Beleza se você olhar agora você vai ver que não tá daquele jeito lá porque a gente ainda não configurou né para ficar daquele jeito lá bonitinho eu vou te ensinar mais para frente a configurar tá bom Por enquanto você vai só criar os posts então recomendo que você crie essa das especialidades e também se você tiver fazendo essa sessão aqui de equipe né ou mesmo que não tem uma equipe que seja só você

que seja apenas uma pessoa na sua empresa você cria a sua página aqui no post também então você vai vir Adicionar novo vai colocar o seu nome aqui no título como por exemplo eu fiz da doutora Anastácia isso aqui também é feticista pedir tudo para o chá de apertar gerar então você vem coloca o seu nome que na aba de título escreve um texto falando sobre você o que você quiser sobre você copia e cola para cá vem aquele post vem aqui me adicionar categoria E aí você coloca a categoria equipe ou se for só

você você coloca o nome da sua profissão ou seu nome aqui na categoria Tá bom pode ser também aí você né lembra quando escreve aqui dá o enter para ela ficar marcadinha ali vem aqui na imagem e sobe a imagem para cá beleza publicar publicar o que que eu recomendo que você faça esses três tipos de post então recapitulando você vai fazer posts de conteúdo explicando coisas sobre o seu trabalho então aqui por exemplo Como saber se precisa de harmonização do rosto como é feito o procedimento de organização porque fazer harmonização Então você vai fazer

nesse tipo de conteúdo que você acha interessante aí para o seu trabalho que as pessoas vão pesquisar Porque quanto mais conteúdo você tiver no seu site mais rápido ele vai aparecer lá nas pesquisas do Google porque o Google ele é um buscador quando você pesquisa alguma coisa aqui ó por exemplo como funciona harmonização facial vai aparecer Primeiro as pessoas que estão pagando para estarem aqui né no Google e mais embaixo vai aparecer o que o Google indica para a gente mesmo orgânicamente então aqui você pode perceber que ele deu para a gente um resultado aqui

de um site ó que tá falando isso O que é como é feita Então essa esse site Ele criou um post de blog sobre harmonização facial E aí porque eu pesquisei no Google eu vim parar no site dele então quanto mais conteúdo você tiver explicando mais sobre cada coisinha que você faz sobre cada serviço que você faz dúvidas que as pessoas possam ter mais fácil vai ser do Google mandar o seu site para essas pessoas tá então Esse é um dos tipos de conteúdo você vai criar o outro que nem eu te falei Vai ser

da equipe Então você vai criar os da equipe para a gente conseguir chamar na página da equipe e você vai criar o das especialidades todas as especialidades todos os serviços que você tiver você vai criar um post para cada um deles tá vou te mostrar mais uma das especialidades aqui só para te mostrar uma coisa vou fazer de preenchimento de mandíbula quando você já criou a categoria ela já fica linkada então é só você selecionar você vai vir aqui em Adicionar novo vai colocar o título vai colocar o texto vai vir aqui em Post e

olha só agora eu não preciso mais clicar em adicionar uma nova categoria já está aqui é só os selecionar eu vou clicar aqui nesse especialidades vou adicionar uma nova imagem vou subir a imagem que eu quero ir para cá publicar publicar tá só para te dizer isso quando a categoria ela já está criada você pode só clicar aqui nesse selecionar ela tá bom que aí você não precisa toda vez adicionar uma nova senão vai ficando duplicada tá então quando for especialidade você marca especialidade quando for equipe você marca a equipe e quando for o conteúdo

aleatório conteúdo sobre o que você faz não precisa ser uma só você pode ir colocando várias então vou fazer mais uma do conteúdo aleatório aqui para você ver aliás aleatório não né conteúdo aqui educativo Como é feito o procedimento de harmonização Adicionar novo colocar aqui o título Olá vou colar aqui post esse aqui é de harmonização facial eu posso tanto marcar harmonização aqui ou então eu posso criar uma nova como por exemplo se fosse sobre harmonização corporal eu poderia colocar a harmonização corporal e marcar aqui sabe então você não necessariamente precisa fazer igualzinho nesses conteúdo

aleatório só no de equipe especialidade que você só usa essas duas agora nos outros você pode ir colocando de acordo com o que for o tema tá você vai limitando de acordo com o que foi o tema tá Aí você coloca a imagem né vem ele definir imagem sobe a imagem e sal então você vai fazer isso com todos os especialidades todos a equipe todo o conteúdo que você quer fazer eu vou colocar os outros que eu já tenho aqui e já volto Olha só eu já criei todos os meus aqui da equipe criei das

especialidades também olha só e criei uns de conteúdo aleatório também tá bom Já fiz tudo agora eu vou voltar aqui na nossa página home vou criar a nossa sessão de block vou vir aqui vou vir flags Box vou pegar um container com a seta para baixo vou colocar 70 de padding vou vir aqui neste nesse título vou copiar vou clicar com o botão direito colar vou mudar aqui para o nosso blog vou vir na biblioteca vou pegar o edifício de posts do Elementor é esse aqui vou arrastar para cá tá vendo e aí agora ele

já começa a puxar tá vou vir aqui em skin e vou mudar para cartões ou cards se tiver escrito em inglês no seu que ele já vai ficar mais ou menos configurado do jeito que a gente quer aí eu vou vir aqui em tamanho da imagem vou deixar completo é importante deixar em complexo na imagem fique embaçada vou vir aqui em consulta e vou excluir alguns posts que eu não quero que apareça aqui então aqui nessa primeira sessão eu só quero que apareça antes de conteúdo Então vou vir aqui excluir vou selecionar vou vir aqui

em termo e vou escrever o termo que eu quero excluir então eu quero excluir aqui o termo só uma categorias tá equipe então todos que tiverem na categoria equipe não vai aparecer e a categoria especialidades também aí não vai aparecer vai aparecer só de conteúdo padrão mesmo tá vamos voltar aqui para o layout eu quero que apareça só três por página para não ficar muito extensa né então é Que impostos por página que você muda 3 aqui embaixo eu não quero que apareça a data comentário Então vou excluir aqui meta dados aos cuidados e comentário

quer que apareceu só o botãozinho de leia mais mesmo e também não quero que apareça imagens do autor eu vou vir aqui em Avatar e vou desativar Prontinho agora eu vou vir aqui em editar estilo vou vir em conteúdo espaçamento vou diminuir um pouquinho espaçamento entre o título e o texto o espaçamento entre o resumo e o motor de leia mais e o botão de leia mais e o final também vou diminuir um pouquinho aqui na imagem também vou diminuir o espaçamento que é entre o título e a imagem vou voltar aqui para conteúdo vou

vir tipografia vou colocar essa tipografia do secundário o texto tá legal aqui no leia mais eu vou aumentar o tamanho deixar maiorzinho assim mas eu acho que a gente pode aumentar um pouquinho espaçamento acho que a gente pode aumentar um pouquinho espaçamento daqui vamos deixar oito aqui e oito ali também Aliás Tá bom o texto também está ficando muito grande vou vir aqui em conteúdo aqui em resumo do texto ela tá mais resumo vou deixar 25 ele tá com bugzinho que não tá mostrando aqui diminuindo mas lá na página aberta a gente consegue ver vou

voltar aqui em estilo conteúdo no resumo eu vou mudar aqui para texto 2 e vou clicar em atualizar Aliás eu só vou vir aqui e vou diminuir a altura dessa linha que eu achei que ficou muito espalhado só vir aqui dar uma diminuída vou colocar em vai ser mais fácil unidade de medida em Vou atualizar vou ver a página carregada para ver como é que tá ficando ó agora sim tá ficando assim vou vir aqui na imagem e aqui na onde que tem a categoria tá vendo que tá ficando na categoria em cima da imagem

aqui na cor do texto eu vou mudar para marrom vai ficar com as habilidades melhor eu vou colocar em atualizar vamos ver como é que tá ficando Beleza agora vamos pegar essa esse botão aqui de agendar consulta copiar clicar aqui com o botão direito clicar em colar ou deixar ele alinhado para direita e vou mudar o textinho dele aqui para ver todos as pessoas irem ver todos os roxos vou mudar o ícone aqui para uma setinha Vou pesquisar aqui por essa setinha vou pôr essa daqui ficar inserir e vou mudar a posição do ícone para

depois ele vai ficar assim vou clicar em atualizar pronto aí aqui nesse a gente vai colocar o link da página blog para que a gente vá para a página blog onde fica todos os posts vamos clicar em atualizar Pronto já está pronta a nossa página home no desktop agora a gente vai fazer as adaptações para o mobile que é a gente configurar a visualização no celular no tablet tá ok primeiro a gente vai adaptar essa imagem aqui para mobile aqui ó quando a gente está colocando no mobile e para você colocar no mobile no celular

no tablet para você visualizar é assim aqui embaixo tem essa opção de modo responsivo você clica aparece essas três opções aqui em cima aqui é um computador aqui no tablet e aqui no celular tá então aparece assim tá vendo a imagem ela está muito grande para ficar no celular a gente precisa fazer uma versão dela adaptada Tá bom então o que que a gente vai fazer primeiro você vai abrir o seu canva que foi aonde você criou da sua imagem vai vir aqui nos seus layouts recentes né que vai estar aqui na primeira página aí

você vai clicar aqui na onde que você fez o banner vai deixar aberto vai abrir outra página do canva vai clicar em criar um novo design tamanho personalizado vai colocar 1080 de largura e vamos colocar de altura 1.700 e vamos clicar em Criar novo design assim a gente vai criar uma imagem bem Estreita tá vendo que vai dar para a gente fazer esse espaço todo aqui do Banner Então a gente vai fazer o seguinte vamos vir neste vamos pegar a mulher né a pessoa que você colocou que recortada aí vamos colar aqui aí a gente

vai vir vai pegar vai arrastar Aqui para baixo vai clicar aqui vai expandir ou vai deixar mais ou menos cortada aqui repara se veio com a sombra vamos vir aqui vamos pegar o fundo a gente vai clicar copiar vamos clicar aqui colar ele já vem você pode vir aqui e redimensionar ou mudar de lugar ele aqui se você quiser vai ficar assim aí a gente vai vir aqui vai clicar em compartilhar vai clicar em baixar e vai baixar agora a gente vai vir aqui no container vai vir em estilo vamos clicar aqui na imagem e

vamos arrastar para cá a imagem que a gente baixou tá vendo que a imagem ela já tá ficando aqui no tamanho melhor então a gente vai fazer o seguinte vai vir aqui primeiro nesse título vamos irem avançado aqui em largura a gente vai mudar para 100% Vamos iniciar aliás eu vou fazer uma configuração padrão aqui para a gente não perder muito tempo vou clicar primeiro em atualizar vou ver aqui nesses três Barrinhas configurações do site Fontes globais aí vamos configurar para mobile aqui esse primário que é onde a gente tá puxando a maioria das vezes

a gente vai diminuir um pouco ele vou deixar também o 30 o restante está com tamanho legal vou clicar em atualizar vou fechar que a gente não precisa fazer em todos que a gente selecionou ó tá vendo ele já diminuiu sozinho vamos ver aqui neste texto avançado aqui em largura a gente vai deixar 100% não está me deixando clicar quando isso acontece eu só vou sair carregar a página tá Às vezes dá um bugzinho assim também não tem problema você recarrega Sai e volta e volta a funcionar ó recarreguei vou voltar aqui para o modo

responsivo tá vendo ele já diminuiu sozinho e todos os títulos que a gente colocou desse tamanho já diminuiu sozinho também vamos vir aqui nesse texto avançado largura e vamos mudar para 100% que aí ele fica na extensão da tela toda aqui vamos ver aqui nesse contêiner avançado Vamos colocar 30 de padim aí vamos vir aqui em layout aí aqui em conteúdo a gente vai deixar aqui ó no início para ele ficar toda alinhado ali no início esse botão a gente vai clicar vai deixar alinhado aqui ao centro né Centralizado aí tá vendo ficou certinho apareceu

a doutora aqui ficou espaço em branco ali certinho para a gente poder colocar o texto aliás eu acho que vou fazer assim vou clicar nele e vou deixar Centralizado vai ficar melhor no texto também vou clicar vou deixar Centralizado vai ficar mais harmônico aí o texto Ficou ali em cima a doutora ficou aqui embaixo e o cardiozinho já ficou aqui embaixo a gente vai vir nesse container aqui onde está os cards vai virar avançado Vamos colocar 20 de padim ele vai ficar assim já tá com espaçamento legal aqui ele tá com espaço a mais aqui

tá vendo porque está esse contêiner aqui onde está os cards que tá duas linhas aqui a gente vai diminuir para uma que aí esse espaço em branco que tá ficando a mais aqui ele vai sumir agora vamos ir nesse contêiner avançado Vamos colocar 30 de padim o tamanho do texto aqui já tá legal esse aqui também avançado 30 de padim o tamanho do texto que já está legal esse aqui também é avançado 30 de padding nesse título deixar ele Centralizado tamanho aqui dos outros já está legal aqui também o espaçamento tá legal também vamos ver

neste avançado 30 de padim tamanho dos outros já está OK aqui a gente vai clicar vai diminuir um pouquinho a altura dele aqui a gente vai ver a gente não consegue selecionar aqui né então vamos vir aqui no navegador vamos ver se é esse aqui que a gente tá é o de baixo um de baixo eu vou abrir ele aí esse contêiner aqui de dentro vou virar avançado Vou colocar aqui 20 de pad aí eu vou vir aqui em avançado vou vir aqui impede vou colocar 20 de padim vou vir no container de baixo que

esse aqui que está de branco depois vou vir nesse aqui que é o de cima vou virar avançado o desenho Gloss valores de pedi vou vincular de novo vou deixar 10 vou abrir ele vou ver no título vou ver aqui conteúdo vou deixar centralizado aí esse daqui da unidade tá um tamanho ok esse daqui também já tá ok Vamos ir nesse aqui avançado 30 de padding botão vamos deixar aqui Centralizado e vamos atualizar E aí já está certinho aqui o nosso site para mobile essa sessão aqui das especialidades a gente pode dar um adaptada aqui

em cada uma delas né a gente vai ter que vir cada um dos containers avançado e diminuir o pé de a gente pode deixar só 10 de pede Olha só para não ficar muito Estreito né então você vem vem todas as abinhas aqui ó essa aqui também ultrassom microfoncado vou clicar vou vir em avançado 10 de pede ouvir nessa outra tratamentos sociais avançado avançado 10 de pede vou vir nessa última organização corporal avançado 10 de pés lembrando tem que clicar aqui tá no container de cada uma delas e depois só clicar em atualizar e aqui

você percebe que elas vão ficando abertas conforme as tabs né o restante vai ficando aqui embaixo se você não quiser que fique assim você pode vir aqui no tabs vir aqui em configurações adicionais e em Pontos de quebra você deixa nenhum que aí já fica todos aqui em cima a pessoa clica aqui em cima e vai mudando OK aí só atualizar Prontinho vamos ter terminado a página home agora a gente vai criar a página de Especialidades para acessar a página de especialidade você pode clicar aqui no menu onde a gente já tinha colocado ela ou

então você vem aqui no painel de missa de prece páginas todas as páginas seleciona ela aqui clique em editar e clica aqui em cima em editar com Elementor tá beleza a gente vai vir aqui em configurações aqui embaixo em layout da página Vamos colocar Elementor largura total para assumir com esse título ali vamos clicar em atualizar vai ser uma página bem simples de fazer tá vendo a gente já vai pegar Praticamente tudo que tá pronto lá da home então aqui com a sua home aberta Ah esqueci de falar uma coisa eu te ensinei a configurar

para o celular você pode fazer as mesmas adaptações aqui para o tablet tá eu não vou fazer para não ficar muito grande mas aí você pode adaptar tudo que você fizer só em um se for só configura ções de espaçamento tá vai dar certinho não vai excluir as configurações do outro nome que você faz em um fica só em um tá só se você arrastar ou excluir as coisas que aí sim o que você fizer em vai alterar nos outros também mas se você só seguir as mesmas configurações que eu fiz de espaçamento não vai

alterar não tá beleza então a gente vai ficar aqui na página aberta vamos ver aqui na sessão de Especialidades vamos clicar aqui copiar o título vamos ver aqui pegar um container uma setinha para baixo vire em estilo tipo de fundo vamos pegar essa cor aqui de salmão vamos colar o título que a gente pegou aqui deixar ele Centralizado eu vou ver Estilo vou diminuir um pouco o tamanho dele vou vir aqui vou copiar o subtítulo vou clicar com o botão direito colar vou vir nesse container vou virem avançado vou deixar uns 70 de padding vou

desvincular aqui no inferior caiu de baixo eu vou deixar com 150 de pet aí eu vou vir aqui vou pegar um container com a setinha para baixo vou voltar aqui na página home vou clicar com o botão direito copiar essa tablet que está aqui vou clicar com o botão direito colar vou clicar nesse container vire avançado clicar aqui imagem colocar uma imagem negativa de 45 que aí ele vai ficar assim que eu vou diminuir esse espaçamento ali de cima eu vou vir nesse container de cima vou colocar 130 e vai ficar assim aí vamos jogar

o botão de agendamento que tá aqui copiar vou clicar nesse times clicar em colar ele vai ficar aqui embaixo vou clicar em atualizar aí agora a gente vai linkar todos as nossas especialidades lembra que a gente fez um post para cada um é só você vir aqui vir aqui no link e Se você começar a escrever que já vai aparecer por exemplo indo modelação que é um post tá vendo tá escrito aqui vou clicar e vou selecionar que ele já traz o link esse aqui também preenchimento de mandíbula se eu tiver colocado o mesmo título

que tá aqui já vai aparecer a mesma coisa enchimento labial tá vendo vai aparecendo você vai selecionando eu vou fazer isso em todos os que eu tenho aqui lembre-se de fazer isso nos outros também tá então eu tenho que por exemplo ultrassom microfocado tem que fazer isso também vem em um por um e vou selecionando aqui também tratamentos faciais venho em um por um dos cards e vou selecionando ok Aí depois que você fizer tudo isso você clica em atualizar vamos clicar aqui no modo responsivo ou essa parte de baixo a gente já tinha configurado

Então não precisa fazer nada só essa parte de cima que a gente vai clicar vai vir avançado vai colocar 30 de padim desvincular e no de cima a gente vai colocar até no de baixo quer dizer né no de baixo que é o inferior a gente vai colocar 70 de pet E aí vai ficar assim beleza Prontinho página especialidades criadas Vamos criar aqui agora a nossa página de nossa equipe olha a página nosso equipe é bem parecida com a outra Olha só então a gente já vai vir aqui vai copiar esse primeiro container podemos fechar

aqui vamos ver aqui na página nossa equipe clicar aqui em cima e editar com a página depois em editar com Elementor vir na engrenagem deixar Elementor agora total direito colar para colar aquela sensação que a gente pegou e a gente vai substituir o título e o subtítulo também pronto aí vamos ver aqui na página home e a gente vai pegar essa sessão que a gente fez da nossa equipe Ah eu esqueci de fazer aqui mudar para as imagens das dos doutores né da equipe de verdade certinho aqui e aí você faz isso na sua tá

eu tinha só colocado e esqueci de mudar aí lembra que lá no outro site tem um botãozinho aqui de clicar para saiba mais a gente vai fazer primeiro uma gambiarra aqui para a gente conseguir economizar tempo vamos arrastar o Edition de texto para cá aí a gente vai escrever aqui saiba mais vai selecionar vai clicar aqui para sublinhar o texto e aí a gente vai selecionar e vai clicar aqui para linkar para gente colocar um link aqui nele aí nessa hora é bom a gente acessar aqui o site por dentro do painel do imposto de

todos os posts e ir pegando o link aqui de cada post né porque a gente tá querendo que a pessoa clica em saber mais e vá para o posto que a gente fez falando mais da pessoa pessoal Doutora Anastácia vou clicar aqui com o botão direito tá e vê aí vou clicar em copiar endereço do link vou vir aqui colar e clicar aqui para aplicar aí eu vou vir em texto copiar vou vir aqui e vai ficar aqui ó o botãozinho saiba mais só que aí eu vou pegar um BR desse e vou colocar aqui

para quebrar a linha tá vendo aí vai ficar aqui embaixo aí a gente vai fazer a mesma coisa nos outros agora a gente precisa só clicar aqui clicar na lapiseira e mudando o link Então você vai fazer isso agora Doutora quem Júlia Clica com o botão direito copia o endereço do link clique em apagar cola no link clica aqui vem texto copia vem aqui cola pega um BR e cola aqui aí você faz em todos os que você tiver vou fazer isso nos outros dois aqui já volto aí aqui a gente clica em atualizar aí

tá vendo que tá ficando Rosinha aqui os links é porque a gente não fez uma configuração padrão nos links a gente pode vir aqui nessas três Barrinhas configuração no site tipografia aqui embaixo e aqui em link a gente coloca uma cor padrão para todos os links eu vou colocar essa marrom vou colocar em atualizar pronto posso fechar que já está assim aí a gente vem copia esse contêiner bem aqui na nossa página clica aqui cola ele aqui embaixo vem aqui no controle principal os valores de imagem e sobe ele aqui para cima deixar 86 de

Margem negativa e vai ficar assim agora eu vou vir vou pegar esse botãozinho de agendamento copiar vou clicar com o botão direito colar ele aqui embaixo vou vir nesse container avançado a loja pede e no Aqui de baixo vou colocar 70 Vou atualizar vai ficar assim aqui só tá aparecendo rosa porque não vai carregar a página tá mas se eu acessar aqui na página carregada ele vai estar marronzinho do jeito que a gente configurou E se a gente clicar ele vai nos levar para o posto correspondente que a gente usa o link beleza Ou nós

já criamos a paz de equipe agora vamos criar a página individual de post que é justamente essa página aqui quando a gente acessa uma coisa que faltou a gente fazer que a gente poderia fazer também é vir em cada um dos cards e colocar esse mesmo link sabe da página da pessoa da doutora da equipe aqui se você fizer isso aí fica clicável aqui na imagem e no título no texto não fica mas pelo menos na imagem no título fica então a gente pode fazer isso também virem cada um deles e aqui na parte do

link vire colocar o link aqui tá você clica no card aí aqui vai ter link e você vem e pesquisa pelo link da pessoa quiser pode até se não quiser ir lá e fazer de novo pode clicar aqui com o botão direito copiar voltar aqui na página fechar aqui clicar no mais um clicar clicar em colar e clicar aqui avançado desencluir no inferior põe 70 exempla de imagem e no superior põe 85 e prontinho para não ter que ficar colando de um em um tá aí vai ficar clicável em mais coisas aí agora vamos criar

a página individual né para isso a gente vai ter que vir dentro do WordPress no painel vamos irem modelos Adicionar novo a página individual de Poxa a gente não cria uma página a gente cria igual menu sabe um modelo que vai ficar sendo representada em todas as páginas de post a gente vai clicar aqui para selecionar a gente vai selecionar página individual Vamos colocar um título né vou colocar a postagem vou clicar em criar modelo ele geralmente Já tem alguns modelos aqui aí você pode clicar em selecionar eu vou criar um do zero vou clicar

aqui vou clicar no Flex Box pegar um container com a setinha para baixo viria avançado colocar 50 de pedirem estilo tipo de fundo a cor eu vou pegar essa salmão vou fazer parecido com essa de Especialidades vou vir aqui na biblioteca aqui a gente consegue puxar as informações individuais do post então por exemplo aqui o título do post a gente arrasta para cá ele já puxa o específico vamos deixar aqui centralizado Vamos ir em estilo tipografia a gente pode diminuir ele para 40 vai ficar melhor Ok eu vou vir nesse container principal vou vir avançado

desinclar os valores de pede e no inferior eu vou deixar 1050 vou vir aqui embaixo vou pegar um container com a setinha para baixo vou virar avançado vou ver em pé vou colocar 50 de pedi vou vir aqui na biblioteca vou pegar em vou pegar a imagem destacada ele já vai puxar automaticamente a imagem no post tamanho da imagem tem que estar completo vou vir aqui na biblioteca vou pegar aqui os dados do potion informações da postagem Vou colocar aqui embaixo ele já vai pegar as informações vou ver em estilo vou deixar Centralizado vou vir

em conteúdo vou excluir o autor Vou deixar só o restante das informações vou voltar aqui na biblioteca vou pegar o conteúdo da postagem aí ele vai puxar o texto que a gente colocou vou ver aqui em tipografia vou pegar essa do texto 2 já vai ficar aqui vou vir aqui na biblioteca vou pegar aqui esse comentário do post vou arrastar para cá aí eu vou clicar aqui nessa setinha vou clicar em salvar rascunho para configurar esse formulário aqui como ele é um formulário padrão do WordPress a gente precisa fazer mexer naquelas configurações padrões do tema

a gente vai vir nessas três Barrinhas configurações do site ó primeiro eu vou clicar aqui no olhinho para a gente ver que tipo de título que é esse aqui vou clicar em expedicionar ele é um H2 tá vendo e aqui nas configurações da tipografia a gente consegue configurar vários tipos de títulos A Hierarquia dos títulos vai determinando qual H que ele é então o título principal é o H1 subtítulo H2 H3 E aí por aí vai E se a gente quiser fazer configurações específicas para cada um desses a gente consegue Então vou vir aqui na

cor do H2 vou colocar esse secundário vou ver aqui né tipografia vou pegar essa tipografia de primário mas vou diminuir aqui o tamanho vou deixar 35 nesses aqui de baixo vou clicar aqui clicar inspecionar ele é um tipo de texto padrão vai ficar marrom mesmo aí vamos clicar aqui para voltar vamos ir nos campos do formulário para a gente conseguir adaptar aqui arredondamento vamos deixar 10 que aí arredondar aqui do texto a gente vai deixar de marrom aquele tipo de borda vamos deixar sólido vamos deixar uma e aqui na cor a gente vai deixar esse

marrom para ele ficar mais clarinho atualizar aqui na tipografia do campo vamos pegar essa de texto 2 no rótulo a gente vai deixar com marrom aqui vamos voltar vamos configurar os botões aqui na borda a gente vai deixar nenhum E aí aqui né tipografia a gente pode vir aqui em peso e deixar 500 e aumentar um pouquinho vamos atualizar aí a gente pode fechar já vamos ter configurado o nosso formulário agora a gente vai vir aqui na página Vamos pegar esse botão que a gente já tinha configurado vamos ver aqui antes do formulário clicar aqui

com o botão direito colar aí eu vou duplicar Na verdade eu vou vir aqui vou pegar um container colocar aqui e vou colocar esses dois botões um do lado do outro nesse container vou por ele aqui um do lado do outro ouvindo esse container vou vir aqui em direção vou deixar aqui horizontal vou vir aqui em conteúdo vou deixar no centro e aí eu vou mudar esse aqui para nossas especialidades aí vou mudar o ícone para aquele de Arrow que a setinha vou mudar de antes para depois eu vou mudar a cor dele vou vir

em estilo cor vou deixar essa cor gelo e vai ficar assim e aí aqui em nossos especialidades a gente vai vir conteúdo Vamos mudar o link para o link da página de nossos especialistas Aliás o nome da página é só especialidades pronto sempre clicando aqui clicando em salvar para não perder nada agora a gente vai voltar na página home Vamos pegar esse vídeo aqui de post que já tá configurado Clica com o botão direito clica em copiar vamos clicar aqui vamos lá clicar em colar vamos ver na biblioteca pegaram mediante de título arrastar para cá

e vamos escrever assim veja também vamos ver Estilo diminuir o tamanho vamos clicar aqui nesse nesses posts Vamos ir em colunas mudar para quatro Pois por página Vamos colocar quatro vamos vir aqui em consulta e vamos mudar de post para relacionado que vai aparecer os relacionados aqui vamos clicar aqui e clicar em salvar rascunho agora a gente vai vir neste contêiner desvinculosa Loures de pedem no pé de superior a gente vai tirar aqui vai deixar zero desinculosa Loures de imagem que é o espaço de fora e aqui no superior a gente vai aumentar para que

essa imagem ela fique em cima da sessão ali Agora sim a gente vai publicar vamos clicar em publicar adicionar condições aparecer em todos os singulares vamos clicar em salvar fechar agora vamos lá testar ou vou clicar aqui nossa equipe vou selecionar um ó Aí todos que eu acessar aqui vai pegar o mesmo padrão que eu criei tá vendo uma outra coisa que a gente pode fazer colocar um arredondamento na imagem aqui não tá aparecendo porque assim mais já é redonda mas nas demais vai aparecer Vamos ir no estilo arredondamento vamos deixar 10 e clicar em

atualizar aí desse jeito a imagem vai ficar arredondada tem uma coisa que a gente tem que mudar também que é esse link que tá feio tá vendo tem ainda que esse ponto PHP para mudar isso é bem simples A gente vem aqui no painel de administrativador de prédios bem configurações links permanentes Vamos mudar para o nome do post e vamos clicar em salvar aí vamos Acessar agora aí se a gente clicar aqui vai estar com o nome certinho ali em cima a gente clicar em algum post aqui embaixo também vai estar com o nome certinho

lá em cima né e agora agora que a gente criou a página de post a gente vai criar a página de blog vou até colocar ela aqui embaixo que a página onde vai ficar armazenado todos os nossos posts se a gente clicar aqui em blog já vai estar aparecendo todos os posts que a gente tem no site só que vai estar assim desconfigurado aí a gente vai configurar com Elementor para ela ficar assim tá aí aqui a gente não consegue editar direto na página a gente vai criar um modelo também igual a gente fez com

a página individual de post Então vamos acessar o painel administrativo do WordPress Vamos ver em modelos Adicionar novo no final eu te ensino a acessar todos esses modelos se você precisar editar de novo tá você vai vir aqui vai selecionar arquivo aí você vai dar um nome para sua página vou dar o nome de blog mesmo página de blog tem que ser do tipo arquivo tá vamos clicar em criar ele já dá alguns modelos aqui para gente se você quiser é só clicar em cima inserir eu vou fechar vou clicar aqui vou clicar em flex

Box vou pegar isso com a setinha para baixo vou virar avançado pede vou colocar 70 de pele vou ver em estilo tipo de fundo vou pegar essa cor salmão vou vir aqui na biblioteca vou pegar um título vou arrastar para cá vou deixar Centralizado e vou colocar nosso blog vou virar estilo tipografia vou diminuir o tamanho OK agora eu vou vir aqui vou pegar um Flex Box duplo vou voltar aqui na página home eu vou pegar esse vídeo aqui de post que já está configurado não vou vir aqui embaixo vou pegar esse vídeo aqui de

post vou copiar vou colar ele aqui dentro Clica com o botão direito colar vou voltar nele vou deixar aqui em duas colunas agora eu vou vir aqui nesse container vou vir na largura dele vou deixar 66,66 e vou vir neste e vou deixar 33,33 que é para esse aqui ficar mais largo aí nesse eu vou virar avançado pede vou colocar 30 de padim nesse eu vou vir aqui vou virar avançado pede eu vou colocar 30 de pet ok agora eu vou vir na biblioteca vou pegar um título arrastar para cá vou escrever categorias vou Vinícius

vou diminuir o tamanho vou deixar ele com peso 600 vou vir aqui embaixo onde tem Wordpress eu vou pegar aqui o widget de categorias ou categorias Esse é do próprio WordPress Aliás já tinha o título aqui então eu vou excluir esse de cima pronto sempre clicando aqui E clicando em salvar agora nós vamos configurar isso daqui nas configurações gerais do tema Então vamos primeiro clicar no olhinho clicar em visitar para a gente ver que tipo de título que é esse aqui clica nele e pressiona ele é um h5 e esses daqui são os links né

então vamos clicar nas três abinhas ali configurações do site tipografia h5 a cor a gente vai pegar essa marrom e a tipografia vamos pegar essa secundários só Vamos aumentar o tamanho dela para 22 Vamos soltar aqui no link acho que vai ser melhor a gente mudar para esse marrom aqui aí ele vai mudar em todas as partes do site que tem o link tá então lá na página individual de posto também vai mudar o link para esse marrom mais claro e vamos ainda tipografia e vamos configurar transformação capitalizar para ficar com a primeira letra das

palavras maiúscula vamos clicar em atualizar aí já podemos fechar agora vamos fazer essa sessão aqui vamos ver na biblioteca básico pegar um título arrasta para cá aí aqui eu vou escrever Onde estamos o estilo tipografia vou deixar vamos pegar essa secundária e aumentar para 22 para ficar igual o título lá de cima e vou aproveitar que eu já tô com a página home aberta vou copiar esses itens que tem aqui vou clicar nele com o botão direito em copiar Clica com o botão direito colar porque com o botão direito copiar com o botão direito colar

com o botão direito copiar e clica com o botão direito colar vai ficar assim agora a gente vai colocar as redes sociais vou clicar aqui clicar em salvar rascunho vou descer editar o rodapé para mim já copiar esse vídeo de redes sociais que está aqui clique em copiar depois vou voltar clicar aqui editar arquivo clicar com o botão direito clicar em colar deixar ele Centralizado não virem estilo ícone vou aumentar o tamanho do ícone vou vir na cor de fundo e vou aumentar vou aumentar a opacidade para ficar um pouco mais visível vou ver aqui

na biblioteca vou pegar um botão passa para cá deixar ele Centralizado vou colocar agendar consulta vou clicar aqui pegar o widget de WhatsApp aí aqui você colocaria o link do WhatsApp tá no estilo tipografia vou aumentar o tamanho vou aumentar o peso para 500 aí eu percebi que eu tinha deixado ali ou vim conteúdo e deixar ele justificado vou vir em estilo em Hover ação de passar o mouse vou deixar grow vai ficar assim e vou mudar para agendar avaliação sempre clicando aqui salvando para não perder nada agora a gente vai vir aqui nesses itens

Vamos ver em estilo ícone Vamos diminuir um pouquinho o tamanho do ícone vamos deixar 40 conteúdo no título Vamos diminuir um pouquinho também vamos deixar também o 15 e no texto da descrição também Vamos diminuir vamos deixar também 14 e também vamos ir avançado diminuir para 15 aí vamos clicar com o botão direito copiar conta direito e colar o estilo nos outros clicando aqui para salvar agora a gente vai clicar aqui clicar com o botão direito clicar aqui clicar em colar vamos clicar aqui risquinho vamos mudar para clássico coluna nós vamos deixar um post por

página Vamos deixar seis imagem vamos deixar aqui ó Poção da imagem vamos deixar nenhum aparecer só o título e o textinho aqui na meta dados vamos tirar comentário vamos deixar apenas data e vamos configurar o tamanho do texto aqui o tamanho do resumo né que o textinho que fica aqui eu vou deixar zero eu quero que apareça só o título e a data aí vamos ver aqui estilo conteúdo tipografia eu vou deixar secundário aqui do título o restante vai ficar como está aqui na Caixa em Rover aqui no na cor do fundo a gente vai

deixar esse gelo que aí na hora que a gente passa mal vai ficar assim aqui no prédio a gente vai deixar 10 Primeiro vamos colocar um arredondamento aqui de 5 largura da borda vamos desvincular Vamos colocar aqui no inferior um e aqui na cor da borda vamos deixar esse salmão aqui temos que mudar aqui no normal também a cor da borda vamos deixar de salmão E aí vai ficar assim só que aí na página visível não vai ficar com esse texto não é o bug do Elementor porque não tá tirando o texto aqui na página

de edição Ou seja a gente clicar aqui na visualizar vai estar aparecendo somente o título que nem a gente configurou vamos vir aqui nestes posts por página Vamos deixar 10 e aqui em consulta isso é muito importante preste atenção se não fizer isso daqui não vai funcionar o blog da forma correta você tem que mudar de posts para consulta atual ok que aí ele vai ficar aparecendo o que a gente pesquisar no Blog agora a gente vai clicar aqui vamos colocar em modo responsivo para a gente configurar vamos vir nessa primeira sessão avançado Vamos colocar

20 de pede vamos ver nesse container avançado Vamos colocar 15 de pede esse aqui já tá configurado aí vamos ir neste container avançado vou colocar 15 de pedem também esses daqui já estão configurados Prontinho agora a gente pode publicar a gente vai clicar aqui em publicar adicionar condições aparecer em todos os arquivos e salvar Agora se a gente acessar a nossa página de blog vai estar aparecendo desse jeito aqui que a gente configurou tá vendo e aí se a gente clicar aqui por exemplo equipe aí ele faz a filtragem apareceu aqui a gente clicar e

especialidade vai aparecer só especialidades E por aí vai ao preenchimento labial parece só de preenchimento labial para isso que serve esse filtrinho que a gente fez tá faltou configurar só uma coisinha que a página ação vamos clicar aqui paginação vamos deixar aqui números para que apareça os números aqui tá vendo aí vamos irem estilo patinação vou configurar só o espaçamento aqui aliás vou configurar a cor também para esse marrom a cor do vou ver para esse Esse salmão e ativo para salmão também pronto atualizar Prontinho vai ficar assim a intenção da gente colocar esses daqui

do lado é para aparecer os posts mais lidos por aqui tem um vídeo aqui no canal ensinando você só a fazer isso a configurar os posts mais lidos aqui na página do blog Tá eu vou deixar esse link aqui para você não vou fazer não para a gente não perder muito tempo beleza já criamos a parte especialidade nossa equipe já criamos um individual de post agora vamos criar sobre nós e contato aí já sabe vamos entrar aqui na página de sobre nós é normal aparecer isso daqui tá porque a gente configurou o nosso blog é

ele fica parecendo assim mas vamos corrigir agora é vamos clicar aqui em cima editar página depois aqui em cima e editar com elemento vamos clicar aqui em configuração layout Vamos mudar para Elementor agora total Pronto já vai ter sumido tá vendo música Quem atualizar vamos clicar aqui clica em flex Box pegar um container com a seta para baixo virem estilo tipo de fundo cor vamos pegar esta vamos vir na biblioteca pegar o título arrastar para cá centralizar vamos escrever sobre nós aqui estilo tipografia Vamos diminuir deixar do mesmo tamanho que ficou os outros Vamos ir

no container avançado 70 de pede aí vamos clicar em atualizar aí a gente vai acessar nossa página home no editor para a gente pegar algumas coisas que já estão prontas por lá vamos deixar ela aqui no cantinho aberta Vamos descer até aqui na sessão de sobre clique aqui com o botão direito copiar Clica com o botão direito colar já vai vir com a minha de nosso espaço né mas eu vou fazer o seguinte vou vir aqui embaixo vou pegar um Flex box com uma seta para baixo vou virar avançado vou colocar em pé de 70

de padim vou pegar esse título aqui de nosso espaço vou copiar vou clicar vou colar ele aqui vou excluir esse daqui vou arrastar essa esse Carrossel Aqui para baixo desse título aqui nosso espaço eu vou mudar para a clínica vou pegar esses cardzinhos vou arrastar Aqui para baixo já clínica ok aqui eu vou mudar para Doutora Anastácia aí no seu caso você muda né para o nome da pessoa vou vir aqui na biblioteca vou arrastar o vídeo de texto para cá para baixo vou vir em estilo cor vou pegar esse marrom mais claro vou vir

aqui na página sobre nós já tem um texto aqui é metade daquele texto da página sabe individual de cada especialista então eu tenho aqui a nossa equipe que é isso a gente clica aqui tem aquele texto de cada equipe que a gente criou né então eu peguei um pouco desse texto Lembrando que eu pedi para o chá de APT gerar e ter só fictícios tá então eu peguei um pouco desse texto eu vou colar ele aqui vou vir em estilo tipografia vou aumentar para 14 vou vir na biblioteca vou arrastar um botão para cá vou

escrever saiba mais saiba mais sobre mim vou colocar o link aqui da dona Anastácia né daquele post vai começar a escrever que ele já aparece ali vou ver no estilo tipografia eu vou pegar essa tipografia de acento o texto vai aumentar um pouquinho mais vou aumentar para 15 ok vou vir aqui vou vir tipografia vou virem transformação vou deixar normal para descapitalizar vou vir aqui na cor vou pegar essa cor gelo vou vir aqui na página homem vou colocar em copiar estilo para ele pegar essa sombrinha que está aí só vou vir conteúdo e deixar

alinhado aqui para esquerda também vou fazer outra coisa vou vir estilo Robert tipo de fundo vou mudar a cor para Esse salmão e quando passar o mouse vai mudar de cor Ok vai ficar assim aí nessa da Clínica eu vou duplicar esse texto arrastar ele aqui para baixo para ficar embaixo da Clínica eu já tenho esse textinho aqui também pedir para o chá de PT gerar para mim para quem não sabe o chá de ept é uma inteligência artificial tá já tem vídeo dela aqui no canal coloquei o texto aqui aí esse eu vou vestir

e deixar centralizado OK aí vou vir aqui na biblioteca vou arrastar um container para cá vou arrastar esses cards para dentro desse contêiner ó perceba aqui tá vendo tem esse quadradinho os cards tem que estar dentro dessa linha cinza que tá aqui dentro aí vou vir nesse contente e vou deixar alinhado para horizontal vou voltar aqui na página homem vou vir no card aqui de nossa equipe A propósito eu tinha esquecido de excluir esse saiba mais aqui ó se você tiver esquecido também clica nele para excluir tá aí eu vou vir em cada um desses

clicar com o botão direito e clicar em colar estilo pronto vai ficar assim vou vir aqui na home pegar um botão deste copiar colar ele aqui vou arrastar o contêiner aqui para cima e vou mudar para com esse nossos especialidades e vou tirar esse ícone ele vai ficar assim aí tem que mudar o link né para página de Especialidades atualizar aí vou duplicar esse texto arrastar ele aqui para baixo aqui ó antes de nosso espaço vou copiar o texto que eu fiz aqui para nossos passos que eu pedi para o chá de PT gerar também

e vou substituir e atualizar vamos clicar em atualizar a página aqui para ver uma coisa ele tá ficando bugado não tá ficando Do mesmo do mesmo tamanho aparentemente Então vamos clicar aqui clicar Xbox mudar para grades aí tá vendo que que eu fiz aumentei para quatro coluna diminui para três aí agora tá do mesmo tamanho e vou diminuir para uma linha agora tá do mesmo tamanho certinho Ok vamos atualizar para o mobile vamos clicar aqui no modo responsivo colocar no celular esse container eu virei avançado vou colocar 20 de padim esse daqui já tá no

tamanho correto só esse botão que eu vou mudar para centralizado aqui também já tá no tamanho Ok vou diminuir um pouquinho vou vir aqui vou virar avançado vou colocar 25 de padding aqui eu vou clicar embaçado vou colocar 25 de padim e pronto terminamos a nossa página de sobre nós agora vamos para a última página a ser configurada que é de contato lembrando pessoal que não tem problema ficar repetitivo os textos daqui e os textos da home porque a nossa intenção em fazer mais páginas nesse modo aqui é colocar bastante texto no site para ficar

bom para o S1 para ficar fácil do Google disparar o seu site para quem tá procurando e também fica mais profissional porque quando você tem várias páginas consegue gerar esse filtrinho aqui no Google tá vendo quando você pesquisa descomplica no sites que é o meu projeto aparece o meu site e as páginas mais acessadas aqui então Isso facilita o acesso do usuário né porque ele já vê aqui sobre nós já vê aqui contato já vem especialidades por exemplo e ele já clica direto no que Ele quer saber então Isso facilita para o usuário também tá

bom então não tem problema se é o mesmo texto ou sem repetitivo que a nossa intenção aqui é fazer com que as pessoas nos encontrem agora vamos para a página de contato né ó vamos acessar o contato aqui clicar em editar página clicar em editar com ele mentor aí vou clicar aqui na engrenagem vou mudar para elementor largura total Vou atualizar nesse daqui a gente já tem uma sessão de contato bem feitinha na home então a gente só vai vir até que quer essa né Vamos ver até aqui vamos pegar esse container Se você não

conseguir pegar clica no navegador ó e vai testando é esse contêiner aqui você pode clicar no olhinho para ter certeza vou colocar com o botão direito copiar vir aqui clicar com o botão direito colar virem avançado vou tirar essa margem e vou vir pede e vou colocar 70 também vou vir aqui na página sobre nós Vou pegar esse primeiro container e copiar já posso fechar vou vir aqui e clicar em colar aí eu vou colocar o título da página sempre bom que tem o título da página aqui em cima é bom também tá vou clicar

em atualizar e pronto já vamos ter aqui como aqui já está configurado a gente só vai precisar acertar o pé de ah não o Pedrinho também ficou legal Então nem precisamos acertar ele para mobile porque ele já tá configuradinho então beleza Já terminamos a nossa página de contato agora a gente vai fazer alguns ajustes está faltando a gente fazer algumas linguagens aqui na nossa página por exemplo aqui nesses botões eu tinha falado para vocês que aqui no link você pode colocar o link do WhatsApp se você não quiser colocar o link do WhatsApp pode colocar

também o link da página de contato que a gente criou Tá mas seria interessante do WhatsApp até porque a gente colocou o ícone do WhatsApp aqui nessas carnezinhos a gente pode linkar para essa sessão aqui onde tem as especialidades aí para isso primeiro a gente vai vir nessa sessão vamos irem avançado vamos vir aqui no vamos escrever especialidade copiar aí vamos vir aqui e vamos fazer uma ncora a gente vai colocar hashtag e White que a gente criou vamos copiar e colocar nos outros atualizar aí dessa forma essa pessoa clica aqui no título do card

ela desce aqui para baixo tá vendo então fica legal a gente fazer essa linguagem para essa pessoa clicar aqui ela vir para cá para ver mais ok aqui na página home não tem mais nada que falte a gente limpar né agora aqui no rodapé ficou faltando a gente linkar as páginas Então a gente vai clicar aqui Ó aqui tá vendo Ah não as páginas a gente já tinha linkado né ficou faltando as especialidades Então você vai vir vai vir em cada um dos links e vai procurar o post que você fez relacionada a cada um

e vai ir limpando tá vendo preenchimento de mandíbula preenchimento labial pronto aqui as redes sociais você também já sabe né que tem que colocar o link aqui OK outra coisa que ficou faltando também eu vou voltar aqui em cima e clicar em editar a página eu também vou vir aqui do lado de fora vou vir em nós vou vir em especialidades e vou abrir o editor dela que ficou faltando a gente limpar os itens das especialidades aqui na nossa página home Então como nessa página que a gente já tinha linkado todas fica mais fácil você

pode clicar aqui com o botão direito copiar aí vem aqui na home desce até aqui na onde que tem as especialidades e a gente pode substituir ó clica aqui no botão direito colar aí ele veio aqui para baixo aí esse daqui que tá sem linkar a gente pode clicar e excluir quem agora todos ficaram links né se você não tinha feito isso aí agora é hora de fazer agora a gente pode colocar também um botão de WhatsApp no site inteiro a gente vai acessar aqui o painel administrativo vamos unir em plugins Adicionar novo vai pesquisar

por Johnny chat tem que ser junto tá E aí é esse login Você vai clicar em instalar depois em ativar ele já te manda para cá você clica em configurações vamos clicar em Ok vamos começar aqui você coloca o número vou colocar um número fictício tá clique em pronto você pode colocar um texto para primeira mensagem ele já dá uma sugestão aqui olá aí aquele puxa o nome do site né que no caso vai ser Anastácia preciso de mais informações sobre aí vai ter o título do site e a URL do site você pode colocar

outra coisa se você quiser você pode excluir por exemplo preciso de mais informações sobre seus serviço sabe clica nele continuar aqui é Um textinho que aparece que depois de um tempo aparece essa caixinha aqui tá vendo a pessoa navegar no site aparece essa caixinha aqui para poder chamar ela né e aqui a mensagem se você deixar padrão ele já pega Olá posso ajudar vou deixar essa e clicar em continuar com este texto aqui eu vou colocar ele não não quero receber dicas aí você pode clicar aqui em ir para configurações ó se você quiser mudar

o número você pode mudar que aqui você define se você quer deixar na esquerda na direita aqui você pode mudar a mensagem né outra mensagem é a cor do botão você pode mudar o cabeçalho se você quer deixar desenvolvido pelo Jones chat ou a logo do WhatsApp eu vou deixar logo do WhatsApp aí você clica aqui em salvar alterações vamos atualizar para a gente ver aqui você tem também como configurar o tempo que você quer que ele apareça depois de quantos segundos por exemplo se você quer que ela apareça depois de dois segundos outra coisa

que a gente tem que perceber é que aqui tá ativo apenas em dispositivos móveis exibir o botão apenas positivo móvel apenas em celular eu vou desativar eu quero que apareça né no desktop é que ele tá aparecendo o WhatsApp web né para você marcar para pessoa abrir no WhatsApp web se ela tiver no computador vou clicar aqui em salvar alterações e vamos recarregar o site Tá vendo Depois de alguns segundos apareceu o botão aqui ele fica flutuando tá vendo que ele apareceu essa mensagem foi aquela que a gente configurou tá vendo aí ele aparece aqui

depois de um tempo se a pessoa não interagir com ele tá ok então vamos dar uma conferida geral aqui na nossa página home tá tudo certinho lembra de linkar os botões página de Especialidades sobre nós nossa equipe blog página individual e contato antes de finalizar eu quero passar alguns avisos aqui para vocês de alguns ajustes que você pode fazer no site para que ele funcione da melhor maneira possível e você tem o resultado que você quer primeiro s ou s ou são configurações que a gente faz no site para que fique fácil do Google ler

as informações dele e mandar para quem está procurando tudo isso aqui que eu vou falar tem vídeo aqui no canal e na descrição desse vídeo vai estar os links Tá bom se você pesquisar na lupinha também você acha mas vai estar tudo aqui na descrição otimização que são configurações que a gente faz para o site carregar bem rapidinho então por exemplo aqui no meu site quando você acessa Ele carrega bem rápido se você troca de página ele troca bem rápido que eu configurei ele para ele ficar rápido eu ensinei isso aqui no canal lgpd que

é lei geral de proteção de dados É obrigatório ter essa configuração em noite quando você acessa o meu aqui por exemplo aparece esse poppepzinho para você aceitar os consentimentos aprender sobre formulário Você viu que aqui na página de contato e lá na página home a gente colocou o formulário E aí tem vídeo aqui no canal te ensinando a usar para onde vai os e-mails é muito importante que você saiba como usar como manusear tá configurar segurança do site também é muito importante para evitar que vocês seja invadido redirecionar o domínio lembra que a gente comprou

um domínio ponto com e um ponto com.br no meu site por exemplo ele está no ponto com.br mas se eu acessar o domínio descomplicado.com ele me redireciona para esse daqui então tem um vídeo só ensinando fazer essa configuração aqui no canal Claro web vai ter que usar uma série de configurações que você faz no seu site para deixar ele tudo OK com todas as métricas perfeitas para o Google divulgar ainda mais ele esse vídeo aqui ferramentas do Google tem várias coisas legais como analítica extraord console o Analytics é uma ferramenta do Google que você consegue

ver Quais pessoas acessaram no seu site quantas pessoas acessaram que tipo de pessoas que são se são mais homens são mulheres Quais são os interesses quanto tempo eles passaram nas páginas para poder te ajudar a bolar uma campanha de marketing Pixel também do Facebook do Google é importante você ter para poder usar impossíveis campanhas que você for fazer depois também paga tá tem esses vídeos aqui no canal e por último me seguir no Instagram porque todos os dias eu posso caixinhas de perguntas lá se você tem dúvida você pode mandar para mim por lá que

eu tô sempre respondendo vocês ok é isso Pessoal, espero muito muito que vocês tenham gostado desse projeto, comenta aqui o que que você achou, se você vai fazer, deixa um like no vídeo, se inscreve no canal, um abraço, até a próxima, tchau.