Como criar uma página de destino usando o Elementor no WordPress? | Jawad Abdani | Skillshare
Pesquisar

Velocidade de reprodução


1.0x


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

Como criar uma página de destino usando o Elementor no WordPress?

teacher avatar Jawad Abdani, Certified WordPress Developer (Top 2%)

Assista a este curso e milhares de outros

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

Assista a este curso e milhares de outros

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

Aulas neste curso

    • 1.

      O que vamos aprender neste curso?

      1:00

    • 2.

      Como configurar um site?

      1:22

    • 3.

      Como configurar o tema do WordPress

      1:52

    • 4.

      Como configurar plugins do WordPress

      1:57

    • 5.

      O que é elementor e como usá-lo?

      7:51

    • 6.

      Como criar uma NOVA PÁGINA

      1:16

    • 7.

      Como desenvolver o CABEÇALHO e o rodapé

      5:39

    • 8.

      Como desenvolver a seção HERÓI/BANNER

      5:41

    • 9.

      Como desenvolver o resto da página de destino

      9:13

    • 10.

      Como adicionar animações à página de destino

      3:38

    • 11.

      O que fazer agora?

      1:18

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

Gerado pela comunidade

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

146

Estudantes

1

Projetos

Sobre este curso

Neste curso, vamos aprender como criar uma página de destino usando o Construtor de páginas de elementos no WordPress. 

Quando você vai anunciar seu site ou produtos, uma landing page é necessária para chamar a atenção dos clientes. Portanto, este vídeo vai ajudar você a aprender como criá-lo sem ter nenhum conhecimento de programação

Neste curso, usaremos o Elementor para criar nossa página de destino. Agora, por que usar o Elementor? 

Bem, há algumas razões: 

  1. Elementor fornece um poderoso editor VISUAL de arrastar e soltar. Significa mais controle sobre seu conteúdo. Para garantir que cada página de destino seja simplesmente perfeita.
  2. Ele também tem um ótimo modelo CANVAS que podemos usar para esconder tudo em uma página do WordPress que vem por padrão. Podemos criar totalmente tudo na landing page usando o ELEMENTOR.
  3. A ELEMENTOR também fornece muitos elementos de marketing que podemos usar para otimizar nossa página de destino. Reduz muitos e muitos plugins de terceiros.

Para mais tutoriais como esse, siga meu perfil na skillshare. 

Conheça seu professor

Teacher Profile Image

Jawad Abdani

Certified WordPress Developer (Top 2%)

Professor

 

Thank you so much for visiting my profile! 

I am a CERTIFIED WordPress developer (Ranked in the Top 2% of WP Developers all over the world) having around 7 years of experience. I am also running a digital agency and proudly serving my clientele all around the globe. 

I'd love to share what I have learned so far in my life, from website development to starting a digital agency.

Follow me on SkillShare to get all the courses I'll post here. 

Thanks! 

Visualizar o perfil completo

Level: All Levels

Nota do curso

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

Por que fazer parte da Skillshare?

Faça cursos premiados Skillshare Original

Cada curso possui aulas curtas e projetos práticos

Sua assinatura apoia os professores da Skillshare

Aprenda em qualquer lugar

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

Transcrições

1. O que vamos aprender neste curso?: Ei pessoal, bem-vindos a este curso de palestras. Agora, se você não me conhece, meu nome é Muhammad em vez de dinheiro e sou um desenvolvedor de WordPress com sete anos de experiência. Também quero uma agência digital e tenho orgulho de servir minha clientela em todo o mundo. Neste breve curso, aprenderemos como criar uma página única. Usaremos o construtor de páginas elementares para criar uma página de destino. Agora, também poderíamos usar outras coisas, mas o propósito de usar o Elementor é que é muito fácil e rápido criar uma landing page usando o Elementor. Com seu belo construtor de páginas de arrastar e soltar, você pode criar facilmente os layouts de que precisa. Você pode ajustar as colunas, as posições das seções, tamanhos das fontes e tudo mais com simples cliques. Portanto, o argumento de venda que criaremos conterá um logotipo clicável, ícones sociais. Isso poderia nos dar um conjunto de ícones no cabeçalho, uma forma cativante com uma chamada à ação clicável. Também criaremos outras seções ao longo da meta. No final, adicionaremos algumas animações interessantes para torná-la mais bonita e atraente. Então, agora espero ver você lá dentro. Vamos mergulhar nisso. 2. Como configurar um site?: Então, parabéns por entrar neste curso. Ao entrar, teremos que ver como começar. Então, aqui está uma pergunta para você. Sim, podemos pular essa parte. Caso contrário, teremos que fazer algumas configurações aqui. Antes de tudo, teremos que configurar um domínio e uma hospedagem. E para isso, definitivamente teremos que comprar um domínio e hospedar as diferentes empresas. Vou recomendar que você compre um domínio e hospedagem, pois você pode considerar o SiteGround, talvez o Bluehost ou talvez o Host Gator. Esses são os poucos nomes. Eu sei que são boas, mas você também pode escolher qualquer outra pergunta, qualquer outro domínio, da maneira que quiser. Então, depois de configurar o domínio e a hospedagem, você precisa instalar um novo CMS do WordPress no novo site que configuramos recentemente, certifique-se de salvar o nome de usuário e a senha. Você configura. Agora, se você quiser ver, se quiser ver como você pode configurar WordPress ou talvez configurar domínio e hospedagem. Você pode ver cursos diferentes de outros cursos da Skillshare. poderá ajudá-lo a configurar o domínio e a hospedagem e instalar um novo CMS do WordPress nele. E quando você terminar de tudo isso, teremos que nos aprofundar e começar a criar nossa página de destino. 3. Como configurar o tema do WordPress: Então, agora que temos a nova instalação do WordPress teremos que configurar os temas e plug-ins. Então, primeiro de tudo, vamos configurar o tema para isso. Você precisará acessar o WordPress como acabamos de instalar. Portanto, este é um WordPress como acabamos de instalar. E agora teremos que ir ao painel para fazer isso. Vamos reescrever o administrador do WP após o URL, e ele nos levará ao painel. A propósito, se você não estiver logado, precisará entrar no seu site antes de mergulhar nesse painel. Então, para a instalação, a equipe passará para a aparência e depois para os temas. O Wordpress vem com algumas instalações, alguns temas padrão que estão pré-instalados. E se você estiver, se você instalou o WordPress usando qualquer hospedagem ou talvez alguns instaladores de software, você também terá alguns temas padrão do WordPress. Então, nesse caso, eu tenho essa equipe de cenários e agora existem coisas diferentes que podemos usar o Elementor. Acredito que a melhor equipe para usar o Elementor é a Hello Elementor porque existem diferentes motivos. Os resultados do Hello Elementary estão quase em branco. O tema está quase em branco e só podemos usá-lo com o Elementor. Então, vou para a aparência e depois para os temas e, em seguida, adicionarei um novo aqui para instalar um tema. E no lado direito, vou digitar Hello Elementor. E aqui vou instalar essa cena. A melhor coisa sobre essa equipe é que ela é muito leve, como mencionei anteriormente. Assim, o plug-in, o plug-in elementar e essa equipe se tornam uma combinação perfeita. Assim que você instalou o tema no próximo vídeo, veremos como podemos instalar o plug-in Elementor e começar. 4. Como configurar plugins para WordPress: Até agora, configuramos o domínio e a hospedagem. Instalamos um novo WordPress, configuramos o tema. Agora é hora de instalar o plug-in Elementor. E, como mencionei, por que estamos usando o Elementor. Existem diferentes razões para usar o Elementor: antes de tudo, ele vem com um editor de UI UX muito bom, para que possamos gerenciar facilmente as colunas, o layout e tudo mais. E a segunda coisa é que é muito rápido e fácil criar páginas de destino usando o Elementor porque ele vem com complementos muito fáceis e diferentes que eles podem usar, como seções e cabeçalhos. O construtor de arrastar e soltar, podemos facilmente alterar cores, texto, fontes, margens e tudo mais. Portanto, existem razões diferentes. Há muitos benefícios em usar o Elementor. Assim, podemos facilmente tornar o Visa de empréstimo entre pares responsivo, mas são ferramentas responsivas bastante fáceis. Então, agora vá em frente e instale o plug-in Elementor em um site. Para isso, teremos que acessar o painel novamente. E aqui está o painel. E agora, desta vez, temos que acessar os plug-ins e você clicar em Adicionar novo aqui. E no lado direito, você procurará o elemento dois. O primeiro resultado exibido aqui é eliminado. O construtor de sites instalará isso. E deixe você obter esse plugin. E essa foi uma etapa simples para instalar o plug-in Elementor aqui Acredito que não precisaremos dos plug-ins para criar a página de empréstimo. Então, continuaremos com esse plug-in, mas talvez mais tarde, se precisarmos de outros plug-ins. Essa é a razão pela qual estamos usando o plugin e como usar um plug-in, certo? Então, agora vamos seguir em frente e começar a criar nossa página de destino no próximo vídeo. 5. O que é Elementor e como usá-lo?: Então, antes de realmente começar a criar uma página em execução, primeiro teremos que ver como usar nossos limitadores para que possamos ver a dica, as quebras e tudo mais. Isso nos facilitará. Facilite a criação de nossa página de aprendizado. Então, vamos começar. Novamente. Eu vou ter que ir para o grande furo. Então, aqui está o painel. E como eles instalaram o tema Hello Elementor e o plug-in elementar. É assim que o painel fica depois. Então, vamos criar nossa página, nossa primeira página, na verdade, com Elementor para ver como ela funciona. No momento, estou criando esta página. Porque depois disso, criaremos nossa página de destino real. Esta é uma página de teste para ver como o Elementor funciona. Vamos publicá-lo no Publish. E agora vamos ver nossa página. E é assim que a página fica no tema padrão Hello Elementor e na página de aplicação no Elementor. Então, para editar isso, teremos que acessar o painel novamente. Para isso. Vamos para o administrador do WP porque eu fecho a página. E aqui, novamente, vou às páginas e clico no botão Editar aqui. E aqui, eu teria que clicar em Editar com Elementor porque o construtor atual que você está vendo atualmente se chama Gutenberg. Neste caso, estamos usando o construtor de páginas Elementor, então clicaremos em editar com o Elementor. Assim, podemos realmente abrir uma página de arrastar e soltar para recrutar ambientes. Então é assim que o construtor de páginas Elementor funciona e se parece. No lado esquerdo, você encontrará diferentes complementos que você pode usar para criar sua página de aprendizado. Aqui estão alguns deles, B6 e depois PRO, emissor, Pro, você também pode usá-los. E no lado direito, você tem uma visão clara da sua página. E aqui você pode clicar, editar as colunas e as colunas aqui clicando no ícone de adição. E aqui você pode, no lado esquerdo, ter incógnitas. Você pode simplesmente arrastar os complementos daqui para o lado direito para usá-los. Por exemplo, se você precisar usar um título, você tem esse título aqui. Basta arrastá-lo para o lado direito e seu título está aqui. Você pode simplesmente editar isso, digamos, ou nosso primeiro título. E não é isso. Você pode mudar completamente a tipografia. Você pode mudar as cores, o tamanho e tudo mais. Para isso, você precisará simplesmente criar essa guia de estilo. E você terá todas as opções que precisará adicionar. Você sabe, você está contratando, por exemplo a cor do texto, você pode alterar seu elemento de texto para quem quiser. E epigrafia, você tem opções diferentes. Você pode selecionar qualquer fonte que desejar ter. Então, vamos deixar essa forma de onda que nunca vemos em nenhum lugar, exceto ele em alguns sites. E aqui também podemos ajustar o tamanho. E temos pesos diferentes. Você pode simplesmente ficar. Os pesos no formulário terão pesos diferentes. Isso mudará o, você pode ver a ousadia e a leveza dessa diversão e transformar. Você pode simplesmente colocar esse texto maiúsculas ou minúsculas ou capitalizar e tudo mais. Você também pode simplesmente mudar o estilo deste. Digamos que se você optou por itálico, você pode usar isso, ter que fazer oblíquo, normal e tudo mais. Você pode simplesmente fazer isso a partir daqui. E então temos a falha na declaração. Podemos simplesmente adicionar uma linha sobreposta subjacente, uma linha a uma ou talvez nenhuma. Em seguida, temos a altura da linha, por exemplo, se tivermos, você sabe, os textos em duas linhas diferentes, podemos ajustar os acertos da linha a partir daqui. Assim. A próxima opção que temos é o espaçamento entre letras. Podemos simplesmente ajustar os isqueiros aqui. E agora temos o espaçamento de palavras, então podemos usá-lo de forma simples, vamos movê-lo de volta para as linhas únicas para que você possa vê-lo corretamente. Você pode ver como o espaçamento funciona aqui. Isso funciona com espaçamento entre palavras e basicamente funciona com letras minhas. Então, essas são todas as opções que você precisará ter. Você também tem mais opções. Os textos são verdadeiros? Você pode adicionar um pouco de água aos seus textos. Mude a cor também. E temos a sombra do texto. Em seguida, temos o modo de mesclagem. Isso é algo que você pode chamar de adicionar. Depois de sabermos o que ele faz, você pode usá-lo, mas talvez possamos pular isso. A indústria sabia que esse era o título. E se quiser usar uma imagem, você pode voltar aos complementos clicando nesses ícones de 9 nós. E vamos ver, teremos que usar a imagem aqui. E eu vou clicar em Nova imagem de demonstração que eu enviei para a Biblioteca de Mídia. Então, a partir daqui, você pode ajustar os tamanhos das imagens. Podemos fazer uma miniatura do Medium ou de qualquer pessoa que você quiser. E aqui temos os alinhamentos da imagem, por exemplo, se você for uma imagem pequena, precisamos alinhá-los à esquerda. Você pode fazer esse centro agora mesmo. E também temos a opção de adicionar legendas. Vamos ver se precisamos adicionar legendas na imagem. Você também pode fazer isso. E temos a opção de adicionar links. Se quiser que a imagem seja clicável, você pode usar esses links para tornar a imagem clicável algum outro link ou em uma página interna do site. E não é isso. Você também pode personalizar a imagem com diferentes opções. Temos o atributo aqui, por exemplo, se precisarmos de uma largura especificada para a imagem, podemos fazer isso. A próxima largura, a altura. Você pode ajustá-lo como quiser. E então o objeto se encaixa, por exemplo, agora você está vendo as imagens se esticarem porque ajustamos a altura. Queremos que a imagem não se estenda. Podemos cobrir, conter ou precisamos que seja esticado. Podemos fazer tudo de novo, certo? Então, aqui está a opacidade da imagem. Filtros Css. Novamente, isso é algo avançado que talvez possamos considerar posteriormente. E então a Tribo da Fronteira dobra as diferentes fronteiras com as quais você definitivamente pode jogar. E então isso é uma caixa de sombra. Se você quiser a sombra na parte de trás deste vídeo, desculpe, imagem. Você também pode fazer isso. Então, sim, essa era uma imagem como essa. Você pode adicionar qualquer elemento que desejar. Existem diferentes elementos, como botões de vídeo, espaçador, divisor aqui, Google Maps, ícones e tudo mais. Vamos ver também como o vídeo funciona aqui. E você pode ver os anos padrão já estabelecidos. Você pode simplesmente colocar o link do seu vídeo do YouTube aqui, ou talvez um link de vídeo que você deseja incorporar e o vídeo será incorporado automaticamente. Você verá como é fácil usar o Elementor para criar as páginas. E talvez você esteja imaginando como podemos ajudar sem o quão rápido e fácil podemos criar nossa página de aprendizado usando o Elementor. Então, no próximo vídeo, vamos descobrir exatamente como podemos usá-lo para criar páginas de destino interessantes. Nos vemos no próximo vídeo. 6. Como criar uma nova página: Agora, teremos que ler uma página para nossa página de aprendizado, onde realmente construiremos as seções e tudo mais. Então, para isso, acessaremos as páginas aqui e adicionaremos uma nova página. Você criará uma página de destino para um novo modelo, um novo modelo de carro. Portanto, planejaremos as coisas adequadamente. Então, para isso, vou escrever aqui ABC. Tudo bem, então clique em Editar com o Elementor. Isso abrirá a página no editor Elementor. Então, primeiro de tudo, você limpará o layout removendo todas essas coisas adicionais. Então, para fazer isso, acessaremos as configurações no canto inferior direito. E iremos para as configurações no lado inferior esquerdo. E selecionaremos o layout da página de tela Elementor. Depois de afirmarmos o elementor canvas, você verá que todas as coisas adicionais foram removidas. 7. Como desenvolver o HEADER e RODAPÉ: Então, agora vamos começar a criar nossa landing page. Em primeiro lugar, adicionaremos nosso cabeçalho e rodapé. Inicialmente. O cabeçalho que precisamos é um cabeçalho de duas colunas. No lado esquerdo, adicionaremos um logotipo e, no lado direito, adicionaremos alguns ícones sociais. Então, clique neste ícone adição e adicione um layout de duas colunas. Na primeira coluna, adicionarei o elemento de imagem aqui para poder adicionar o logotipo. Eu selecionei algumas imagens para usar nesta landing page. Então, pegando todos eles aqui. Selecione essa imagem para o logotipo. Como você vê, parece muito grande. Faremos algumas personalizações. Aqui. Você vai. Dessa vez. Vamos para a guia Estilos e você adicionará um pouco de altura. E, como você pode ver, a imagem está se estendendo. Selecionaremos o ajuste do objeto como capa. Vamos adicionar um pouco de largura máxima, diminuir a altura movida. E agora temos que alinhar essa imagem no lado esquerdo. Então, voltaremos para a guia de conteúdo e selecionaremos esse alinhamento à esquerda. A partir daqui, você vê que o logotipo foi alinhado à esquerda. E no lado direito, adicione alguns ícones sociais. Aqui você encontrará o elemento para os ícones sociais que pegarão esse elemento aqui. E, por padrão, esses três ícones também aparecerão no Instagram. Para que o Instagram também seja adicionado aqui. Agora também precisamos alinhar o ícone social no lado direito. Então, para isso, vamos selecionar isso aqui. Temos que alinhar o logotipo e ícones sociais centrados verticalmente. Então, para isso, entraremos e selecionaremos esta seção a partir daqui, no navegador. E aqui no lado esquerdo você encontrará Vertical. Opção de alinhamento vertical. Basta entrar e selecionar o meio e você verá que o cabeçalho está alinhado corretamente. Vamos adicionar um pouco de fundo claro ao cabeçalho. Para isso, teremos que selecionar a guia de estilo. E aqui vamos selecionar um fundo claro, branco, então o plano de fundo também se aplica aqui. Como você pode ver, um lindo cabeçalho está pronto. Vamos entrar e adicionar um rodapé simples aqui. Para isso. Nós também precisamos, para isso. Novamente, precisa clicar neste ícone de adição. E, inicialmente, precisamos de um rodapé de uma coluna, eu acredito. Então, selecionando essa coluna aqui. E eu vou adicionar algo a uma imagem. Novamente, para adicionar o logotipo para a seção de rodapé. Este logotipo novamente, personalizando-o com a guia de estilo. Usando a alta. Sim, eu acredito que isso é bom. E depois disso, todo mundo veio para cá. Diz escritores. Centralizando o cabeçalho aqui. E selecionaremos uma fonte para. Você selecionará uma fonte para todas as páginas de empréstimo. Então, vou terminar de selecionar a fonte adequada aqui e mudar a cor para preto. Tornando o texto em maiúsculas e reduzindo o tamanho dele. Alterando o conteúdo para ver 2022. Certo? Agora vou adicionar a linha de direitos autorais aqui. Ao adicionar os elementos do editor de texto. Aqui, escreverei a linha de direitos autorais, certo, 2022. Todos os direitos reservados. Mais tarde. Estou apenas adicionando uma linha genérica aqui, alinhando esse centro também. E mudando a fonte para Poppins novamente. Certo? Portanto, nosso rodapé também está pronto. 8. Como desenvolver a seção de HERO/BANNER: Agora, quando temos nossa foto pronta, comece a adicionar as seções médias para nossa página de aprendizado. Para isso, vou entrar e adicionar mais uma sessão clicando neste ícone de adição aqui. E à medida que adicionaremos o banner aqui, você selecionará um layout de coluna única. E vamos mover isso clicando nesse ícone. E vamos colocá-lo no topo da empresa porque, para crédito, será a última seção do site. E agora entre e clique nesta seção. E no lado esquerdo, você verá as opções de detecção. E vamos entrar e selecionar a guia de estilo para adicionar melhor a imagem de fundo. E para isso, vou entrar e selecionar esse ícone clássico e fazer o upload de uma imagem aqui, vou selecionar uma das imagens, uma das poucas imagens que foram enviadas antes. Então, vou selecionar este. Certas mídias e veremos que a imagem foi enviada. Para fazer algumas configurações. Vou mudar o tamanho desta imagem para capa. E vamos definir isso para definir a posição como centro, centro. E daremos uma altura mínima a essa seção clicando nessa guia de layout. Você vê esta seção de altura aqui, selecionaremos a altura mínima e adicionaremos talvez a sétima série, certo? Então, temos uma boa seção aqui, um bom plano de fundo para o nosso banner. Aqui. Você vê que esta coluna está aparecendo aqui. Precisamos de uma coluna no lado direito. Então, para isso, entraremos, selecionaremos a coluna e clicaremos em duplicar. Isso gerará outra coluna que podemos ajustar. Então, no menu mais próximo do centro, você verá que o ícone mudará, o cursor do mouse será alterado e podemos clicar nele e arrastá-lo para o tamanho das duas bordas à direita. Selecione a coluna da direita para 40%. Agora vamos começar a adicionar elementos aqui. Então, eu entrava e selecionava um título. E o nome do título será carro novo lançado, certo? Altere o estilo desse título. A propósito, eu havia selecionado a fonte Poppins e a cor preta para os títulos, certo? Então, vou entrar e clicar na topografia e alteraremos o tamanho dessa fonte. Também aumentará o caminho para 900, talvez. E mudaremos a transformação do texto para maiúsculas. Um tamanho pequeno. E você vê que um bom título está aparecendo. Agora. Vou entrar e adicionar o elemento do editor de texto para adicionar alguns textos aqui. Vamos usar esse texto de espaço reservado por enquanto. Porque você sabe, você pode alterá-lo mais tarde. Eu só vou construí-lo para você. Então, vou estilizar e mudar a cor do texto para gostar de escrever. Hum, eu também vou mudar o tamanho dessa fonte para talvez 18. E agora vou adicionar um botão. Há uma chamada à ação, certo? Então, vou adicionar um elemento de botão aqui e clicar. Saiba mais. Altere o tamanho para médio. E ir até a guia de estilo mudará um pouco a tipografia. Tornando em maiúsculas. Um pouco ousado. Não que eles mereçam cem. Sim, parece bom. E talvez eu remova o raio da fronteira. Acredito que esteja mostrando um pouco do raio da fronteira. Então, quando n é zero. E agora você pode ver que uma bela seção foi projetada para tentar ajustar a imagem de fundo para esta seção, talvez tentemos o centro esquerdo ou o centro direito não faça nenhuma diferença. Portanto, não faça com que seja o centro, centralize novamente. Talvez eu diminua o tamanho da fonte, esse título. E também mudaremos essa coluna. Porque está tocando com o carro, você sabe, não parece bom. Parece bom agora. Portanto, nossa seção de banners também está pronta aqui. 9. Como desenvolver o resto da página de retificação: Entraremos e adicionaremos uma nova seção. Novamente, clique no ícone de adição. E agora precisaremos de uma seção, haverá duas colunas. Então, tomando o layout de duas colunas aqui, novamente, estamos entrando no topo. E agora temos nossa seção aqui. Vou selecionar, vou adicionar uma imagem no lado esquerdo desta coluna. Selecione um dos poucos minutos que fiz o upload antes. Vamos selecionar esse. E agora temos nossa imagem aqui. Vamos adicionar um novo título. Vamos digitar sobre. Talvez deixe isso por aí. E, novamente, estilize os cabeçalhos para 700. O site precisa estar como está. Faça com que seja maiúscula, certo? Vamos renomeá-lo para cerca de PBC. Certo? Vou adicionar mais um elemento aqui, o editor de texto para adicionar alguns textos. Vamos sair daqui. E adicionaremos mais um elemento para o botão. Talvez dupliquemos o botão que usamos para o banner. Para isso, você terá do mouse no botão e clicar em Duplicar e copiar de forma irregular na parte inferior desta sessão. Então, agora temos que alinhar verticalmente o conteúdo desta seção. Para isso, clicaremos nas configurações da coluna clicando nesses seis ícones aqui, fixe Eigen aqui. E vamos fazer com que fique no meio , como fizemos com o cabeçalho. Agora você pode ver que parece bom. Vamos adicionar um preenchimento. Adicionaremos um pouco de preenchimento na parte superior e inferior desta seção. Para isso, novamente, iremos para a guia Estilo. E dois, desculpe, Edwin Step. E vamos adicionar um pouco de preenchimento aqui, talvez 50. Vamos desvinculá-los porque também está adicionando, dependendo do lado esquerdo, remover o lado direito e esquerdo da pintura. Talvez aumente para 70 de cima e 70 de baixo, à direita. Agora você pode ver que uma boa seção foi projetada. Vou apenas duplicar esta seção porque, às vezes, temos alguns valores adicionais para mostrar na página de destino. Então, duplicando esta seção aqui e revertendo-a. Então, agora a imagem estará no lado direito e a descrição estará no lado direito. Vamos mudar a imagem. Estou usando esse, talvez esse por enquanto. Vamos chamar isso de design. E, no entanto, esta seção também está aqui. E vamos adicionar um pouco de fundo a esta seção para torná-la um pouco diferente do Tuckman. Para isso, vou usar esse typedef. Acho que, desculpe, se não a imagem, mas sim para colorir, dando a ela um fundo claro. Talvez. Isso parece bom. E agora que temos as duas seções para as informações, vamos criar mais uma seção onde adicionaremos algumas características para o carro ou talvez qualquer produto que alguém adicione. Então, novamente, adicionando mais uma seção, e aqui na seção de coluna única, arrastando-a até o rodapé e adicionando um título aqui. Vamos digitar. Vamos digitar benefícios. Tudo bem. Centralizar os textos que entram nesse texto vai para a aba de estilo, essa cor. E desta vez eu clico nesse ícone daqui e seleciono a cor de destaque. Mudaremos a cor do texto para branco. Vamos adicionar um pouco de preenchimento. Novamente no LinkedIn, isso vem de cima. De baixo. E abaixo disso, adicionarei mais uma seção. E vamos duplicar essa cor para fazer com que ela seja tuíte e o globo do tweet. E aqui eu adicionarei, clicando neste ícone, adicionarei um título aqui, o manuscrito um. E o terceiro. Vamos mudar o estilo novamente, tornando os seis brancos. tipografia precisa estar em maiúsculas. Os tamanhos das fontes devem ser um pouco pequenos aqui. E o peso da fonte precisa ser uma certa quebra, certo? Adicionando mais um elemento para o editor de texto. E desta vez também altere a cor do texto para branco. E fica ótimo. Duplicando isso. Duplique, arrastando isso para o lado direito. O mesmo acontece com essas unidades genéticas para beneficiar o número dois, o número três. E temos uma sessão aqui. Vamos adicionar um pouco de preenchimento ao topo dessas três colunas. Novamente, ative-os porque configuração depende do correto, isso também. De Baltimore com o anúncio. Então, agora essa sessão também está pronta. Entre e duplique esta seção novamente. Para adicionar o último bloco de informações. Aqui, escreverei talvez informações de chamadas hidratadas. Na parte inferior, será visto porque é uma informação de espaço reservado, certo? Após a administração, notei que o rodapé também coincide com a seção superior. Então, alteraremos a cor de fundo do rodapé e a combinaremos com a cor de fundo do cabeçalho. Então, vamos entrar e ver o que é Macron. F9, F9, F9. E aqui, também vou mudar a cor dessa foto para adicionar um pouco de preenchimento. Desvincule isso e está quase pronto. Agora vamos ver como é a aparência da nossa nova página. Eu abri essa paciente, Anita, e vamos ver como fica. Concluímos uma boa página de destino. E depois discutimos que todo o conteúdo desta página pode ser adicionado facilmente. Então, para isso, você pode simplesmente ir ao editor novamente. E ao criar a página, você pode simplesmente clicar adicioná-la a qualquer blog de conteúdo e poderá editar qualquer coisa nesta página sem ter nenhum conhecimento de programação. Você está no Ben. Sim. Vamos fazer com que seja ousado. Ícone aqui e clique em Atualizar. E agora estou atualizando esta página novamente para ver como ela fica. E sim, isso foi feito dele. Então é assim que você cria UMA página. E no próximo vídeo, discutiremos como você pode adicionar invasão de terras interessante, simpática e empolgante para estudantes. 10. Como adicionar ANIMAÇÕES à PÁGINA de DESENHO: Ei, neste vídeo, veremos como podemos adicionar algumas animações legais e legais a este site, na verdade à página de destino. Então, para isso, iremos ao Elementor novamente. Aqui temos nosso editor aberto. Vamos ver, precisamos adicionar alguma animação a isso, ao cabeçalho. Então, para isso, iremos para a coluna clicando no ícone desta coluna aqui. E na guia avançada, você terá aqui uma aba para efeitos de movimento que seleciona e preenche sua vida. Talvez, porque vou adicionar animações simples aqui. E faremos quatro. Lado direito. Aqui você vê que clicar no ícone da coluna é um pouco difícil porque está escondido atrás das três opções. Então, a Elementor criou o navegador para nós. Vamos abrir o navegador. E aqui temos um algoritmo simples onde podemos usar isso para adicionar colunas. Então, a primeira sessão foi essa. Vamos ler a segunda coluna desta seção e abriremos as configurações para fazermos isso mais uma vez e os efeitos de movimento. E vamos adicionar liberdade, certo? O mesmo faremos com esta seção aqui, clicando no ícone da coluna, efeitos avançados e de movimento. E então eu adicionarei talvez fade in aqui. Vendo que isso será, continue fazendo isso até o fim. Você também pode adicionar outras animações acordo com seus relâmpagos, mas imediatamente. Mas eu gosto das animações simples aqui. Então, vou adicionar esses à terra e sair. E mais uma vez, certo. O mesmo acontece com esse fenil, esquerdo e direito. E aqui eu vou adicionar talvez alguma animação diferente. Digamos que essas sejam seções de três colunas. Vou acrescentar, talvez me encaixe. Sim, parece bom. Desapareça. Em cemitérios. Estamos à esquerda e à direita. E por último, o rodapé. Talvez adicionemos fade in e melhor. Há muitas e muitas animações. Vamos tentar alguns outros. Talvez você possa experimentar esses e tentar enviar seus projetos na seção abaixo Ficarei feliz em vê-los. E outras pessoas que também respondem aos seus projetos. Será, será uma coisa incrível de se praticar. Experimente animações diferentes e veja como você sabe qual delas você gosta. Vou seguir minha animação de falha aqui. Tudo bem, então estou atualizando esse pH depois de adicionar todas as animações aqui. E vamos entrar e testar nosso site novamente. E você verá a animação começar aqui. Com essas animações simples. A página parece um pouco mais bonita e legal. E vai começar a atrair as atrações dos clientes e tudo mais. Portanto, há muitos benefícios diferentes das animações. Você pode tentar, experimentar e ver como funciona para você. 11. O que fazer agora?: À medida que concluímos nosso site ou página de destino. Então é a sua vez agora, vamos criar algumas páginas de destino incríveis e talvez publicar capturas de tela de um projeto na guia de projetos abaixo. E ficarei feliz em vê-los e ficaremos felizes em fornecer feedback adequado. Portanto, você pode começar esperando seu site WordPress, talvez em um host local ou talvez, se tiver um servidor ativo, você possa criar um site de assentos ou talvez um subdomínio temporário. Você pode fazer isso. O cabelo. Você pode fazer isso lá e instalar a equipe do WordPress. A equipe usada neste cavalo foi a Hello Elementor. O plug-in que usamos foi o Elementor. Assim, você pode instalar o tema e plug-in e começar a twittar a página de empréstimo. Como você sabe. Você também pode tentar mudar algumas cores, mudar as imagens, encadear animações e tentar criar algo diferente, certo, para praticar o movimento das coisas. Então, obrigado por assistir a este curso. Ficarei empolgado em ver os projetos que você publicará. Você também se certifica de seguir meu perfil do Skillshare postar vídeos mais detalhados, wordpress. Portanto, não se esqueça de seguir o perfil do Skillshare. Você receberá todas as atualizações que estão relatando neste perfil. Obrigada Cuide-se. Tchau