Crie um site de marca profissional com uma chamada para ação clara | David Utke | Skillshare

Velocidade de reprodução


1.0x


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

Crie um site de marca profissional com uma chamada para ação clara

teacher avatar David Utke, Web Pro and YouTuber

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.

      1. Introdução

      0:55

    • 2.

      2. Visão geral do site

      1:00

    • 3.

      3. Nomes de domínio

      1:55

    • 4.

      4. Hospedagem na web

      2:17

    • 5.

      5. Configuração do site

      6:48

    • 6.

      6. Visão geral do Wordpress

      6:17

    • 7.

      7. Usando o Editor de Site Completo

      4:38

    • 8.

      8. Configuração da página inicial

      2:47

    • 9.

      9. Crie uma chamada para ação

      7:23

    • 10.

      10. Personalizando a chamada para ação

      1:29

    • 11.

      11. Finalizando a seção de chamada para ação

      8:05

    • 12.

      12. Crie um elemento de venda

      5:30

    • 13.

      13. Crie um CTA no meio da página

      4:00

    • 14.

      14. Design de cópia de vendas

      10:08

    • 15.

      15. Adicionando uma seção de perguntas frequentes e depoimentos

      6:01

    • 16.

      16. Adicionando postagens de blog à página inicial

      2:40

    • 17.

      17. CTA final

      6:18

    • 18.

      18. Crie e adicione um logotipo

      2:30

    • 19.

      19. Design de menu

      8:35

    • 20.

      20. Cor de fundo do cabeçalho

      2:59

    • 21.

      21. Design de rodapé

      5:48

    • 22.

      22. Design de página de blog

      5:00

    • 23.

      23. Design de barra lateral

      5:06

    • 24.

      24. Design de post único

      10:01

    • 25.

      25. Favicon

      3:05

    • 26.

      26. SEO

      4:16

    • 27.

      27. Toques finais

      5:00

    • 28.

      Valeu!

      0:19

  • --
  • 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.

20

Estudantes

--

Projeto

Sobre este curso

Aprenda como criar um site profissional e de marca que tenha um chamado à ação claro na página inicial usando o WordPress e um host da web altamente recomendado para o WordPress, o Hostinger. Neste curso abrangente, cubro todos os elementos essenciais que você precisa para criar um site competente que tenha um forte apelo à ação na página inicial, bem como recursos adicionais como um blog para fins de marketing de conteúdo.

Vamos usar o tema Twenty Twenty Four, um tema gratuito que permite a integração com plugins de criação de páginas para que você possa projetar de forma rápida e fácil um site auto-hospedado de alta conversão. O tema Twenty Twenty Four permite que você crie uma página inicial personalizada, postagens de blog, bem como desenhar diferentes aspectos de seus sites, como o cabeçalho e o rodapé.

Nesta etapa 1 do curso, vamos cobrir o seguinte:

  • Obtenha um nome de domínio de um registrador de nomes de domínio, Namecheap.
  • Como obter uma conta de hospedagem compartilhada na Hostinger.
  • Como instalar corretamente o WordPress.
  • Um tutorial de design completo sobre como fazer um site impressionante.
  • Configurações de backend profissional, permalink e dicas de segurança.
  • Como blogar, fundamentos da experiência do usuário e muito mais.

O tema Twenty Twenty Four e o WordPress fazem uma excelente combinação para criar um site eficaz que é perfeito para construir uma marca pessoal. Este curso é um curso completo sobre como criar um site e blog profissional em seu próprio host auto-hospedado.

Conheça seu professor

Teacher Profile Image

David Utke

Web Pro and YouTuber

Professor

Hi there,

My name is David and I'm professional blogger, web designer and a highly rated user experience consultant.

Starting in 2009, I first began learning web development and WordPress for my own online projects and now translate technical skills in an easy to understand way for beginners with my helpful courses.

Currently, I live abroad, travel, and I run my online business from cafes and workspaces. If you would like to find out more, follow my Skillshare profile and drop a message/email with any questions. I'm here to help.

Visualizar o perfil completo

Level: Beginner

Nota do curso

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

Por que fazer parte da Skillshare?

Faça cursos premiados Skillshare Original

Cada curso possui aulas curtas e projetos práticos

Sua assinatura apoia os professores da Skillshare

Aprenda em qualquer lugar

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

Transcrições

1. 1. Introdução: Bem-vindo ao meu curso de compartilhamento de habilidades, meu nome é David, e vou orientá-lo no passo um a passo, como criar um site profissional de alta conversão muito bonito no Blog usando o tema 2024 do Neste curso, abordarei tudo o que você precisa saber. Isso significa que vou mostrar como obter um nome de domínio, em um registro de nome de domínio, como obter uma conta de hospedagem na web, como instalar o WordPress e, em seguida, como criar seu site no Blog com o 2024 principais recursos desse design são focar em uma página inicial de alta conversão com um claro apelo à ação que direciona o visitante final a um ímã da web que ajuda a aumentar sua lista de e-mails para que você possa vender produtos Mostre também como criar várias páginas para seu site, como blogar com esse tema, como editar o cabeçalho, o rodapé e todos os outros pequenos elementos de design que você precisa conhecer Então, se você está procurando criar um site e blog profissional de alta conversão muito bonito com um claro apelo à ação, este curso é para você Se você está pronto para começar, vamos começar. 2. Visão geral de 2 sites: O site, eu vou te mostrar como fazer. Portanto, o objetivo não é ensinar você a criar esse site exato. É apenas para mostrar como editar e ajustar diferentes aspectos do site para que você possa obter um resultado semelhante. Especificamente, como criar uma seção de ofertas no topo do seu site com uma bela tag de título H one, um belo botão grande um pouco de animação associada a ele, um vídeo de vendas ali, vendendo Oma para ajudar as pessoas por que elas querem aproveitar a oferta gratuita. Como adicionar uma cópia de vendas adicional ao design do seu site, adicionar uma postagem no blog, uma chamada à ação final, como editar e ajustar o rodapé, como adicionar links internos e externos, como ajustar esse menu na parte superior, adicionar um botão, criar um logotipo, adicionar um favicon e ajustar as páginas de postagem do seu blog, bem como sua postagem individual no blog, todos esses pequenos detalhes preciso saber para criar um site muito eficaz e de alta conversão com esse tema gratuito De qualquer forma, vamos começar. 3. 3 nome de domínio: Para o meu laptop. Vamos começar. Portanto, o primeiro passo para criar um site com o tema 2024 do WordPress é registrar um nome de domínio Embora você possa obter um nome de domínio em um host da web, recomendo fortemente o uso um registro de nome de domínio dedicado. Você obterá preços melhores, para quem está protegido e taxas de renovação mais baixas. Agora, eu pessoalmente uso e recomendo o Namecheap. Agora, começar a usar o Namecheap é muito simples. Tudo o que você precisa fazer é digitar o nome de domínio que deseja registrar nesta caixa e clicar em Pesquisar. Ok, então depois de inserir seu nome de domínio, vamos clicar neste botão vermelho grande Fantástico. Portanto, o nome de domínio aparecerá, esteja ou não disponível para registro. Agora, se não estiver disponível para registro, isso significa que você precisa vir aqui e descobrir uma combinação de palavras diferente. Agora, eu definitivamente sugiro comprar domínio.com se este for seu primeiro site. Mas se o seu nome de domínio estiver disponível, basta clicar no botão adicionar dois cartões. Agora, você pode ignorar todas essas vendas adicionais aqui e, em seguida, basta clicar no botão Checkout E é realmente muito simples. Agora estamos na página de checkout, então temos nosso registro de nome de domínio Agora, o que é legal sobre um registro de nome de domínio é que você pode registrar seu nome de domínio por até dez anos por um preço baixo, você recebe gratuitamente a proteção dele. Portanto, nossa proteção é muito importante porque, ao registrar seu nome de domínio, você precisa fornecer informações precisas sobre quem você é, como seu nome, e-mail, endereço, número de telefone, informações confidenciais e, portanto, DomAndamePrivacy apenas mantém todas essas informações privadas, então você definitivamente deseja que então você definitivamente deseja Agora, você vai querer clicar em Confirmar pedido quando estiver pronto para registrar seu nome de domínio e precisará criar uma conta no Namecheap e adicionar todas as informações adicionais , como seu nome, e-mail, número de telefone e assim por diante, além de criar uma conta no informações adicionais , como seu nome, e-mail, número de telefone e assim por diante, além de criar uma conta Então, quando você estiver pronto para continuar, clique em Confirmar pedido. 4. 4 hospedagem: É hora de conseguir hospedagem. Portanto, você precisa um host para ter um site. E neste tutorial, eu vou usar o Hostinger Agora, eu realmente gosto de hospedar aqui porque eles são muito econômicos e amigáveis para iniciantes, além de serem ideais Se você está apenas começando, precisa de um plano básico de hospedagem na web de qualidade. Além disso, eles também são recomendados pelo Wordpress aqui. Portanto, eles são um host de qualidade com um ótimo preço. Agora você pode clicar aqui para reivindicar a oferta, mas vamos clicar aqui para hospedagem. Queremos hospedagem na web, ok? E então esta é a página de hospedagem na web aqui. Vamos rolar um pouco para baixo. Você tem alguns planos diferentes, negócios premium, startup na nuvem. Pessoalmente, gosto do plano de negócios. Qual é a principal diferença entre esses dois? Bem, você recebe 100.000 visitas mensais aqui e recebe uma CDN gratuita Portanto, o CDN ajuda a acelerar seu site. Então, isso é muito útil. Mas o plano premium está bom. Se você optar pelo plano premium e quiser fazer o upgrade para o plano empresarial, você pode fazer isso. Mas a diferença de preço é tão pequena que eu provavelmente escolheria o plano de negócios. Então, basta clicar neste plano Escolher. E, finalmente, tudo o que você precisa fazer é concluir seu pedido. Portanto, não vou insultar sua inteligência e mostrar como pagar por algo online Apenas algumas coisas importantes às quais você deve prestar atenção já que está nesta página. Agora, você recebe uma garantia de devolução do dinheiro em 30 dias. E aqui embaixo, com a hospedagem empresarial na web, você tem o período de tempo. Então você tem 48 meses, você pode mudar isso para 12, 24, 48 ou um mês. Pessoalmente, vou ano após ano. Você pode decidir se isso é para você ou não. Você obtém um nome de domínio gratuito se comprar hospedagem na web por um ano ou mais. Agora, o problema com o nome de domínio gratuito é que ele é gratuito no primeiro ano, mas depois disso, você tem que pagar as taxas de renovação, é por isso que eu gosto do Name jeep porque Namecheap tem taxas de renovação mais baixas e você pode registrar um nome de domínio até dez anos Pessoalmente, é por isso que gosto de manter meus serviços separados. De qualquer forma, está aqui embaixo. Você pode criar suas contas. Você pode selecionar sua opção de pagamento e , em seguida, navegar até aqui com um código de cupom, e podemos usar a web P. Clique em Aplicar, e isso também economizará dinheiro. E então, quando estiver pronto para comprar, clique aqui para enviar um pagamento seguro e pronto. 5. 5 configuração de sites: Bem-vindo ao HostingR Então, agora é hora de instalar o WordPress Então, depois de se inscrever na Hostinger e passar pelo processo de integração, você cria sua conta recebe vários e-mails E é assim que o painel se parece inicialmente. Então, você terá suas ações de conta e poderá configurar sua hospedagem. Então, vamos começar. Então, eu tenho minha postagem comercial na web aqui. Vamos continuar e clicar em Configuração. E isso o direcionará para um processo de integração. Então clique aqui para eu criar um site e, em seguida, clique em Avançar. Agora, esse processo de integração é muito útil se você não tiver nenhum tipo de vídeo tutorial, mas como você tem esse vídeo, vamos clicar em Ignorar E então vamos usar um site que já possuímos. Está bem? Então, registramos nosso nome de domínio na Namecheap. Então, o que você tem que fazer? Você tem que inserir seu nome de domínio aqui. Então, deixe-me navegar até o Namecheap. Este é o nome de domínio que vou usar voghow.com Então, deixe-me digitar isso em voghow.com. E aparecerá abaixo que isso já foi registrado em outro provedor Agora, novamente, como você se inscreveu uma conta de hospedagem de um ano ou mais, você recebe um nome de domínio gratuito no primeiro ano. Então, se você quiser tirar proveito disso, pode fazer isso aqui, mas eu já registrei esse nome de domínio na Namecheap, então vou clicar nele Ao usar um nome de domínio, registre-se em outro lugar, você precisa conectá-lo manualmente ao seu site. Não tem problema. Eu vou te mostrar como fazer isso. Demora um minuto. Não é nada complicado. De qualquer forma, basta clicar em Avançar. Mas agora podemos selecionar onde queremos que nosso data center esteja. Então, você quer escolher o data center mais próximo de onde está seu tráfego. Então, eu vou clicar aqui para Massachusetts, e vamos clicar em Avançar E está inicializando a configuração. Fantástico. Portanto, este é o nosso painel para o hostinger Então, primeiro, aqui em cima, diz o status do domínio, não apontando para nossos servidores de nomes. Vamos clicar em como corrigir isso. Vamos clicar em Vamos começar ou qualquer outra coisa. E aqui estão os servidores de nomes da Hostinger. Então, precisamos pegar esses servidores de nomes e inseri-los no Namecheap Então, de qualquer forma, faça login em suas contas baratas. Acesse o nome de domínio que você deseja gerenciar. Então, aqui está o nome de domínio lockow.com. Clique em gerenciar. Em seguida, ele o levará para esta página aqui. Agora, você precisa navegar até aqui , Namecheap, Clique na pequena lista suspensa. Clique em DNS personalizado. Agora temos o servidor de nomes um e o servidor de nomes dois. Onde obtemos essa informação? Aqui mesmo. Simples assim. Copie e cole isso. Estrondo. E pegue esse. E coloque isso aí mesmo. E é um, e são dois. Certifique-se de clicar nessa pequena marca de seleção verde ali mesmo. E fantástico. Portanto, diz que os servidores DNAT podem levar até 48 horas para entrarem em vigor Então, isso é chamado de propagação. Nunca vi isso demorar tanto. Leva cerca de 10 minutos, talvez um dia para se propagar com cada servidor de nomes em todo o mundo, mas em alguns minutos, ele estará vinculado corretamente De qualquer forma, deixe-me afastar X disso. É tão simples quanto isso. Isso é tudo que você precisa fazer. Apenas espere. Não é grande coisa. Você pode continuar instalando seu site. Vamos em frente e instale o WordPress. Então, acabamos de configurar nossos servidores de nomes para conectar nosso nome de domínio na Namecheb à nossa conta de hospedagem aqui E agora podemos simplesmente instalar o WordPress. Então, passaram apenas alguns minutos e aquele pequeno banner já sumiu, simples assim. Tudo bem, então vamos clicar aqui no botão Auto Installer ali mesmo, e ele aparecerá com algumas opções diferentes. Temos Juma, WooCommerce, Wordpress, queremos o Wordpress aqui, então vá em frente e clique em Selecionar E depois é só instalar o WordPress no nome do domínio. Então, o título do site. Então, vou chamar esse vlog de H e vou mudar isso aqui E chamaremos isso, na verdade, eu chamarei aquele vlog, um, dois, três, e depois criarei uma senha E aí está. Agora, clique em. Quando estiver tudo pronto, tudo estará bem. Clique em Avançar. Você também pode abrir o Advance se quiser ver aqui o caminho de instalação. Então, se você quiser entrar, desculpe, se você quiser instalar isso no subdiretório Para a maioria das pessoas, isso não é obrigatório. Então, um subdiretório seria como, eu quero instalar isso apenas no slash Blog e, em seguida, talvez usar o Juma para o.com, o nome Por que isso está subavançado. A maioria das pessoas não quer fazer isso. Você deseja instalar o WordPress em todo o nome de domínio. Portanto, mantenha as coisas simples assim. Insira o nome de usuário, a senha, o e-mail e o título do site. Em seguida, clique em Avançar. E aqui, temos a versão do aplicativo, o idioma, o espaço, todas essas coisas boas. Basta manter tudo como está e clicar em Instalar. Feito. É tão simples quanto isso. Demora um minuto. Então, o Wordpress foi instalado e, para acessar seu site, você pode clicar aqui para acessar o painel de administração, que abrirá em uma nova guia. E lá vamos nós. É tão simples quanto isso. A hospedagem torna incrivelmente fácil instalar o WordPress. Então, estamos prontos para ir. É literalmente isso. Assim, você pode acessar seu site de algumas maneiras diferentes. Você pode fazer login em sua hospedagem ou contas, navegar até o painel e clicar no painel do administrador. Pessoalmente, eu recomendaria apenas entrar diretamente no seu site, então vou mostrar como fazer isso. Então, já que você está aqui, certifique-se de que está tudo bem. Como se o certificado SSL estivesse ativo e funcionando. Se não estiver, clique nas pontas para reinstalá-lo e verificar se está tudo bem Se você tiver algum problema, pode sempre clicar aqui para suporte do chatbot para hospedagem e entrar em contato com o suporte De qualquer forma, então este é o seu site. Então, deixe-me ir em frente e sair . Eu sei, acabamos de entrar Deixe-me sair. Tudo bem Então, como você acessa essa seção do painel aqui? É muito simples acessar seu nome de domínio, então o meu é blockout.com Então é WP Admin. Abra isso, e é isso aqui. Como você faz login com o nome do seu ano ou e-mail que você acabou de criar e a senha que você acabou de criar. Então, deixe-me ir em frente e fazer isso. Ok. E deixe-me ir em frente e clicar no botão Login. E aí está. Portanto, é tão simples quanto isso fazer login no seu site conforme necessário. É por isso que eu recomendo acessar seu site em vez de fazer login na sua conta de hospedagem. A maioria das pessoas não faz isso. A maioria das pessoas acessa o WP Admin e faz login diretamente no site De qualquer forma, é assim que você instala o Wordpress com o Hostinger. 6. 6 visão geral do wordpress: Para WordPress. Temos algumas coisas a fazer para limpar o Wordpress no back-end antes de começarmos a criar nosso site. Então, vamos começar. Clicamos em Dispensar aqui. A primeira coisa que queremos fazer é excluir alguns plug-ins diferentes que vêm instalados com nossa hospedagem de nossa conta. Agora, isso é totalmente opcional para você, mas eu gosto de manter tudo bem limpo. Portanto, temos ferramentas de hospedagem de IA e integração. Vou prosseguir e desativar tudo isso. Clicamos em Inscrever-se aqui. Nós vamos. E então você pode clicar em Excluir se quiser removê-lo. Também vou desativar o cache de velocidade da luz porque um plug-in de cache é essencial para criar seu site e ajuda a acelerá-lo porque fornece uma versão em cache ao visitante final Mas, como estamos projetando o site e fazendo muitas alterações, não queremos que nosso site seja armazenado em cache enquanto o projetamos Então, você só quer desativar isso e, quando seu site estiver completamente pronto, você estará pronto para começar e, em seguida, deseja reativá-lo Deixe-me clicar aqui para desativar isso. Agora, vamos adicionar um novo plug-in aqui e eu vou digitar Rank Math Rank Math é meu plugin de SEO favorito. Apenas lhe dá controle sobre os títulos de SEO, meta descrição, os redirecionamentos três em um um monte de pequenas coisas úteis Então, deixe-me clicar em Instalar aqui e, em seguida, clicaremos em Ativar. E isso nos direcionará para um processo de integração aqui Se você quiser passar por isso, você pode, mas vou clicar aqui para pular agora para que eu possa voltar ao painel, e vamos clicar lá embaixo para retornar ao painel E aí está. Então, se você quiser voltar para essa página, você fica tipo, Oh, David, como faço para obter o Assistente de Configuração. Está bem? Então, tudo o que você precisa fazer é clicar aqui para acessar o Assistente de Configuração, e isso o direcionará de volta ao processo de integração Tudo bem. De qualquer forma, a próxima coisa que queremos conferir aqui são os usuários Então, aqui está seu nome de usuário e e-mail que você tem vinculado a tudo, e aqui está a função. Portanto, você deve ter uma função de administrador. Você notará que eu tenho uma pequena foto minha ao lado desta aqui. Como isso funciona? É de um serviço chamado Gravitar. Então você pode simplesmente assiná-lo no Gravitar, é de uso gratuito. Em seguida, você anexa um e-mail e uma foto juntos. Portanto, uma foto sempre aparece com o e-mail associado. Então é assim que isso está sendo povoado ali mesmo. E quando estiver na sua conta de usuário, é aqui que você pode alterar as senhas e adicionar uma boa descrição. Portanto, URLs de perfil adicionais, informações biográficas. Então, esta é aquela pequena seção que você vê em um blog onde você vê David gosta de longas caminhadas na praia, esse tipo de coisa. Você colocou isso aqui. Depois, você também pode gerar uma nova senha lá embaixo. E então temos o rank Math instalado. Agora podemos mudar a aparência do trecho para o autor Então, o autor é o título do autor ali mesmo. É por isso que eu gosto de matemática hierárquica. Mas de qualquer forma, é isso que você faz com as configurações aqui Então, deixe-me sair disso. E vamos adicionar um novo usuário apenas para mostrar as diferentes funções que você pode criar. Então, aqui, você tem funções diferentes, você tem assinante, colaborador, autor, editor, administrador Isso é útil quando você atrai escritores e outras pessoas apenas para publicar conteúdo em seu site. Você não quer dar acesso de administrador às pessoas. Normalmente, você deseja adicionar um autor ou editor porque eles têm acesso diferente ao site. Assim como um editor pode editar todos os conteúdos do autor. O autor só pode editar seu próprio conteúdo. Portanto, você pode pesquisar isso sozinho, mas é por isso que gostaria de ter funções diferentes. Se o seu site crescer, você quer atrair mais pessoas. Tipo de coisa. Tudo bem, então, de qualquer forma, vamos clicar aqui para ver as configurações Sim, não quero sair desta página agora. Tudo bem, então aqui está o título do site e o slogan Isso não é realmente tão importante. Então você pode simplesmente deixar como está. O ícone do site é o Fabcon. Então você pode clicar em escolher um ícone de site e esse é esse pequeno favicon ali mesmo Então, aqui, você tem o URL do WordPress, endereço do site e está pronto para começar. É isso mesmo aqui. Agora vamos clicar em leitura. E aqui, ao ler, sua postagem no blog mostra a maioria das postagens às vezes, feed de distribuição mostra isso Então, você só quer manter tudo conforme necessário aqui e escrever apenas coisas básicas ali. Nada realmente a mencionar. Deixe-me clicar aqui. Agora, está tudo bem por aqui. Você tem configurações de discussão se quiser ativar os comentários em seu site. Mas o mais importante aqui é o permink ao qual você deve prestar atenção Agora, por padrão, o Wordpress agora tem postname como estrutura de URL padrão, e isso é aceitável Então, será website.com slash POS Title. Pessoalmente, gosto bastante. Outra estrutura que eu gosto seria adicionar na categoria, se você quiser. Então, eu não teria a primeira categoria. Vamos pegar isso e colocar isso aí mesmo. Então você pode ter categoria. Aí está. Categoria, nome do post, se você quiser. Mas eu mesmo uso o nome do post. Mas se você tem um site muito grande e vai ter categorias e subcategorias específicas , essa estrutura de URL é bastante útil Mas para 99% das pessoas, nome da postagem é tudo que você precisa, então mantenha tudo como está aqui. Mas se você quiser mudar a estrutura da URL, é aqui que você faz isso, mas eu definitivamente sugiro escolher uma estrutura de URL e ficar com ela. Não mude isso mais tarde. Tudo bem, então, de qualquer forma, essa é apenas a visão geral básica do que você precisa saber com o WordPress. Agora, queremos navegar até aqui até a aparência e os temas Agora você quer que o tema 2024 seja ativado. Você tem o tema 2023, 2022 aqui. Então, você só quer ter certeza de que esse tema é o que está ativo. Você também pode excluir esses temas, se quiser. Posso clicar aqui e clicar em Excluir. Vamos clicar em OK, depois clicar aqui, clicar em Excluir e, em seguida, clicar em OK E então temos apenas o tema 2024. Agora estamos prontos para criar nosso site. 7. 7 editor de site completo: Vamos começar a criar nosso site com o tema 2024 do WordPress Primeiro, vamos dar uma olhada em nosso site. Clique aqui onde está o logotipo. Clique em Visitar o site. Estrondo. Eles deveriam abrir aqui mesmo. Agora, por padrão, essa é uma página inicial muito boa. Gosto muito, mas vamos criar uma página inicial do zero, não se preocupe, mas deixe-me mostrar como isso funciona Depois de abrir, você pode clicar aqui para editar o site e começar a criar a página inicial e todos os elementos de design que você vê à sua frente Se você quiser apenas abrir o editor diretamente, navegue até aqui até a aparência. Em seguida, você clica em Editor. Lá vamos nós. Vamos esperar que isso passe despercebido. E sim, ok, agora o site está carregando. Então, aqui, temos algumas opções diferentes. Então você tem sua navegação. Sua navegação é esse elemento ali mesmo. Portanto, diz que a lista de páginas não pode recuperar páginas. Isso porque ainda não há páginas. Então não se preocupe. Mas quando você publica uma página como sobre contato, etc., ela será preenchida automaticamente no topo, e veremos como editar essa seção principal posteriormente Você tem seus estilos aí. Então, por padrão, ele vem com várias paletas diferentes nas quais você pode simplesmente clicar e alterar as E, claro, você pode personalizar tudo sozinho, as cores que quiser e a opção de fonte que desejar. Aqui estão suas páginas. Portanto, publique os rascunhos do cronograma pendentes. E então temos nossos modelos ali mesmo. Assim, você pode ver todos os modelos incorporados neste site que você pode aproveitar. É muito bom por lá. Em seguida, padrões ali mesmo. E os padrões são simplesmente seções de blocos que você pode simplesmente adicionar ao site com o clique de um botão. Então você vê que está tudo trancado. Isso porque você não pode ajustá-lo, mas pode adicionar essas seções ou padrões, quiser chamá-los na página específica que está editando. Então você realmente não quer editá-lo a partir daqui. De qualquer forma, em termos gerais, é assim que esse elemento aqui Então, agora podemos clicar no site ali mesmo, e temos algumas coisas diferentes. Então, vamos clicar nesse aqui mesmo. Veja como é um bloco. Então, isso é chamado de editor de blocos. Agora, algumas coisas que você precisa saber ao usar o editor de blocos é clicar nele, agora estou editando este bloco. Agora, se eu quiser editar um bloco diferente, basta clicar nele. É simples assim. E então você quer ter certeza de que tem algumas opções diferentes aqui no topo, você tem Salvar. Você tem suas configurações, então você tem seus estilos. Os estilos são globais. Isso muda tudo no site. E então esse elemento ali faz a mesma coisa que a outra seção, onde você pode alterar automaticamente o estilo lá. Na maioria das vezes, você vai querer estar aqui em suas configurações e depois no bloco e depois ajustar o bloco específico Agora, quando você tiver um bloco, clicaremos neste. Portanto, um compromisso com a inovação e a sustentabilidade. Tudo bem, então temos estilos, temos o padrão. E com o Asterisk, esse é apenas um aspecto exclusivo desse tema, então vamos mantê-lo como padrão E aqui, eu posso mudar a cor do texto e o fundo da cor. Para o texto, se eu quiser, tipografia aqui, temos tamanhos diferentes com os quais podemos brincar Se você quiser ter um controle um pouco mais granular, basta clicar aqui e abrir conforme necessário Então as dimensões estão aqui, então você tem margens de preenchimento Então, preenchimento e margens, você pode torná-lo amplo ou mais estreito, se quiser. Avançado, você pode configurar um link âncora em HTML Então, um link âncora, ou seja, se você quiser ter um item de menu aqui em cima , diremos recursos O usuário clica nos recursos e, em seguida, eles são arrastados para uma seção específica da página e não para uma página separada Isso é tudo o que um link âncora é. Mas, na maioria das vezes, você clicará em um bloco e se afastará dele. Então, vamos clicar nessa configuração. Em seguida, você usará o bloco e, em seguida, apenas alterará o texto, a tipografia de fundo E com o tema 2024 tem esse recurso Asterk. Então, quando você está projetando elementos diferentes , você fica tipo, aqui, tipo, como faço para me livrar disso? Tipo, eu quero me livrar do Asterik. Não posso simplesmente clicar e desligá-lo assim por padrão com o Asterk. É assim que funciona. Mas, novamente, como eu disse, vamos criar uma página inicial personalizada, mas estou apenas dando uma visão geral ampla sobre como esse processo de visão geral ampla sobre como design funciona. E então aí está. Então, clique no W e depois navegue volta ao painel do Editor. E é realmente muito simples. Então, vamos começar a criar nossa página inicial. 8. 8 configuração da página inicial: Vamos criar uma página inicial dedicada para nosso site Então, para começar, é muito fácil. Tudo o que você precisa fazer é navegar pelas páginas. E então, quando isso abrir, clique em Adicionar novo. Agora, vamos criar uma página e depois defini-la como página inicial, então não importa realmente o título que você dá a ela Não sei por que isso está aparecendo. De qualquer forma, basta adicionar um título. Então, vou chamar essa página inicial. Mantenha as coisas simples. Vamos continuar e clicar em Publicar. Clique em Publicar. E simples assim. Agora vamos clicar em W e voltar ao nosso painel do Wordpress, e queremos navegar até aqui até as configurações. Em seguida, queremos navegar até a leitura. Sua página inicial exibe sua última postagem ou uma página estática. Queremos clicar na página estática. E para a página inicial, queremos selecionar a página inicial ou o que quer que você faça com o título da página, não importa De qualquer forma, deixe-me clicar em Salvar alterações. E lá vamos nós. Então, vamos dar uma olhada no site, então eu vou clicar no logotipo. Abra isso em uma nova guia e pronto. Los r. Parece exatamente o que eu esperava. Página inicial. Agora podemos usar isso como um modelo em branco, mas há apenas uma pequena etapa adicional que precisamos fazer. Então, vamos navegar até nossas páginas e abrir essa página. Ok, então o que precisamos fazer é, por que isso está aparecendo de novo? De qualquer forma, precisamos ajustar as configurações no back-end aqui Então, precisamos abrir a página e, em seguida, alterar os modelos aqui das páginas e, em seguida, queremos trocar o modelo Agora você fica tipo, Bem, por quê? Por que eu quero fazer isso? Tudo bem, então abra o site novamente e dê uma olhada rápida. Agora, o que você vê? Você vê uma tag de título H one na frente e no centro que diz página inicial Eu não quero essa tag de título H one. Não quero esse título no topo da página e não consigo me livrar dele. É tipo, como faço para me livrar disso e adicionar outra coisa que seja um pouco mais atraente e melhor projetada Então, com esse tema, é muito simples. Tudo o que você precisa fazer é clicar nos modelos aqui para ver a página. Então você quer clicar em Swap Template. Agora, você tem alguns modelos diferentes. Você tem página com barra lateral, página com imagem ou página sem título Queremos uma página sem título. Em seguida, clique em Salvar. Portanto, deve dizer página sem título ali mesmo. Deixe-me clicar em Salvar, lá vamos nós. E lá vamos nós. Tudo bem, então vamos recarregar isso. E lá vamos nós. Então, agora temos um bom modelo em branco para começar a editar nosso site. 9. 9 Crie uma chamada para ação: Adicionando uma chamada à ação para nosso site. Agora, vamos dar uma olhada na página inicial. Temos um modelo em branco configurado e, da forma como vou criar esta página inicial, é como uma página de vendas para uma oferta gratuita Então, você já viu em outros sites que é como baixar meu e-book, obter minha lista de verificação, assistir minha master class, Vamos criar uma página inicial assim, além das postagens e páginas do blog, do cabeçalho e do rodapé Todas essas coisas eu vou te mostrar mais tarde no vídeo tutorial. Mas agora, precisamos adicionar uma chamada à ação no topo, aqui. Então, volte para a página que você definiu como sua página inicial Em seguida, clique no sinal de mais. Em seguida, clique em Procurar tudo. Então, queremos navegar até aqui até os padrões. Agora, você tem vários padrões diferentes sobre banners, chamados de ação em destaque, e assim por diante Se você entrar na chamada ação, você tem vários modelos diferentes aqui que são muito bons. E eu vou realmente usar esse. Este é apenas um bom exemplo para mostrar como editar coisas. Aqui, isso parece muito bom. Deixe-me clicar aqui para ver as configurações. Agora que tenho as configurações abertas, temos essa cor de fundo. Talvez você não goste dessa cor. Portanto, certifique-se de selecionar a imagem ou o padrão, como quiser chamá-lo. Em seguida, verifique se você selecionou o bloco. Você deseja navegar aqui até as configurações ou os estilos. E então é aqui que você pode mudar a cor. Então, eu quero mudar o plano de fundo e herdar a cor do tema Então, há brancos e depois há a cor do tema. Então, eu gosto da cor do tema que é esbranquiçada. Gosto da forma como isso é configurado. E então aqui, essa deve ser sua tag de título H one. Por que sua tag de título H one? Porque é o título da página. Porque, novamente, lembre-se de que essa é sua tag de título H one, mas no tempo que estamos usando, estamos escondendo o título da página. Então esse é agora o título da página. Então você precisa destacar isso, mudar isso para H um, e você pensa: Bem, eu não gosto quão grande isso é. Tipo, sem problemas. Clique aqui para ver a tipografia, e então você pode minimizar isso um pouco, diminuí-lo um pouco Depois, você pode alterar a cópia aqui conforme necessário, aqui e aqui. Agora, temos essa imagem aqui e você pode substituí-la pela sua própria imagem. Obviamente, você precisará criar uma imagem e ela deve mostrar o que o usuário final receberá. Seja qual for a sua oferta gratuita, seja um vídeo, um curso, mais uma vez, uma aula magistral, um truque, uma lista de verificação, qualquer Você vai ter que criar um gráfico e adicioná-lo aqui. Mas você também pode adicionar um vídeo, que é o que vou mostrar como fazer. Podemos simplesmente clicar nessa imagem aqui. Na verdade, deixe-me clicar em Salvar. E vamos dar uma olhada rápida para ver como isso aparece. Vamos recarregar os sites ali mesmo. E sim, isso parece ótimo. Eu quero mudar isso para dizer um vídeo. Já tenho algumas guias diferentes abertas para vídeo, então deixe-me clicar nesta imagem e clicar em Excluir Então, basta remover a imagem. Agora podemos adicionar um vídeo aqui. Então, deixe-me clicar no sinal de mais, e eu quero digitar no YouTube, e então há um botão do YouTube ali mesmo. E esse pequeno bloco do YouTube. Podemos colar isso. Clique em Incorporar e clicaremos em Salvar novamente aqui. E agora vamos recarregar isso. Sim, e agora temos um vídeo bonito aqui. Mas e se você disser: Bem, eu não quero incorporar o YouTube ou quero ter um pouco mais de marca no meu site, tudo Então, eu definitivamente sugiro usar uma opção alternativa de hospedagem como Vemo ou Vemo Vimeo, não Vemo. Não estou enviando dinheiro. Vimeo ou algo parecido. Se você quiser usar o YouTube, talvez você possa simplesmente deixar o vídeo não listado e, em seguida, usar um plug-in dedicado para Wordpress que pode ajudá-lo a melhorar a marca do vídeo Então, qual plug-in eu recomendo? Então, deixe-me encerrar isso. Clique aqui para ver o W e vamos navegar até aqui para conectá-lo ou conectá-lo. E vamos adicionar um novo plugin. E vamos adicionar a camada Presto player Presto aqui Ok, é o melhor reprodutor de vídeo do Presto player. Ok, então talvez seja chamado de Ultimate Video player agora. De qualquer forma, vá em frente e instale isso. O melhor reprodutor de vídeo para WordPress, da Presto Player Vamos clicar em Ativar ali. E bom. Então, agora classificamos o Mathio e o Presto player como plug-ins ativos no site Então, agora precisamos voltar às nossas páginas. E vamos para a página inicial, a página que estamos editando aqui E agora podemos novamente excluir isso e clicar no sinal de mais. E então queremos digitar o Presto player. Então, o jogador Presto está ali mesmo. Clique em Ns e este é um vídeo do YouTube. Então, se você estiver criando um vídeo de vendas, eu definitivamente recomendo usar o VMO Então, só porque ele remove todos os tipos de vídeos recomendados e tudo mais. Mas você pode usar o YouTube e usar vídeos não listados em seu vídeo de vendas para incentivar as pessoas a clicarem no botão aqui para baixar o que você está oferecendo De qualquer forma, deixe-me pegar essa URL novamente e colocar essa URL aqui Vamos clicar em Adicionar vídeo. E isso parece muito melhor. Então, vamos economizar rapidamente. E vamos abrir o site só para dar uma olhada, sim, aí está. Ok, então tudo foi carregado corretamente. A razão pela qual eu gosto do Presto player é porque você tem muito mais controle sobre a aparência marca do vídeo que está sendo exibido em seus sites Então, se eu clicar aqui, se eu clicar aqui, agora temos o bloco selecionado, e então eu tenho várias opções diferentes para a forma como esse player de opções diferentes para a forma como vídeo é exibido. Configurações de vídeo, silenciado, reprodução automática, tempo de reprodução ali e, em seguida, temos Eu posso mudar o curso, mínimo, simples, YouTube, otimizado. Então, apenas algumas predefinições úteis, a marca global do player, para que você possa alterar a cor aqui para combinar o design do seu site e as cores escolhidas para o seu De qualquer forma, é por isso que eu gosto do Presto player, porque você tem um pouco mais de flexibilidade e controle sobre como isso é exibido em seu site Então, a próxima coisa que você precisa fazer é, novamente, criar algum tipo de vídeo de vendas se você estiver oferecendo algum tipo de você estiver oferecendo curso gratuito ou qualquer outra coisa, e então ter um bom vídeo, enviá-lo para o Vimeo ou YouTube, torná-lo não listado e usar o Presto Player Em seguida, altere a cópia aqui para corresponder à oferta gratuita. 10. 10 Como personalizar a chamada à ação: Então, eu atualizei a cópia da nossa chamada à ação. Então, algumas coisas diferentes eu fiz. Então, coloquei o texto em negrito aqui em cima. Eu adicionei pequenos emojis de marca de seleção para marcadores, que se destaquem um pouco mais E eu atualizei o botão, para que ele chamasse um pouco mais de atenção e mudei a cor, para que combinasse com o player de vídeo aqui Agora, deixe-me entrar aqui e mostrar o que eu fiz. Então, como destacar o texto e colocá-lo em negrito, basta destacar o texto. E clique no botão B. Isso coloca o texto em negrito ali mesmo. E então o parágrafo de texto ali mesmo, muito simples. Então eu acabei de adicionar marcadores aqui. Então, literalmente, isso é apenas uma linha de texto, linha de texto, linha de textos. Agora, como consegui esse pequeno Emoji de marca de seleção? Eu literalmente pesquisei Emoji com marca de seleção verde no Google. E então me direcionou para o Emoji PDA aqui. Você clica em Copiar, depois clica em Colar, colar, colar. Feito. Simples assim. Então, aqui mesmo, temos o botão. Então eu fiz algumas coisas diferentes aqui. A primeira coisa que fiz foi, nas configurações do bloco, que fosse 100%. Então, isso faz com que o botão tenha 100% de largura para preencher toda essa seção vertical aqui. Então, parece apropriado. Depois, a outra coisa que fiz foi clicar nos estilos. Depois fui para o plano de fundo e criei a cor de fundo do botão, combinei com o reprodutor de vídeo aqui, e depois fiz a tipografia L grande. Então, novamente, chama mais a atenção. 11. 11 Como finalizar a seção de chamada para ação: Ok, então esse botão aqui, não vai mentir. É meio chato porque não tem animação. Com os botões em seu site, você quer ter algum tipo de animação para indicar ao usuário final que ele pode clicar e interagir com esse botão. Então, se isso fosse capaz de destacar, escurecer, levantar, qualquer coisa, apenas fazer alguma coisa, seria ótimo Mas, infelizmente, esse é o botão padrão do Wordpress e não há opções para ter recursos como esse. Então, teremos que instalar um plug-in diferente e criar um botão diferente. Agora, novamente, se você está feliz com esse botão, você fica tipo, eu não me importo. Isso é bom para mim. Tudo bem. Ótimo. Guarde isso. Para cima. Mas, para mim, quero algo que chame mais a atenção e De qualquer forma, deixe-me clicar aqui. Vamos clicar no W e vamos navegar até aqui até Plugins. E eu vou adicionar um plugin chamado stackable. Então clique em Au Plugin. Em seguida, clique aqui e digite Stack ble, Stack, ble . Tudo bem. Procure por isso. Tudo bem, então aqui está Stack Bull Page Builder Gutenberg Tudo isso adiciona blocos adicionais para você usar no blocos adicionais para você usar design do seu site. Clique em Instalar e clique em Ativar. Lá vamos nós. E clicaremos em pular aqui. Tudo bem, então está instalado. Então, vamos voltar para nossas páginas e voltar para a página inicial que estamos editando E é hora de adicionar um novo botão. Então, vamos navegar até aqui. Deixe-me chegar a um pouco de espaço. Clique no sinal de mais, navegue aqui e clique em Procurar A. Agora que você instalou o Stackable, há uma grande variedade de plug-ins do Wordpress que adicionam blocos adicionais Eu só gosto de empilháveis. Então, essa cor rosa-choque, arroxeada, é empilhável Então, o que queremos é adicionar o botão. Então, aqui para o botão, esse é um botão empilhável Agora podemos começar a criar nosso novo botão. Então, deixe-me ir em frente e adicionar o texto aqui. Então pegue o minicurso aqui. Ok, então isso parece bom lá. E queremos mudar a cor desse botão para combinar. Então, deixe-me clicar aqui. Vamos clicar nos estilos, no fundo e na cor personalizada que eu tenho aqui. Vamos clicar em Copiar ali. Então, vamos clicar no botão aqui. E bundas e cores ali mesmo. Depois, bundas e cores. Clique sobre isso. E então, aqui, só queremos copiar e colar essa cor, e pronto. E isso parece bom. Então, novamente, um pouco pequeno. Queremos que o texto seja maior e queremos que o botão seja maior. Mas podemos fazer tudo isso no StacCableJ de forma um pouco diferente Como se você não pudesse destacar o texto aqui e tudo mais. Você tem que interagir com tudo aqui. Então esse era o botão Color. Agora, lados e espaçamento dos botões, bordas e sombras, ícone, Vamos pular aqui para ver a tipografia. E aqui, podemos tornar o botão um pouco maior. Então, continue assim. E eu quero mudar a tipografia e aumentar o peso. Vamos apenas dizer em negrito. E sim, isso parece ótimo lá. Então, vamos clicar em Salvar e ver como está. Vamos rever a visão Ok, então eu gosto bastante desse botão do jeito que está configurado, então fica bem aqui, então vamos clicar no botão novamente E podemos simplesmente continuar. Então, com o layout aqui, se você navegar até aqui, você terá tamanho e espaçamento dos blocos, então você pode ter várias margens e preenchimentos diferentes , pequenas coisas Normalmente, você ficará na seção de estilo aqui. Você tem o link padrão, Goes plain. Eu gosto do padrão. De qualquer forma, então coloque bordas e sombras aqui. Portanto, você pode adicionar um raio de borda se quiser que seja um pouco mais redondo Então, eu gosto de um pouco mais redondo aqui. Guarde talvez apenas um quatro, mas muito sutil aí mesmo. E então contorno da sombra. Você pode dar uma boa sombra ao botão para que ele saia da página da web e escolha nove Vou manter algo sutil assim, talvez cinco. Estilos aqui, efeito de foco. No momento, é enviado para escurecer. E eu quero que isso seja, digamos, elevador. Mantenha-o como elevador ali mesmo, e talvez possamos aumentar o tamanho e o espaçamento do botão Então, talvez apenas em toda a largura, mantenha as coisas simples assim. E vamos clicar em Salvar e vamos recarregar as vistas. E sim, isso parece muito melhor. Então esse botão é muito melhor, um pouco de animação associada a ele. Então, novamente, para alterar os estilos acima, o efeito Hover, você pode alterar a elevação, escurecimento, escala, elevação Você pode brincar com isso para ver o que quiser pessoalmente. Tem uma pequena sombra projetada agora. É um design muito sutil. É arredondado. Então, eu realmente gosto disso. Isso é muito melhor. Então, agora podemos ir em frente e deletar essas pontas ali mesmo. Saia disso. Ótimo. E precisamos dar a isso um pouco de espaço para respirar. exemplo, eu não gosto de como esses botões ficam logo abaixo do texto, então basta pressionar Enter Sim, eu sei que é super complicado. De qualquer forma, clique em Salvar. Tudo bem, então vamos recarregar os sites aqui E agora temos nosso belo botão estilizado que sai da página da web quando passamos o mouse sobre ela e pronto E, finalmente, para onde você direciona as pessoas exatamente? Então, eu sei que vou receber essa pergunta. Então agora você tem seu botão configurado. As pessoas clicam nele. Para onde você os envia? Você quer enviá-los para uma página compacta. Então, basta clicar nesse botão e, em seguida, entrar em uma página na qual posso inserir meu e-mail para ter acesso ao que estou vendendo aqui Como você cria essa página? Ou você pode criar sua própria página em seu próprio site, então basta seguir o processo que eu já mostrei, onde você cria uma página, página sem barra lateral, sem cabeçalho, seja o que for, e depois basta adicionar o formulário de inscrição por e-mail Para a maioria das pessoas, eu sugeriria usar seus clientes de e-mail. Portanto, se você estiver usando o ConvertKit, ConvertKit vem com páginas de destino gratuitas, então você pode simplesmente personalizar uma página de destino e ter aqui o formulário no qual as pessoas podem inscrever para obter Você também pode usar o card.co, que é um ótimo construtor de sites de uma página Você pode usar páginas de leads. Mas a jornada do usuário é clicar no botão levá-lo para uma página compacta Na página de compressão, é aí que eles inserem e-mail ou o nome e o e-mail para obter a coisa Depois que eles clicarem no botão para realmente enviar o e-mail , você os instrui a baixar o conteúdo gratuito que você está fornecendo ou assistir ao vídeo gratuito. E para realmente criar um link para a página específica, basta navegar aqui até onde diz Link. Agora, você verá que diz abrir em uma nova guia e abrir tinta em uma caixa. modo geral, se você estiver vinculando seu site a uma URL diferente, a uma página compacta, o que você geralmente deseja usar, abra em uma nova guia Você não precisa, mas isso é o que eu faria. Abra em uma caixa de luz. Uma caixa de luz é uma tela ou uma caixa que aparece como uma sobreposição na parte superior do seu site Então, eu definitivamente não usaria o Openink em uma caixa de luz. Então, eu usaria abrir em uma nova guia, novamente, se você estiver direcionando as pessoas para sua página de compressão, mas depende totalmente de você, de qualquer forma, quando você tiver sua página compacta ou página de vendas, seja o que for, direcionaremos o visitante final Você quer clicar no botão ali mesmo. Você deseja navegar até Link e, em seguida, inserir seu link aqui. 12. 12 Crie um elemento de venda: Adicionando elementos de venda à nossa página de vendas. Então, um elemento de venda, como eu gosto de chamá-lo, é algo que ajuda a estabelecer confiança e autoridade no site. Você já viu isso em outros sites em que está em um site que diz, como apresentado neste site, neste site, neste site ou em mil clientes da AB, cinco avaliações de servidores, um prêmio do órgão regulador. Tipo de coisa. Então, como você adiciona isso ao seu site? Então, deixe-me abrir as configurações do bloco ali, e eu quero clicar no bloco amplo. Então, agora tudo está selecionado, e eu quero clicar no pequeno sinal de mais que está lá embaixo para adicionar um novo bloco. Vamos clicar em Browse A e voltar aos nossos padrões. E então, aqui embaixo, depoimentos que eu conheço, surpreendentes, mas o bloco de depoimentos eu realmente gosto para esse propósito aqui Então, basta clicar nele para adicionar e pronto. Então, a primeira coisa que queremos fazer é mudar a cor de fundo para combinar a cor de destaque que está acontecendo com o resto dos sites Então, deixe-me clicar aqui para ver esse azul. Aí está. Vamos destacar essa cor de destaque E agora vamos clicar no bloco aqui embaixo novamente. E então queremos clicar aqui para ver os estilos. Você quer clicar no plano de fundo. E então você quer clicar na área branca aqui para que ela apareça com o hexadecimal Você quer ignorar essa base dois, tanto faz. Agora você quer colar isso aqui, e isso parece ótimo. E então queremos ter certeza de que o texto é branco, porque isso que estamos fazendo em todo o design. Então, o botão azul aqui tem texto branco. Agora, aqui está um monte de imagens. E então não queremos isso. Só quero me livrar disso. Mantenha as coisas simples. Em seguida, queremos adicionar várias colunas diferentes. Então, eu quero clicar aqui para ver o sinal de mais, e então queremos adicionar colunas ali mesmo. E eu sugeriria três ou quatro, mas vou simplificar. Vamos fazer apenas três. E então temos várias colunas diferentes aqui. E então, com essas colunas, é aqui que podemos adicionar texto. Agora, temos um pequeno espaçador ali. Então, queremos mover o espaçador para cima. Então, é útil aqui. Não é grande coisa, mas mantemos isso aí. E agora queremos adicionar texto. Então, clicamos no sinal de mais, no parágrafo e depois no título. Clique aqui, texto do parágrafo, título, clique aqui, texto do parágrafo, boom e título. Lá vamos nós. Ok, então aperte a barra de espaço, então a cópia vai aqui e a mesma coisa com isso. cópia vai aqui. Então a mesma coisa. Novamente, a cópia vai aqui, apenas para fins de demonstração. E, claro, queremos mudar esse texto para branco, então você pode simplesmente clicar nele, clicar no sinal e depois alterar a cor do texto clicando nele ali Então, deixe-me clicar no backspace para voltar a ficar preto. Lá vamos nós. Tudo bem, então, de qualquer forma, vamos mudar isso de volta para preto só para manter a consistência Então, deixe-me clicar em Salvar. E ótimo. Então, vamos ver o site. Então, vemos como isso está acontecendo do ponto de vista do design, e isso parece muito bom, mas algumas coisas, então não é equilibrado. Então, queremos ter certeza de que essas colunas estão todas centralizadas, para que tudo se encaixe perfeitamente Há muito espaço aqui. Então, quando você está criando a cópia aqui, precisamos pegar isso e ter certeza de centralizar o texto ali mesmo no centro da linha e, em seguida, no centro da linha, no centro da linha, no centro da linha, no centro da linha Lá vamos nós. Então, vamos clicar em Salvar. E vamos recarregar os sites ali mesmo. Muito melhor. Portanto, a cópia que quero adicionar aqui é qualquer coisa que ajude a estabelecer confiança e autoridade no aqui é qualquer coisa que ajude a estabelecer site, como milhares de estudantes se juntando a 5.000 outras pessoas, um prêmio de um órgão governamental, seja o que for. Então, vou atualizar esta seção com algumas cópias. Tudo bem, então aqui está o que eu inventei. Temos 6.000 blogueiros. Eu assisti mini coors, Blueprint, roubar meu processo passo a passo, recursos, aprendi como roubar o segredo, como criar diferentes estilos de conteúdo Seja o que for. Então eu também decidi adicionar um pequeno asterisco ao lado cada pedaço de texto aqui, para que ele se destaque um pouco mais Então, vamos dar uma olhada nisso no back-end. Tudo isso é literalmente apenas um asterisco que você pode usar no teclado E então eu acabei de tornar o texto do título aqui grande. E então esse é o mesmo corpo de texto. Então, você quer ter certeza de que esse texto tem o mesmo tamanho desse texto aqui em cima. Você quer ser consistente com isso. Então, seu H um, H dois, H três, tags de título, que são essas coisas, sua tag H um, H dois tag, H três ou certos tamanhos, então seu corpo de texto é mais consistente. Portanto, o corpo do texto deve ser consistente em todo o design do site. De qualquer forma, isso é tudo para os elementos de venda. 13. 13 Crie um CTA de página do meio: O design da página inicial está indo muito bem. Agora, a próxima coisa que precisamos fazer é interromper o usuário final que está visitando o site com outra chamada Ação aqui Só queremos adicionar um botão, um belo botão grande ali mesmo. Então, o botão deve corresponder esse botão lá em cima porque você está avisando o usuário final de que, Ei, o grande botão azul que diz esse texto é o que eu quero que você clique Então, já preparamos o usuário final da seguinte forma Este é o botão em que eu quero que você clique Só preciso adicioná-lo aqui. De qualquer forma, deixe-me dar uma olhada na página aqui e vamos navegar até aqui. Você deseja clicar nos elementos ali mesmo e clicar no sinal de mais, digitar botão e criar um novo botão. Simples assim. Agora, infelizmente, você não pode copiar e colar o botão aqui. Você precisa apenas projetar tudo manualmente novamente. Mas não é muito difícil. Basta fazer o que você fez com este botão na parte superior. A direita aqui embaixo. Vou comprar as minicores do que eram 101 K a dez K ou zero a um K Lá vamos nós. Então, vamos clicar aqui novamente. Obtenha o cifrão de zero a um k, minicurso. Ok, então basta passar por todo o processo de configuração de tudo. Então, vamos clicar no botão. E que estilo era esse? Vamos navegar até aqui para ver a cor do botão e pronto. E vamos destacar isso, copiar isso. Pegue isso. Lá vamos nós. Navegue até aqui, assuma isso, e teremos o estilo, as bundas e cor ali mesmo, voltados para trás E copiar e colar isso parece ótimo. E então vá e volte com tudo. Mas algumas coisas que eu quero que você preste atenção são no estilo, você quer clicar nele, então é um botão de largura total ali mesmo. E então o texto aqui, você quer aumentar esse texto, obviamente, para que ele se encaixe. Então, deixe-me minimizar as cores dos botões aqui mesmo. E você quer navegar até aqui para, eu acredito que são estilos. Não. Ok, então nós queremos ter isso também. Queremos que isso aumente o tamanho e o espaçamento dos botões. Isso parece bom lá. Bordas e sombras dos botões, tipografia. Lá vamos nós. Ok, então, em tipografia, quero clicar em Ns. Queremos fazer os pesos Queremos que isso seja ousado. E então queremos que o tamanho do texto seja um pouco maior, para que ele saia da página. Sim, parece bom. Então, talvez seja um pouco grande demais. Minimize um pouco. Sim, lá vamos nós. Então, eu realmente gosto da aparência que está lá. É minimizar isso. Ok, então botão, bordas e sombras Então, o raio é como podemos deixar o botão um pouco mais redondo, para que não haja tantas bordas afiadas nem tão afiadas ali mesmo E então vamos adicionar um pouco de sombra projetada, cinco é bom. E sim, estou gostando muito. Então, fica bem aqui. Agora, também existem alguns problemas. Então é como, Bem, está tocando isso. Então, como faço para que isso tenha mais espaço? Então, para separar o botão dele, tocando nesse elemento ali mesmo, o que precisamos fazer é clicar no sinal de mais e digitar SP, ACER Então, clique no espaçador, clique nele e queremos mover o espaçador para cima clique nele e queremos mover o espaçador para E talvez seja um pouco de espaço demais, mas queremos mantê-lo ali, parece bom. Vamos clicar em salvar. Ótimo. E vamos recarregar o site e ver como fica E isso parece fantástico. Então, muito legal, chamada de ação no topo, ali mesmo. O usuário rola para baixo. Isso chama a atenção do usuário novamente com um belo botão grande no meio da página, porque você deseja ter uma ação chamada na parte superior, em algum lugar no meio E, novamente, uma ação final chamada logo na parte inferior da página, logo acima desse rodapé Então, de qualquer forma, é isso. É assim que você adiciona um botão no meio do site. 14. 14 Design de cópia de vendas: O que exatamente as pessoas aprenderão com seu ímã de chumbo gratuito Essa é a próxima seção que queremos adicionar abaixo desse elemento, aqui Então, basicamente, o que as pessoas vão aprender? Você tem que lembrar que as pessoas são egoístas. As pessoas querem saber, tipo, o que eu ganho quando estou no seu site. Então, vamos voltar para a página que estamos editando. E vamos clicar aqui, e eu quero clicar no pequeno sinal de mais. Em seguida, vamos clicar em Browse A. Vamos clicar em padrões. E então vamos clicar em “ Sobre” ali mesmo. Agora, um padrão que eu realmente gosto para esse trabalho é esse aqui. Grade de características, três colunas. Vamos clicar nisso. Agora, ele adiciona tudo acima desse elemento, mas não é grande coisa. Apenas certifique-se de que esteja selecionado. Então você quer clicar nessa pequena seta ali, mova para baixo. Feito. Simples assim. Agora, há um bom espaço entre esse elemento aqui e esse elemento ali, e tudo que você precisa fazer é alterar a cópia. Pessoalmente, gosto da forma como isso é apresentado. Se você não quiser seis itens, pode simplesmente vir até aqui e excluir esses três. Muito simples. Destaque-o e simplesmente exclua-o e mantenha esses três no topo aqui Eu, pessoalmente, vou deixar todos os seis. E tudo o que você precisa fazer neste momento é atualizar a cópia e enfatizar os benefícios que o usuário final obterá ao baixar seu guia de dicas e assistir ao vídeo oculto para sua classe, o que, neste caso, for um minicurso O que as pessoas aprenderão com o curso, o que você está oferecendo? Ok, então eu atualizei as cópias. Então, para a tag de título H two no canto superior direito aqui, coloquei o texto em negrito e atualizei os pequenos títulos aqui para torná-los algo atraente que as pessoas queiram se inscrever e obter um minicurso gratuito para aprender E então isso é apenas um texto fictício. Então, vamos dar uma olhada no back-end sobre como isso está funcionando. Então, o pequeno parágrafo de texto que estava abaixo disso, eu simplesmente o apaguei, destaquei isso e cliquei em Negrito, e pronto Então aqui com cada um desses pequenos blocos, vamos abrir nossas configurações ali mesmo e você fica tipo, Bem, como faço para me livrar do asterisco Tudo o que você precisa fazer é clicar no padrão e ele remove o asterisco Mas eu pessoalmente gosto do asterico. Eu acho que é um pequeno elemento de design agradável. É muito chamativo. Talvez remova o asterco deste principal ali mesmo. Talvez isso parecesse melhor. Vamos clicar em Salvar. Acho que provavelmente ficaria melhor. Recarregue isso. E sim, eu gosto mais disso. Portanto, isso é interessante e chama a atenção sobre o que o usuário final aprenderá Em seguida, existe algum tipo de processo que você ensina em seu sorteio gratuito, como passo um, faça isso, passo dois, faça aquilo. Passo três, faça isso. É tão rápido, rápido fácil que qualquer um pode fazer isso. Esse tipo de seção, você pode adicioná-la à sua cópia de vendas para que o usuário final entenda qual o valor que obterá ao comprar a coisa gratuita. Então, vamos adicionar esse tipo de seção aqui embaixo Talvez queiramos dividir um pouco esse design porque temos esse lindo layout de grade de seis elementos que parece ótimo ali. Então, talvez a imagem à esquerda, direita, esquerda, direita, esquerda, direita, esse tipo de layout. Então você quer fazer isso com talvez três imagens no máximo, duas ou três é tudo o que você quer. Então, vou ter uma pequena seção passo a passo que vou adicionar. De qualquer forma, aqui está a página inicial dessa edição. E deixe-me navegar até o final, e vamos clicar nisso e clicar no botão de adição, Procurar todos os padrões. E eu vou para a seção Sobre o padrão, e podemos usar esse padrão aqui, texto com imagens alternadas Então, vou clicar nisso. E agora temos essa pequena seção aqui com uma imagem aqui à direita, esquerda, direita, esquerda. E poucas coisas. Então, primeiro, tudo isso foi adicionado acima desse elemento, então podemos corrigir isso clicando em tudo aqui. Então, a coisa toda está selecionada. Agora basta clicar na seta para baixo e movê-la para baixo. Lá vamos nós. Então, temos isso aqui, seguido por esse elemento aqui. Agora, se você disser: “Bem, eu quero ter três imagens, como eu faço isso? Bem, porque essa imagem está à direita. Esta é uma imagem à esquerda. A próxima imagem aqui deve estar à direita. E, novamente, eu faria três imagens no máximo. Você não quer que isso seja redundante e repetitivo. Então, fazer isso é muito simples. Queremos clicar nesse elemento aqui, clicar no pequeno botão Opções e depois clicar em Duplicar E lá vamos nós. E vamos reduzir isso. E agora não há espaço suficiente aqui. Então, aqui, temos um pequeno ícone, ou não é ícone, mas um espaçador como é chamado tecnicamente Então, queremos duplicar isso. Vá em frente e duplique isso, depois mova isso para baixo. Simples assim. Então, agora temos três imagens aqui. Agora, obviamente, você vai querer substituir essas imagens por suas próprias imagens. Qual tamanho importa. Não há um tamanho adequado que você deva ou não usar. Você tem que testar isso, ok? Mas uma coisa é que você quer ter certeza de que todas as imagens são realmente do mesmo tamanho. Então, se é 500 por 500, esse tipo de estrutura, é isso que você quer modelar aqui. De qualquer forma, deixe-me clicar em Salvar. Ótimo. E vamos continuar e recarregar a página inicial E, sim, isso está funcionando muito bem. Então, agora temos uma pequena seção interessante aqui. E, novamente, tudo o que precisamos fazer é atualizar a cópia para refletir nossa oferta, bem como atualizar as imagens para refletir novamente a oferta gratuita, o valor que o usuário final receberá Então, para esta seção, como eu disse, no começo, vou transformar isso em talvez um processo passo a passo, etapa um, etapa dois, etapa três, com imagens exclusivas. Então, acabei de atualizar o conteúdo, e aqui está o que eu criei . Nada muito complicado. Então, logo no topo, a tag de título H two, coloquei em negrito, como venho fazendo com cada tag de título H two Em seguida, adicionei minhas próprias imagens personalizadas. Agora, de onde eu tirei essas imagens? Como isso funciona? Então, primeiro , pule aqui. Agora, mais uma vez, atualize a cópia ali. A mesma coisa com o asterisco e o padrão, esse tipo de coisa Então eu vou deixar isso. Em seguida, basta alterar a cópia com os marcadores aqui Agora, se você está se perguntando tamanho dessas imagens padrão, elas eram de 1.200 por 800 Pego essas informações e, em seguida , fui para o Canva, e você pode criar uma conta gratuita no Canva e ir para Tamanho personalizado Em seguida, você deve digitar 1.200 por 800 e criar um novo design Porque esse é o design que vem com o tamanho da imagem por padrão. Se você realmente gosta desse tamanho e forma e só quer mantê-lo, é isso que você pode fazer de 1.200 por 800 e depois criar suas próprias imagens aqui Então, usei fotos e digitei palavras que refletiam o que eu estava procurando, como açoitar, editar, monetizar, qualquer coisa . Encontre a imagem. Vá em frente , faça o download e pronto. Agora, apenas algumas coisas minimizamos isso. Depois que você baixou a imagem, eu a baixei como PNG, mas não a enviei como PNG. Então eu uso algo chamado GIMP para convertê-lo em um gráfico P de teia de pontos. Então, fazer isso é muito simples. Tudo o que você faz é clicar com o botão direito do mouse, abrir com e depois GIP. Então você tem que baixar GIP e GIMP. Este é o meu editor de fotos que eu uso. Então você tem a imagem aqui, e então você quer ir para Arquivo, então você quer ir para Exportar como, então você quer dar um título, e você quer mudar de PNG ou JPEG para web P. Por que eu faço isso? Um gráfico web P tem uma aparência melhor e é mais eficiente em termos de tamanho, especialmente se estivermos carregando uma imagem de 1.200 por 800, que é uma imagem um pouco grande E tudo o que você precisa fazer é exportar. Feito. Simples assim. Tão simples. Por isso, eu sempre gosto de converter minhas imagens de JPEG em uma imagem WebP, só porque com o Canva, por algum motivo, não sei por que eles não permitem isso, mas você só pode baixar imagens como JPEG ou PNG Portanto, não apenas a capacidade de baixá-lo como um arquivo WebP de pontos não está disponível Assim, podemos baixá-lo como vídeo JPEG, PNG, PDF, SVG, NPFoE Mas não há rede de pontos P. Então é por isso que eu faço esse pequeno processo de conversão rápida. Tudo bem, então uma vez que você tenha suas duas ou três imagens porque tem a Etapa um, a etapa dois. Passo três, como eu disse, então tudo que você precisa fazer é clicar na imagem e clicar em substituir, clicar em Carregar, fazer o upload, depois selecionar o tema ou desculpe, você seleciona a imagem que deseja enviar e, em seguida, ela a substitui automaticamente aqui Feito. Simples assim. Agora, depois de ter a imagem aqui, você tem algumas opções diferentes para ajustar as coisas. Você tem a proporção. Você pode mudar e brincar com isso, resolução grande. Você pode jogar com isso. Você também tem suas configurações aqui, onde você pode ter estilos, arredondados padrão, e então você pode alterar o raio ali, se quiser Se quiser adicionar uma borda, você pode fazer isso. Se quiser torná-lo realmente redondo, você pode fazer isso. Então, depende totalmente de você, como você quer lidar com isso. Então, deixe-me voltar para 14. Então, é bonito e redondo. Lá vamos nós. E sim, basta ter os cantos ligeiramente arredondados e apenas pequenas coisas sutis , caso contrário, fica muito bom. Então, no geral, estou muito feliz com a forma como esta página inicial está funcionando, e é assim que você atualiza as imagens desta seção para suas próprias imagens personalizadas Novamente, essa é uma imagem de 1.200 por 800. Você pode obtê-lo em uma ampla variedade de sites. Gosto de usar o Canva pessoalmente para todas as minhas imagens e depois convertê-las em um arquivo WebP, enviá-las para o seu site e alterar a cópia conforme 15. 15 Como adicionar uma seção de perguntas frequentes e depoimentos: Em seguida, podemos adicionar uma seção de perguntas frequentes e depoimentos à nossa página inicial Portanto, o objetivo de um FAQ é, na verdade, responder às objeções que as pessoas teriam de tirar proveito do que você está oferecendo, seja ou não um curso gratuito , um download ou um produto pago E, obviamente, depoimentos são úteis se forem verificáveis, porque, novamente, isso é apenas uma forma de prova social úteis se forem verificáveis, porque, novamente, isso é apenas uma forma de prova social. Então, como fazemos isso? Então, vamos voltar aqui para esses sites. Então eu tenho a página aberta aqui. Deixe-me minimizar isso. Deixe-me rolar até aqui e, se clicarmos nesse elemento ali mesmo, você poderá ver o sinal de mais. Você não quer clicar nesse porque clica neste sinal de adição, ele adiciona tudo a esta seção aqui, o que não queremos fazer. Você quer clicar aqui embaixo. E agora estamos adicionando outra seção abaixo desta Isso faz algum sentido. De qualquer forma, vá em frente e clique no sinal de mais Vamos clicar em Arcos A. Clicaremos em padrões E eu acredito que está abaixo do destaque onde está o FAQ, então role um pouco para baixo. Sim, lá vamos nós. Então, agora temos o FAQ aqui. Assim, podemos clicar nele adicioná-lo automaticamente ao nosso site. E um design muito bom. Mas uma pequena coisa, não sei por que ela continua sendo adicionada ao meio do site ali mesmo. Apenas mova isso para baixo, mova para baixo. Continue movendo-o para baixo. Lá vamos nós. E, obviamente, você pode ajustar a aparência desta seção ali mesmo. De qualquer forma, queremos adicionar uma pequena seção de depoimentos para que possamos clicar nela, navegar por todos os padrões e, em seguida, temos depoimentos lá Então, podemos adicionar qualquer depoimento que quisermos, talvez este aqui e fique bem aqui Gosto de como isso se mistura, mas podemos reduzir isso. Lá vamos nós. Então, agora temos uma pequena seção de perguntas frequentes que leva a uma seção de depoimentos aqui Ok, então como você edita e ajusta essas duas seções? Então, primeiro, eu gosto que eles se misturem, então eu manteria a mesma cor de fundo. Então, se você vai usar preto, mantenha-o preto ou qualquer cor de destaque que você esteja usando Mas de qualquer forma, ajustar tudo, é muito simples. É uma seção, então basta clicar nela. Você navega até aqui para ver suas configurações e, em seguida, aqui, você tem suas cores. Você tem a camada aqui, que você pode alterar e usar se quiser. Pessoalmente, gosto da forma como isso é apresentado. E queremos clicar aqui para ver os estilos. Você tem sua cor de fundo ali, então você pode alterá-la para talvez herdar cor do tema aqui ou talvez transformá-la em cinza claro ou verde ou o que você quiser fazer Você pode simplesmente brincar com isso porque é o seu site. Você pode fazer o que quiser. Então, só uma coisinha, deixe-me mudar para a cor do tema. O que você nota? E deixe-me mudar o texto aqui para preto. Então, em algumas coisas, você precisará clicar manualmente nas coisas aqui, destacá-las e alterá-las para a respectiva cor. Então, esteja ciente disso. Mas eu gosto de preto. Pessoalmente, gosto da forma como isso funciona e se parece. Portanto, a configuração é muito boa. Então, criar uma nova linha é muito simples. Você só quer clicar nele primeiro para entender qual elemento é esse, e ele diz o bloco, depois diz separador e é selecionado como uma linha larga Então é isso que precisamos adicionar. Então, clicamos e o que precisamos? Precisamos de um separador Então, precisamos de um separador, espuma e pronto Queremos uma linha larga e queremos que a cor seja branca. Simples assim. Agora, quando estivermos aqui embaixo, quisermos clicar aqui, digitando Olá, eu clicarei em baixo, para que ele se mova para baixo E essas são todas as três tags de título H. Vamos clicar aqui, mudar isso para parágrafo. Título. Agora, o título desapareceu porque H dois está definido como preto. Vamos clicar aqui para H três, e agora temos que mudar a cor manualmente. Então clique aqui, clique em branco e pronto. Então, basta chamar esse novo título e destacamos isso novamente. Clique aqui para A, deixe isso branco. Aí está. É um novo título, então Hello world. Vou manter as coisas simples assim. Então, obviamente, é assim que você ajusta esta seção aqui. Muito simples. Estes são apenas pequenos parágrafos, H três tags de título Isso é definido como H dois. Do ponto de vista do SEO, isso faz sentido. Então esse é o título da seção. Essas são as legendas aqui. Então, eu manteria isso como está. Se você quiser se livrar desse grande FAQ, provavelmente desejará alterá-lo para H dois, H dois, H dois e assim por diante. E eu manteria o FAQ curto e agradável. Como se isso fosse perfeito, L um, dois, três, quatro, talvez cinco, Max. Isso é o mais longe que eu iria. Quatro, eu provavelmente manteria para quatro, por padrão. Deixe-me desistir disso. Lá vamos nós. E basta ajustar o texto e, novamente, responder às objeções que as pessoas teriam ao comprar o curso baixar o item ou comprar seu produto, que é a seção de depoimentos Então, novamente, a mesma coisa de antes. Basta clicar no bloco inteiro ali para alterar a cor, o texto, o tamanho da fonte e todas as coisas boas ali. E com esse modelo aqui, ele vem com a opção de adicionar uma pequena imagem. Agora, isso é muito instável. Não sei qual é a palavra certa. Do jeito isso funciona, funciona. Simplesmente não é intuitivo. Tipo, você quer pensar como, Oh, eu vou clicar na imagem aqui e vou clicar em textos medianos e isso Não, não O que isso faz é transformar esse pequeno círculo em um desses itens lá em cima. Não queremos fazer isso. Você literalmente quer clicar no círculo ali mesmo. Veja o pequeno lado, eu posso rolar para a esquerda e para a direita com a barra de rolagem. Você quer rolar para baixo. Você deseja clicar em Carregar. Eu sei. É ridículo Agora, só queremos clicar em uma imagem, fazer o upload da imagem ali mesmo e, em seguida, formatar tudo corretamente, e é assim que você pode adicionar uma imagem com ela em seguida, formatar tudo corretamente, e é assim que você pode adicionar se estiver se perguntando como isso funciona. Você precisa clicar no pequeno círculo e rolar para baixo e procurar onde diz: Carregue e carregue a imagem dessa forma. Mas, no geral, acho que isso parece muito bom assim que sai da caixa proverbial 16. 16 Como adicionar postagens de blog à página inicial: Postagem de blog em nossa página inicial. Agora, para esse tipo de design, não sou muito fã de postagens de blog na página inicial, simplesmente porque é uma distração da principal chamada à ação, que é clicar nesse botão ali mesmo Mas eu sei que muitos de vocês vão dizer: Como faço para adicionar uma postagem de blog à minha página inicial? Então, deixe-me mostrar como fazer isso. Agora, a primeira coisa que você precisa fazer é clicar fora desse elemento e navegar até esta seção branca. Em seguida, clique no sinal de mais. A única razão é porque todo esse conteúdo está meio que agrupado Então, se eu clicar aqui para ver o sinal de mais, clico em Procurar, clico em Padrões. Clique na postagem e, não sei, deixe-me selecionar qualquer uma delas aqui. Vamos clicar neste e adicioná-lo aqui no topo. Então, é uma grande bagunça e difícil de se mover. Então, saia disso. Então, deixe-me navegar até aqui. Então, queremos nos afastar disso. Clique aqui. Clique no sinal de mais. Clique no parágrafo. Boom, lá vamos nós. Agora que temos a seção do parágrafo ali, podemos clicar no sinal de mais. Em seguida, podemos clicar em Procurar tudo, depois em padrões, navegar até aqui para ver as postagens e, em seguida, você pode selecionar a que quiser Então, se você quiser que uma imagem e um texto combinem, tudo bem. Vou selecionar esse aqui mesmo. Eu não sei Isso só chama minha atenção com um texto muito grande. Então, deixe-me clicar ali, e isso parece muito bom. Talvez o texto seja um pouco grande demais, talvez seja um pouco largo demais. Vamos ver. Deixe-me clicar no topo aqui. Vamos salvar o design. E então deixe-me ir para a página inicial e ver como isso fica Então, role para baixo aqui. E sim, isso chama a atenção. Eu meio que gosto disso, mas certo, como podemos ajustá-lo? Talvez o torne um pouco menor. Então, basta clicar nos elementos aqui, e esses são apenas todos os elementos. Em seguida, clique aqui para ver suas configurações e, em seguida, clique nos estilos ali mesmo. Em seguida, tamanho personalizado, podemos torná-lo um pouco menor, se quisermos, talvez 4,6 Então vamos dar um tapinha aqui. Então, talvez se for um pouco largo demais, não gostemos disso. Aumente um pouco desse jeito. Clicaremos em Salvar para que haja um pouco mais de espaço para respirar à esquerda e à direita do título. Então, vamos recarregar isso e parece bom. Então, eu meio que gosto da maneira como isso é interrompido. Então, novamente, você pode simplesmente brincar com isso no seu próprio tempo ou talvez apenas querer torná-lo muito menor, assim. Você poderia ir em frente e fazer isso ou talvez uma pitada maior assim Então, de qualquer forma, depende totalmente de você. Você pode brincar com os diferentes layouts postagens do blog Provavelmente vou manter isso assim. Eu meio que gosto desse design. Mas de qualquer forma, é assim que você adiciona postagem de blog à sua página inicial 17. 17 CTA final: E, finalmente, precisamos adicionar uma chamada à ação final para nosso site. Então, temos a chamada ação no topo aqui, pegue o minicurso, todas essas coisas boas. Em seguida, o usuário percorre a página da web aqui, outra interrupção para clicar no botão Agora precisamos adicionar uma ação chamada final na parte inferior direita aqui para fazer a ação chamada principal, que é clicar nesse botão, obter a coisa gratuita entrar em nossa lista de e-mail. Então, como fazemos isso? Então, queremos apenas adicionar outra chamada à ação, que é que há muitas seções predefinidas que podemos adicionar facilmente E então você só quer adicioná-lo abaixo desse bloco. Então você não quer clicar aqui ou aqui, basta adicioná-lo logo abaixo deste Então, vamos clicar no sinal de mais e clicar em Procurar tudo. Clique nos padrões. Clique na chamada à ação. E há alguns apelos à ação diferentes. Aqui, na verdade, há dois, desculpe, não dois. De qualquer forma, você tem esse aqui, junte-se a 10.000 inscritos e, em seguida, este com o pequeno ícone do e-mail Pessoalmente, gosto deste porque temos um ímã de chumbo, então eu alteraria a cópia conforme apropriado, onde isso é um pouco melhor se você estiver criando um boletim informativo por e-mail de marca, e o boletim informativo por e-mail é a oferta Então, de qualquer forma, eu vou clicar nesse aqui mesmo , e lá vamos nós Então, agora tudo o que precisamos fazer é mudar a cópia aqui. Então, quero que o texto reflita a chamada à ação no canto superior direito, aqui, sobre como criar vídeos de viagens lucrativos para blogueiros Então, você quer enfatizar isso novamente aqui, junte-se a 900 outras pessoas e aprenda a criar vídeos de viagens lucrativos. Aprenda a fazer XYZ uma, duas, três coisas, blá, blá, blá Então esse botão ali mesmo. Está tudo bem. Quer dizer, eu trocaria por esse botão Então, novamente, você precisa passar por todo o processo, atualizá-lo e redesenhar o botão aqui embaixo Então, deixe-me clicar em salvar aqui. Ok, então, de qualquer forma, vamos dar uma olhada na página inicial e ver como isso saiu. Então, aqui embaixo, isso parece muito bom. Talvez haja um pouco de excesso de acolchoamento ali mesmo do qual possamos nos livrar Então, eu realmente não preciso desse espaçador ali, então podemos excluir esses elementos Agora, temos essa seção aqui. Então, se eu clicar aqui, podemos clicar aqui e conferir o preenchimento geral Portanto, há um pouco de preenchimento ao redor desse bloco, para que possamos reduzir isso e ver como fica. Vamos clicar em salvar. Então, novamente, tudo o que fiz foi selecionar o bloco, o item, o bloco, clicar aqui para ver os estilos e depois reduzir o preenchimento É assim que isso é chamado quando você vê espaço entre diferentes elementos na página, nós o recarregamos E, oh, sim, está parecendo muito melhor. Então, aqui está o rodapé, chamado de ações ali mesmo. Clicamos aqui novamente e talvez minimizemos completamente o preenchimento Não precisamos de nenhum acolchoamento. Vamos clicar em salvar para isso. E vamos recarregar isso. Sim, eu realmente gosto disso. Então, isso parece fantástico na parte inferior. Então, novamente, é claro, você pode projetá-lo, então certifique-se de que todo o resto esteja bem. No entanto, não ajustei nada na página da web. Eu gosto disso. Agora, a única coisa que você precisa fazer daqui em diante é, obviamente, mudar a cópia. Portanto, ele deve se juntar 3.000 outras pessoas e ter acesso ao minicurso Aprenda a fazer XY Zoo um, dois, três, blá, blá, blá, blá, blá, blá. Estrondo. Então, o botão ali mesmo deve corresponder a esse botão. Botão bonito, grande e clicável com uma boa cópia na parte inferior, aqui mesmo Então, de qualquer forma, vamos pular aqui, e depois aqui, podemos simplesmente excluir isso juntos, excluir e depois navegar até aqui, e então a mesma coisa de antes Clique no botão, crie o botão ali mesmo, estilo padrão. E então aqui, você pode simplesmente passar por todo esse processo e editar e ajustar esse botão conforme necessário. Então pegue um ou desculpe, zero a um k, minicurso. Lá vamos nós. Então isso parece bom. E então, com efeito escuro. Não, eu quero que isso acabe. E depois as cores dos botões. Basta mudar a cor do botão ali mesmo . Tamanho e espaçamento. Quero que seja um botão grande e de largura total ali mesmo. Bordas e sombras Sim, eu quero ser um pouco arredondado, e talvez um pouco de sombra. Então, minimize isso e depois a tipografia ali mesmo. Tão rápido por aqui. Quero que o peso seja ousado. Eu quero que o tamanho da tipografia seja um pouco maior e mais chamativo, talvez pareça bom E então só precisamos dessa cor novamente. Então, deixe-me clicar no topo aqui, ver o que é isso. E bundas coloridas, pegue isso. Vamos destacar isso, boom. Copie, role para baixo aqui novamente e clique aqui. Tudo bem, então cor do botão Saia disso. Cole isso. Boom, lá vamos nós. Então, precisamos de um pouco de espaço, então vou clicar acima dele, pressionar Enter, só para espaçar um pouco. E lá vamos nós. Então, vamos clicar em Salvar. Tudo bem, agora vamos dar uma olhada na página, ver como ela fica. Sim, isso é ótimo. Então, novamente, você pode alterar a cor de fundo e coisas assim, se quiser. Então você pode clicar aqui para ver todo esse elemento, você pode alterar a imagem de fundo para uma cor específica, se quiser. Portanto, tem duas camadas como a camada externa e a camada interna, então você precisa clicar aqui para mudar essa cor para outra. Então clique aqui, para que corresponda. Então, se você quiser de novo, se você só quiser fazer isso, não faça. Gosto que seja branco e fique bem, mas é assim que você o ajusta. Então você pode fazer algo simples assim. Mas de qualquer forma, certo, boa cópia ali. E você também pode ter um emoji, se quiser. Então, Emoji, sem dúvida, abra, tudo bem, então vamos abrir isso aqui Copiar. Podemos colocar isso aí e colar, salvar. Lá vamos nós e recarregamos isso. E sim, uma coisinha bonita e sutil. Então, se você quiser adicionar isso. De qualquer forma, parece muito bom. Agora temos o rodapé e o cabeçalho para ajustar. De qualquer forma, a página inicial parece boa, está pronta, e você deve ter conhecimento suficiente sobre como personalizar e editar cada uma dessas seções 18. Logotipo 18: Adicionando um logotipo ao nosso site. A página inicial é feita grosso modo. Agora vamos atualizar esse logotipo de texto chato aqui. Como você faz isso? Muito simples. Volte para o painel do WordPress, navegue até aqui até onde diz aparência. Então você quer clicar no editor. Agora, aguarde alguns segundos para que o editor seja carregado e, em seguida, clique no design. Lá vamos nós. Então, vamos clicar nele. E agora queremos selecionar a seção do cabeçalho, clique na seção do cabeçalho. Então você quer clicar em Editar ali mesmo. E então você tem essa caixa aqui. É aqui que você pode fazer o upload de um logotipo. Então você clica nele para fazer o upload de um logotipo. E então eu fiz um logotipo aqui. Adicionar seu logotipo é muito simples. Tudo o que você precisa fazer é criar um logotipo e arrastá-lo e soltá-lo no lugar certo. Então, deixe-me prosseguir e selecionar isso. E você quer chamá-lo do nome do seu site. E o logotipo do texto ali mesmo. Em seguida, vá em frente e clique em Selecionar. Em seguida, o logotipo deve aparecer. Então, vamos expandir isso um pouco. Lá vamos nós. Agora temos texto aqui, então você tem duas opções. Ou você pode simplesmente retirar espaço disso ou excluir completamente esta seção de texto, se quiser que você decida totalmente, é realmente muito simples. Agora, a parte mais complicada é como, Bem, como você faz um logotipo? Deixe-me abrir o Canva. O Canva é o que eu uso para criar gráficos. Você pode criar uma conta gratuita do Canva e criar gráficos. Agora, depois de criar sua conta, clique aqui para ver Tamanho personalizado. Clique em Tamanho personalizado. Descobri que 300 por 80 pixels funciona melhor e, em seguida, clique em cria um novo design. Em seguida, ele abrirá com um espaço em branco de 300 por 80 e, em seguida, você poderá adicionar um logotipo. Aqui você pode brincar e criar seu próprio logotipo. Consegui criar isso Na verdade, cliquei aqui para ver o texto e, em seguida, cliquei aqui para ver a combinação de fontes Então eu apenas brinquei com a combinação de fontes ali mesmo. Mas você pode criar logotipos personalizados do zero, se quiser. Então, a fonte aqui é TT blue screens. Então, os efeitos aqui são deslocamentos como esses e, em seguida, a direção que você pode mudar E, obviamente, você pode brincar com as diferentes cores aqui para o design do site. Então, você quer que a cor de destaque corresponda à cor de destaque que está no seu Quando estiver pronto para fazer o download, tudo o que você faz é clicar em Compartilhar. Em seguida, clique aqui para baixar o logotipo e, em seguida, basta enviá-lo para o seu site. Por aqui. É realmente muito simples. 19. 19 Design de menu: Editando a seção do menu do nosso site. Então, aqui mesmo, eu adicionei algumas páginas adicionais. Então, sobre bloquear recursos de contato e, claro, temos a página inicial desde o início do Tutorial. Agora, a forma como esse menu funciona com esse tema é que qualquer página que você criar preenche automaticamente o menu aqui em cima Então, tudo o que fiz foi acessar as páginas, clicar em Adicionar nova página e criar uma página Sobre, uma página de blog, uma página de contato , etc., clicar em Publicar e adicioná-la automaticamente ao menu É bom e também pode ser um pouco chato, porque você não quer adicionar todas as páginas ao seu menu Às vezes, você só quer criar uma página por qualquer motivo. Mas isso não é grande coisa porque você pode excluir qualquer tipo de página. Vou excluir a página inicial e mostrar como tudo isso funciona Então, depois de adicionar algumas páginas, sugiro uma página sobre, página de contato, coisas assim. Vá em frente e adicione isso. E vamos excluir a página inicial, e mostrarei como adicionar outras páginas ao menu que você deseja adicionar, além de um botão Tudo bem, então, de qualquer forma, vamos navegar até aqui até o nosso painel do WordPress E vamos navegar até aqui até a aparência. E temos que voltar para a seção do cabeçalho, que é onde estávamos quando adicionamos o logotipo. Então, vamos voltar aos mesmos lugares. Então, vamos clicar no design. Vamos clicar no cabeçalho. Vamos clicar em Editar. E lá vamos nós. Ok, então queremos brincar com o menu, então clique no menu. Simples assim, e depois clique na página inicial aqui. Então, depois de selecionar esse menu , você deve clicar em Editar Portanto, a página de edição é a exibição de navegação, seus sites, páginas. A edição permitirá que você adicione, De reordenar páginas. No entanto, novas páginas não serão mais adicionadas automaticamente. Sim, não queremos que novas páginas sejam adicionadas automaticamente. Isso é conveniente no início, mas você quer ter um pouco mais de controle. Então, basta clicar em Editar. Agora você precisa adicionar manualmente as páginas que achar melhor, como eu gosto de dizer De qualquer forma, página inicial. Não precisamos de um link inicial porque as pessoas podem e clicarão no logotipo para voltar à página inicial Então, tudo o que fiz foi selecionar a página inicial. Navegue até aqui, clique em Excluir. Simples assim. Ok, agora temos os itens do menu selecionados aqui. Clicamos em mais e, em seguida, podemos adicionar itens adicionais aqui, se quisermos. Mas não queremos fazer isso. Queremos clicar no item do menu dessa forma. Está bem? Veja a diferença. Agora, quando clicarmos aqui , podemos adicionar links adicionais. Clicamos aqui, clicamos em NTS, pesquisamos ou digitamos ARL ou clicamos em Adicionar bloco Então, aqui, depois de criar uma página, você pode navegar e encontrá-la aqui, basta adicioná-la facilmente dessa forma. Mas, novamente, já adicionamos um blog, então exclua isso. É assim que funciona a partir desse aspecto. Ou você pode simplesmente digitar uma palavra, então digite learn. Clique em Mais Concluído. Tudo o que eu fiz foi digitar uma palavra, apertar Enter e adicioná-la. Mas o problema é que ele não está vinculado a nada, então você precisa passar o mouse manualmente sobre ele, clicar aqui para ver o link e clicar no pequeno ícone de lápis Temos o texto ali, depois o link aqui, isso não é um link. Isso não está vinculado a nada, então você precisa digitar no site. Então, vamos apenas dizer blackout.com slash, eu não sei, vamos Talvez crie uma página chamada aprender. Aqui, em Avançado, é aqui que você pode optar abri-lo em uma nova guia. Ok, então eu espero que você entenda. Espero que isso faça sentido. Espero que não seja muito complicado, então deixe-me deletar isso. Então, deixe-me clicar neste pequeno sinal de mais aqui, adicionar um bloco ali mesmo. Em seguida, você pode adicionar um botão aqui em cima, se quiser. Agora, novamente, o mesmo problema com esse botão é o mesmo problema com os outros botões, onde você não tem muito controle sobre a animação e o estilo dela. Então, deixe-me clicar aqui. Vou apenas dizer clique aqui. Sim. De qualquer forma, uma vez selecionado o botão, você sempre clica em Estilos. Então navegue até aqui ou desculpe, não estilos. Errado. Os estilos afetam todo o site. Você deseja clicar nas configurações, no botão selecionado, clicar aqui e, em seguida, alterar a cor de fundo do botão ali mesmo. Então, saia disso e saia daquilo. Então, você sabe, novamente , depende de você, se quiser adicionar um botão ali mesmo, pode excluí-lo e excluí-lo. Lá vamos nós. Ok, ou você pode fazer isso aqui. Clicamos no bloco no meio e depois digitamos o botão. Aqui, você pode adicionar um botão de call to action adequado. Então pegue o minicurso de dez K, ou chamaremos isso de minicurso de zero a um K. E então, é claro, você tem que acessar suas configurações e brincar com todo o design desse botão. Tipo, bem, eu não quero o botão no meio. Isso é meio estranho. Tipo, isso parece estranho. Então, como você muda as coisas? Então você clica aqui com esta pequena seta, move para a esquerda, pronto. Então, agora seus logotipos estão mais centralizados com o botão principal chamado botão de ação aqui Então, essas são suas duas opções com um botão. Então, ou você clica aqui para ver o sinal e adiciona o botão manual ali mesmo. Você pode clicar em Procurar tudo. Deixe-me clicar nos botões e ver como isso funciona. E talvez isso funcione. Deixe-me clicar aqui. E sim, tudo bem, então isso tende a acabar com isso. Adicione aqui embaixo em mim, de volta. B fora disso, volta fora disso, volta fora disso. E vamos deletar o botão ali mesmo. Ok, e vá em frente e exclua isso. Vamos clicar aqui. Então, vamos adicionar um bloco, procurar tudo. Botão aí mesmo, e lá vamos nós. Temos o botão ao lado dele. Então, essas são suas duas opções. Assim, você pode adicionar o botão ali mesmo e mover o botão para a direita, que dá um pouco de espaço, ou você pode adicionar o botão ao item do menu principal aqui. Então, só para chamar isso de D novamente, ou 020, dois, um K, minicurso Então, temos o item do menu ali mesmo. Ok, vamos clicar aqui com todos esses elementos, e parece bom. Então, novamente, você só precisa pular até aqui, acessar suas configurações e, em seguida combinar o botão com o botão que você tem aqui. Então, espero que isso faça sentido. Então é assim que você adiciona e exclui coisas do seu menu. Você também pode adicionar um botão, mas, novamente, você precisa selecionar tudo desta forma. Clique aqui, no sinal de mais, em Adicionar bloco e, em seguida, navegue por tudo e, em seguida, digite literalmente o botão e encontre bloco empilhável ali mesmo Ou você pode clicar aqui para o elemento no meio aqui para adicionar um botão depois mover o botão para a direita. O item do menu meio que se move um pouco para o centro. Então, da maneira que você quiser mais. Pessoalmente, meio que gosto da aparência com o logotipo ali e esse elemento. Ok, então eu atualizei o estilo do botão aqui para combinar o botão principal chamado Ação, logo abaixo, com uma pequena cópia rápida. Então, vamos voltar aqui para o design do logotipo clicar no botão ali mesmo. Então, só para mostrar algumas coisas que fiz no estilo, eu o tenho como padrão. Eu tenho o efeito de passar o mouse como escurecer, o link ali levaria para sua página de call to action principal, página destino, página de compressão, qualquer coisa para a qual você direcionará o A cor do botão está aí, eu tenho a cor do botão definida para a mesma cor que eu uso lá embaixo. Então, aqui embaixo, eu tenho bordas e sombras, o raio da borda é como você a torna arredondada Eu não gosto de pontas afiadas como essas. Sempre um pouco bom. E depois o contorno da sombra, se você quiser. Isso é opcional. Eu gosto do jeito que parece lá, e é mais ou menos isso. Isso é tudo que eu realmente fiz por isso. Novamente, só para que o logotipo e o botão tenham a mesma cor, e o botão aqui corresponda aos botões encontrados em outros lugares do site porque você está trocando com o visitante final que, Ei, o grande botão azul é o que você clica para aproveitar a oferta. 20. 20 cor de fundo de cabeçalho: Como alterar a cor de fundo do seu cabeçalho. Então, agora, eu tenho tudo configurado para branco, e eu gosto muito da aparência Mas se você disser: Bem, não, eu quero um fundo colorido, como faço isso? É assim que você faz isso. Navegue de volta ao seu editor. Eu tenho a seção de cabeçalho selecionada. Agora, a primeira coisa que você precisa fazer é clicar em toda a seção do cabeçalho. S tem um contorno azul. Isso significa que tudo está selecionado. Não isso, não aquilo. Deixe-me clicar aqui. Sim, assim. Você não quer isso. Você não quer clicar no meio aqui. Você quer ter certeza de que tudo está selecionado. Depois de selecionar o bloco, navegue até aqui até onde diz estilos. Clique aqui e você terá várias opções diferentes aqui para alterar o plano de fundo. Primeiramente, posso mudar a cor do texto. Se eu quiser fazer isso por algum motivo, vou deixar como preto. Se eu quiser mudar a cor de fundo para uma cor diferente, posso ir em frente e fazer isso. Se eu quiser adicionar uma imagem de fundo, se houver algum tipo de imagem padrão que você queira usar, você pode usá-la. Você também pode mudar a tipografia aqui, tornar as coisas maiores ou menores, como quiser lá Você pode aumentar o preenchimento, torná-lo maior, dobrar o preenchimento à esquerda e à direita, torná-lo mais Novamente, há algumas coisas com as quais você pode brincar aqui. E você também pode adicionar uma borda ali mesmo. Então, uma borda pode ser útil, então, por exemplo , aqui, não há fronteira. E se você quiser, eu quero uma leve linha preta na parte superior, assim. Aqui é onde você selecionaria a borda para fazer exatamente isso e, em seguida, clicaria aqui para ver o estilo. Então, para o quadro aqui, eu manteria esse zero, zero, zero, e nós manteríamos isso como um. Então você tem um pequeno separador de linha, o cabeçalho do corpo, o site Se você quiser fazer isso , o que eu não faço. E isso é verdade para as diferentes opções que você tem para criar o cabeçalho em relação à cor. Agora, uma coisa que você está notando aqui é que o logotipo tem um fundo branco Você fica tipo, por que isso? Isso porque o logotipo não tem um fundo transparente. Então, se eu voltar aqui até o meu logotipo, clico aqui para compartilhar, baixar. Aqui, diz fundo transparente. Basta clicar nele e a imagem terá um fundo transparente. Mas uma pequena coisa é que esse é um recurso pago do Canva, então você precisará uma assinatura paga ou de ter acesso a Caso contrário, se você quiser, eu não quero pagar pelo Canva, tudo bem Você pode baixar a imagem como está. Mas então você precisa usar outra ferramenta, como um site gerador de transparência PNG. Acabei de encontrar isso para que você possa simplesmente enviar sua imagem PNG para lá. Em seguida, vou transformá-lo em um plano de fundo transparente se você realmente não quiser pagar. Mas, novamente, eu pago pelo Canva porque é muito útil e eu o uso o tempo todo Mas, na verdade, isso é tudo que você precisa saber para editar e ajustar seu cabeçalho 21. Design de 21 rodapés: Editando e projetando o rodapé do nosso site. Então, vamos navegar até a parte inferior do site. Portanto, este é o rodapé desse tema. E, por padrão, eu realmente gosto muito disso. Parece muito bom. A única coisa que eu provavelmente mudaria é mudar esses links aqui para outra coisa. Então, eu sempre colocava os termos de privacidade, suas páginas jurídicas aqui embaixo. Então, eu mudaria isso do design com o WordPress para a cópia do seu site, termos, privacidade, esse tipo de coisa. E então eu simplesmente reformularia isso de privacidade para informações da empresa, seja o que for, e depois adicionaria links adicionais ali Em seguida, os links de mídia social. Eu gosto muito disso. Isso parece bom. Basta atualizar esses links para vinculá-los ao seu perfil de mídia social. Então, deixe-me mostrar um exemplo rápido do meu rodapé favorito, não de todos os tempos, mas é um pouco Grandios, mas é um bom rodapé Então, logotipo do site, quais são os sites sobre a empresa, aprenda informações sobre como você quiser chamá-lo, depois links de links e, na quarta coluna , links de mídia social. E-mail, número de telefone, endereço físico da empresa. Isso é o que você pode fazer aqui. Copie os termos do site, privacidade, pronto. Então, eu faria algo semelhante a isso aqui. Por padrão, eu gosto muito disso. Então, novamente, como eu disse, eu trocaria com lá. Agora, de qualquer forma, como você edita e ajusta? Então você tem que entrar no editor. Então, eu tenho o editor aberto aqui. Vamos clicar no design. Deixe-me longe disso. E vamos rolar até o final. Tudo bem, então passe o mouse sobre o rodapé, você verá o vinho roxo Clique nesse vinho roxo e agora você pode clicar em Editar aqui. E simples assim. Agora você está editando o rodapé. Então, você pode clicar aqui para aumentar o logotipo, se quiser. Semelhante a esse outro site, você pode ter um pequeno slogan, descrevendo do que tratam os sites Como um blog sobre açoitamento. Não sei, seja o que for. Então, está tudo bem. Então você pode simplesmente clicar aqui. Então, esses são todos os links ali, então você clica em NTs. Clique aqui. Isso tem um link de ancoragem ali mesmo Então, se você quiser mudar isso, por exemplo, diz sobre você sabe, qualquer coisa. Você pode retroceder para realmente alterar o texto Então, basta ligar para Hello apenas como exemplo. Depois, você pode destacar isso aqui e atualizar o link ali mesmo com outra coisa. Então, seria como um vlog how.com slash Page Title. Assim, você pode simplesmente examinar manualmente cada um desses itens ali mesmo e alterar tudo conforme necessário. Então, o design com o WordPress ali, obviamente, como eu disse, mudaria isso e faria com que fosse copiar um registro, como, e então eu teria talvez um separador de páginas Lá vamos nós. Depois, privacidade, termos do separador de páginas e assim por diante, coloque suas páginas jurídicas lá embaixo Então, na verdade, crie esses links, você teria que destacá-los, clicar no link e, em seguida você pode vincular a uma página que já existe. Portanto, se você já criou uma política de privacidade, basta criar um link para ela aqui ou digitar manualmente o URL. Então você pode digitar a barra voghow.com. Política de privacidade. Agora, obviamente, você precisa criar uma página para a política de privacidade, mas é assim que você adiciona links aqui, onde você tem que ser vocow.com, Ok. Isso é o que eu faria com isso aqui. Agora, deixe-me clicar aqui para as configurações e clicar no quadrado novamente. Então, agora temos todo o modelo selecionado e, aqui, ao clicar em Parte do Modelo, você pode facilmente alterar o design para outro layout de modelo. Então, por exemplo, esse é um belo layout minimalista que eu gosto bastante. Esse parece bom. Todas essas peças do modelo estão ótimas. Assim, você pode editar e ajustar como quiser. Eu pessoalmente gosto desse. É bom começar com um menu muito simples, apenas mais um menu. E então eu simplesmente mudava o design com o Wordpress e atualizava isso, novamente, copiava o site, os termos , a privacidade, e provavelmente silenciava a cor, um pouco muda significa, tipo, então não é preto escuro, então é apenas cinza claro De qualquer forma, depende totalmente de você, mas é assim que você edita e ajusta o rodapé Agora, como eu tenho o bloco selecionado, novamente, assim como seu cabeçalho, se você quiser alterar as cores e todas essas coisas boas, basta navegar até aqui até a configuração. Então você tem aqui o texto, você pode alterar a cor do texto para o que quiser lá. Você pode alterar a cor de fundo conforme necessário. Se quiser, novamente, você precisará atualizar o logotipo. Novamente, como eu mostrei com o cabeçalho. Você precisa criar um logotipo transparente. Não fiz isso porque estou usando um fundo branco, então não é tão importante. Você também pode atualizar uma imagem de fundo ali mesmo. Você pode alterar a tipografia para tamanhos diferentes aqui, aumentar e minimizar o preenchimento se quiser e a altura mínima, borda e algo semelhante ao cabeçalho, se quiser uma borda, então eu quero uma borda lá, mas não a quero em todos os lados, que seja zero, zero, zero e, em seguida, tenha uma bela borda sutil no canto superior Então o raio, a mesma coisa. Por aqui, se você tem um fundo colorido, você quer ter esse design. Novamente, vou manter uma cor branca sólida para combinar com tudo, mas estou apenas tentando mostrar coisas diferentes que você pode fazer essa parte do modelo para editar e criar. É assim que você edita e ajusta o rodapé. E se você estiver usando um rodapé colorido, verifique se é da mesma cor do cabeçalho Então, você quer que a seção do cabeçalho, como o rodapé, e seu cabeçalho aqui no topo tenha a mesma cor, como um sanduíche, se você quiser voltar com um fundo colorido 22. 22 Design de página do blog: Editando a página do blog do seu site. Então, se você quiser começar a blogar com essa equipe, você pode fazer isso Então aqui em cima, no menu, eu tenho um blog, e tudo isso é apenas uma página que eu criei e a chamei de blog. Simples assim, e certifique-se de que o URL seja slash Blog. Então, como eu fiz isso? Então, vamos pular até aqui. Deixe-me navegar pelas páginas aqui, e é literalmente apenas uma página chamada blog. Então, tudo o que fiz foi criar uma nova página, e então eu literalmente a intitulei Blog, publiquei, e depois me certifiquei de que o link, o URL, fosse e depois me certifiquei de que o link, o URL, Slash Blog Agora, do jeito que deveria funcionar, e com a maioria das equipes do WordPress, funciona assim : você deseja navegar até aqui para ver suas configurações, clicar em Leitura e temos uma página dedicada define uma página inicial para que possamos personalizar nossa página inicial Bem, a página de postagem deve funcionar da mesma maneira. Então, eu tenho a página do blog e quero que seja minha página de postagem. Clicamos em Salvar alterações. Vou te mostrar o que acontece se você fizer isso. Agora vamos recarregar a página e ela exibirá o modelo padrão Não tenho ideia de por que essa coisa faz isso. Eu acho que é uma peculiaridade ou um descuido. Você tem que tecer isso em branco. Deixe a página de postagem em branco e nós mesmos teremos que personalizar a página de postagem do blog, é assim que fazemos? Muito simples. Eu vou te mostrar agora como fazer isso. Mantenha Postpage como selecionado. Então, quando você tiver sua página de blog, nós a recarregaremos. Lá vamos nós. Agora queremos editar a página, não editar o site. Você deseja editar a página. Vamos continuar e editar esta página. Tudo bem, fantástico. Então , primeiro de tudo, queremos selecionar o modelo aqui. Então, por que você quer fazer isso? Porque agora você quer clicar em Trocar modelo Por que você quer fazer isso? Se você quiser que a página do seu blog tenha uma barra lateral, selecione a página com barra lateral aqui. Novamente, depende totalmente de você. Ou você pode deixá-lo apenas com a página com imagem ou página, sem título. Basta deixar assim com o blog e fazer com que esse seja o título ali mesmo. Simples assim, se você quiser. De qualquer forma, deixe-me trocar o modelo, e selecionarei a página de layout da barra lateral com a barra lateral e Agora precisamos ter o rolo do blog como o corpo do conteúdo ali. Então, clicamos no sinal de adição ali mesmo para adicionar um bloco. Quer navegar por todos os padrões, e você quer navegar até aqui até as postagens. E aí está. Então você pode clicar na postagem padrão ali mesmo ou nesta com a imagem à esquerda, a cópia direita aqui com o layout da grade de alvenaria ou o design escalonado aqui ou neste design simples, onde é como lista de postagens com Novamente, você pode brincar com isso no seu próprio tempo para ver qual deles você mais gosta. Então, vou clicar nesta postagem aqui, na grade com a primeira postagem, duas colunas, o que for. Vamos clicar em Ns. Lá vamos nós. E isso parece ótimo. Deixe-me clicar em Salvar, lá vamos nós. Ok, então vamos abrir isso em uma nova guia, só para ver como fica. Temos uma barra lateral aqui. Agora, o problema com esse design é que eu tenho uma barra lateral, que está meio que esmagando toda essa cópia aqui Portanto, se você optar por um layout de barra lateral, provavelmente é melhor usar um design em que seja apenas uma única coluna com , tipo, postagem em bloco, postagem de blog do BlogPost Se isso faz algum sentido, agora deixe-me clicar aqui, página com barra lateral Vamos nos livrar desse modelo de troca e clicaremos neste, página sem título Ótimo. Deixe-me ir em frente e recarregar isso E sim, isso parece muito melhor. Agora você fica tipo, Bem, eu quero uma barra lateral, como isso funciona? Tudo bem De qualquer forma, eu. Clique aqui e vamos em frente e exclua isso. Deixe-me clicar aqui para ver a página, página sem título, trocar modelos, barra lateral e vamos clicar em um design que corresponda a uma Vamos clicar em Publicar aqui para facilitar as coisas. Vamos clicar no primeiro deles lá em cima. Vamos clicar em salvar. E se você está se perguntando o que é isso, essa é a imagem em destaque na postagem do seu blog, que abordarei na seção de postagem do blog. De qualquer forma, isso para a página do blog. Então, vamos dar uma olhada na aparência desta página. Vamos abrir isso em uma nova guia aqui. E aí está. Agora você tem dois layouts diferentes se quiser uma barra lateral ou se quiser um design de largura total Então, isso parece muito bom. E isso mostrará a imagem em destaque de cada postagem individual do blog conforme você a adiciona no topo da tag de título H one do blog 23. 23 Design da barra lateral: Agora, se você está curioso sobre como editar e ajustar a barra lateral com esse tema, a maneira de fazer isso é clicar em Editar sites aqui mesmo quando a página do blog estiver aberta e, em seguida, acessar os elementos da barra lateral Então clicamos aqui, e então você pode clicar em Editar na barra lateral, que se abre assim Para ser honesto, é um pouco desajeitado. Eu realmente não gosto do jeito que isso funciona, mas é assim que é. E então você pode simplesmente ajustar as coisas aqui com a barra lateral Se você quiser adicionar novos blocos, basta clicar aqui. Role um pouco para baixo. Veja, é por isso que eu não gosto disso. É desajeitado. Clicamos aqui para obter mais informações e vamos clicar em Procurar tudo. Então temos blocos aqui que eu posso adicionar se eu quiser. Então, por exemplo, temos categorias, como isso é adicionado? Vamos até aqui para ver a lista ou categorias de categorias, exibimos uma lista de categorias da taxonomia, exibimos uma lista de todas as Clique aqui para ver a lista de categorias e pronto. Agora temos uma categoria. É daí que isso está sendo preenchido, e é assim que esse elemento aqui funciona Então, se eu fosse realmente usar um cibernético, o que não sou, pessoalmente não gosto de barras laterais Aqui estão minhas dicas de design para barras laterais. Se você vai usar uma barra lateral, mantenha a simplicidade. das barras laterais está popularidade das barras laterais está diminuindo porque, honestamente, maioria das pessoas visitará seu site em um dispositivo móvel, Então, vamos dar uma olhada em Justin Welch se você quiser usar a barra lateral Eu gosto disso. Literalmente, uma coisa é fazer uma coisa. Clique aqui para se inscrever. Concluído, ou atividades de nicho, tem uma pequena caixa aqui com um botão Assim, você pode criar isso com Stackable e adicionar um botão, se quiser Em seguida, eles simplesmente usam o resto do elemento aqui para veicular anúncios e exibir anúncios gráficos. E este é um blog antigo, agora extinto. Mas eu gosto da barra lateral aqui, onde há um monte de imagens bem desenhadas com uma sombra projetada que foram adicionadas aqui e vinculadas externamente aos produtos Portanto, essa é uma boa maneira de fazer com que as pessoas acessem seus produtos específicos, se você quiser seus produtos específicos, se você quiser usar uma barra lateral e quiser ter um elemento de design Isso é o que eu faria com a barra lateral. Ok, então deixe-me mostrar como ajustar isso. Então, talvez eu me livre disso lá em cima e clique aqui para ver o sinal de mais dizemos Imagem de imagem aqui, e eu quero fazer o upload de uma imagem Vou fazer upload de uma imagem minha. Lá vamos nós. E vamos mover isso para cima, ali mesmo. E então eu tenho uma imagem de mim mesma ali. Parece bom. E deixe-me clicar aqui para ver o sinal de mais. Oi, meu nome é David. Bem-vindo ao meu blog sobre açoitamento. Sou o autor do nome do produto XYZ 123123. Eu criei este site para ajudar você a fazer um vlog melhor, seja o que for. Ok, então vamos mover isso para cima e para cima, e vamos clicar em Salvar aqui, e vamos dar uma olhada na página de registro agora. Clique aqui. Vamos abrir isso. Lá vamos nós. Então, temos uma pequena imagem minha e um pequeno título aqui, e algo que você poderia fazer com isso é como, por exemplo, se você escreveu um livro da Amazon ou talvez tenha um e-book que esteja vendendo, você pode simplesmente criar um link interno para É como se eu fosse o autor deste livro e, em seguida, basta vincular novamente, vincular externamente a esse livro. Então, como você faria isso? Sou o autor do produto XYZ 123. Vamos apenas destacar isso. Em seguida, clique aqui e, em seguida, crie um link para a Amazon ou para qualquer lugar onde seu eBook esteja hospedado, e você poderá fazer isso E é assim que você meio que ajusta o ciberespaço aqui. Novamente, eu manteria as coisas super simples. Eu provavelmente escolheria talvez uma imagem como essa, uma pequena sinopse sobre E, em seguida, uma chamada à ação para se inscrever em seu site. Então, se você pensa, Bem, como você consegue isso? Isso é do seu cliente de email marketing, essa opção de se inscrever. Ou o que eu também consideraria fazer é simplesmente adicionar um botão, e o botão leva à página de compressão que estamos fazendo desta forma exemplo, clique em seu para se inscrever e, em seguida, a pessoa clica nela e a direciona para aquela página Ou se você quiser ter esse formulário para que as pessoas possam inserir e-mail e clicar em Inscrever-se , você receberá esse pequeno campo de seus clientes de e-mail. Então, novamente, eu manteria as coisas super simples. Uma caixa, um botão, algo para assinar, um monte de imagens com links externos para produtos, uma pequena sinopse sobre quem Realmente, é isso. Eu não usaria uma barra lateral super longa com categorias, links e tags e pesquisaria neste site e várias outras coisas para mantê-lo minimalista De qualquer forma, é assim que você edita e ajusta essas barras laterais. 24. 24 Design de pós único: Editando suas páginas individuais de postagem no blog. Então, temos que cobrir algumas coisas aqui. Então, primeiro, eu tenho essa postagem no blog aqui. Como as postagens do seu blog são criadas? Onde você cria postagens de blog? Então, vamos navegar até seu painel. Você quer ir aqui para ver as postagens. E então você quer clicar em adicionar nova postagem e simples assim. É assim que você adiciona uma nova postagem. Então, vamos abrir este melhor microfone geral para vloggers Essa é a aparência de uma postagem de blog no WordPress. Você tem sua tag de título H one no canto superior direito, seguida pelo corpo do texto. Então você pode criar H dois, H três, tags de título e assim por diante. Então, vamos dar um exemplo rápido. Então, os melhores microfones de espingarda, microfones de espingarda. E eu quero que seja uma etiqueta H two tile. Então, eu destacaria isso. Clique aqui. Clique no título. E então você quer ter certeza de que isso é H dois. Por que H dois? Porque isso é um subtítulo disso Tipo, esse é um subtítulo desse título aqui mesmo. E então você poderia ter uma cópia abaixo disso, apenas como um exemplo rápido, copiamos isso ali mesmo E então talvez tenhamos um subtítulo disso. E então o nome do microfone. Não sei, chame esse nome de microfone, e eu quero que seja uma tag de título H three. Então, tomaremos isso como título, e eu farei com que H seja três, porque esse é o subtítulo disso Então, deixe-me realmente abrir um exemplo rápido de uma postagem de blog para que seja um pouco mais. Fácil de entender. Então, vamos clicar aqui, os sete melhores tipos de sites. Essa é a sua tag de título H one no canto superior direito. Essa é uma tag H two tile porque é um subtítulo disso E então, enquanto você avalia isso, você pode simplesmente fazer H três, como H, que é uma etiqueta H três Tile porque esse é o subtítulo disso aí E é assim que você realmente deseja estruturar uma postagem no blog. Ok, então com as postagens do blog, você tem algumas coisas diferentes às quais precisa prestar atenção. Então, aqui, você pode ajustar o tamanho com o bloco. Então, novamente, deixe-me sair disso. E nós temos isso aqui. Deixe-me clicar aqui. Clicaremos nas configurações. E então eu quero selecionar esse bloco ali mesmo. E talvez eu queira que os textos sejam um pouco maiores para esse bloco, então vou clicar em Grande. Portanto, chama um pouco mais de atenção. Depois, você pode alterar a cor do texto e o plano de fundo, bem como ajustar as dimensões e avançar. Ok, então, de qualquer forma, eu não quero fazer isso. Então, saia disso. Tudo bem, então vamos clicar aqui para postar. Na verdade, isso é importante aqui. Então, primeiro, você tem o autor aqui, você tem o título e o link. Com o link com o URL, você deve mantê-lo curto e agradável em geral. Então, se eu tenho os melhores microfones gerais para vloggers, esses realmente devem ser os melhores microfones Você quer manter as coisas simples assim. As categorias são importantes. Todas as postagens do blog devem ser organizadas em uma categoria. Portanto, este site atualmente tem apenas uma categoria de blog. Em geral, eu provavelmente penso quatro a seis categorias nas quais você vai criar conteúdo e meio que me atenha a elas e talvez adicione novas categorias quando ultrapassar talvez 60, 70 postagens por categoria. Realmente, você quer isso aqui. Então eu tive que adicionar uma nova categoria. Então, para isso, vou chamar isso de microfone. Clicaremos em Adicionar nova categoria ali mesmo e eu a desmarcarei E agora temos essa categoria aqui. Deixe-me ir em frente e clicar em Salvar. E lá vamos nós. Então, com categorias, você quer colocar uma postagem de blog em uma categoria, não em duas, não em três, em uma. Agora, você também pode marcar coisas. Eu não gosto muito de etiquetar. Na minha opinião, a marcação não é muito útil, mas a ideia por trás da marcação era se você fosse criar um conteúdo único sobre um tópico muito específico Então, talvez sua categoria seja, tipo , carros e depois caminhões, e então uma etiqueta seria como Ford, muito específica. Em geral, eu só uso categorias para meus sites, mas, novamente, cabe a você não se sobrecarregar Não é como uma mídia social em que você pode marcar coisas e ajudá-las a se classificar melhor. Na verdade, é para fins organizacionais para o visitante final. E, na verdade, simples assim. Então você tem sucessões de links ali mesmo e, na verdade, simples assim Agora, como definir uma imagem em destaque, que é sobre o que eu meio que falei aqui. Então, no topo desta cena, você define a imagem em destaque. Você clica em NATs e, em seguida, pode fazer o upload de uma imagem de destaque, que é o que faremos ali mesmo Então, acabei de criar essa imagem novamente com o Canva, como mostrei anteriormente E você quer dar um título a isso como algo relacionado às postagens do blog, então o registro do microfone e todo o texto seriam a palavra-chave da postagem do blog Então, qual é a postagem do blog sobre microfones para o YouTube. Ok, então microfones para o YouTube. Agora, clicaremos na imagem do recurso de conjuntos ali mesmo. E agora temos a imagem principal ali. Vamos clicar em Salvar. Ótimo. E vamos recarregar nossa página do blog só para mostrar como isso se parece. E sim, parece bom. Agora temos um pequeno borb ali, imagem e o título, e isso parece bom Então é assim que essa seção vai ficar e ser preenchida à medida que você cria imagens de destaque, blogs e assim por diante Tudo bem, então, de qualquer forma, vamos voltar ao Dashboard. Abaixo da sua postagem. aqui que você tem suas categorias e tags. Então, se você clicar nas categorias aqui, esse também é outro local onde você pode adicionar novas categorias e gerenciar quantas categorias você tem e postagens de blog dentro das categorias. E você também pode criar subcategorias, se quiser. Então, por exemplo, chamaremos isso de registro e, em seguida, a categoria principal seria blog, apenas como exemplo. E então essa é uma subcategoria. A estrutura de URL deste site seria logout.com slash category slash Blog slash flogging Então aí está. Simples. E você quer usar subcategorias, pois faz sentido para a categoria primária Então, se você está falando, por exemplo, volta aos caminhões, talvez caminhões sejam minha categoria principal. Mas às vezes, mas eu escrevo muito sobre quatro caminhões por qualquer motivo, talvez eu crie uma subcategoria na Ford ou quatro caminhões e a estruture assim E, na verdade, é tão simples com o design e com os blogs Então é assim que você quer abordar isso, criar conteúdo aqui, H dois, H três, tags de título, colocar cada postagem do bloco em uma categoria lógica, não pensamentos ou categoria lógica não categorizada, talvez quatro a seis, isso faz sentido para o seu site Além disso, não se esqueça de que você ainda tem acesso a todas as vantagens da edição de blocos com o WordPress Você pode clicar aqui para o Plus, clique aqui para o BRS. Talvez eu queira ter um padrão aqui. Então, clicaremos no destaque ali mesmo. Talvez eu queira ter esta seção aqui, adicioná-la. O Wordpress é bastante flexível e permite que você crie páginas e conteúdos bonitos. Agora, se dermos uma olhada nessa postagem de bloco individual que acabamos de publicar aqui, será um design de coluna única. E se você disser: Bem, ei, eu quero adicionar na barra lateral ou talvez você apenas goste da aparência Talvez você queira que isso tenha uma barra lateral e, em seguida, sua postagem de bloco individual não tenha uma barra lateral, depende totalmente de você Mas se você quiser adicionar a barra lateral em uma única página de postagem, você pode fazer isso facilmente clicando aqui para ver as configurações Em seguida, clique aqui para ver o modelo, postagem única, modelo de troca e, em seguida, postagem única com uma barra lateral, e é assim que você adiciona na Ou se você quiser apenas mantê-lo como está, basta usar o modelo padrão, que é uma única postagem. Então, por padrão, não há barra lateral com as postagens individuais do blog Pessoalmente, gosto da aparência. Sou só eu. Mas depende totalmente de você. Novamente, se você passar pelo processo de criação de uma barra lateral que deseja usar, basta adicioná-la aqui Mas, no geral, isso é tudo que você precisa saber para começar a blogar E uma última coisa rápida que eu quero que você ajuste e saiba como ajustar é como mudar esse título ali mesmo. Então, diz B e depois Vlog 123. Esse é o nome de usuário de login do administrador. Então, não queremos isso. Obviamente, queremos que esse seja um nome mais lógico, como Brian ou qualquer que seja o nome dela. Então essa é a categoria que eu adoro. Perfeito na categoria. Perfeito, não mudaria nada ali mesmo. Isso é ótimo. O encontro aqui também está bom. Ok, então algumas pequenas coisas rápidas. Então, com a data, como você muda a data? Então, talvez você volte a esta postagem do blog em um mês ou dois meses e a atualize, e não queira mais que isso diga essa data, você quer ser a data mais atual. Portanto, você pode simplesmente alterar a data de publicação aqui. Está bem? Portanto, nunca chegue ao seu posto. Nunca chegue aqui para publicar, e então você pode alterar a data de publicação para outra coisa. Para se livrar do título de administrador, você precisa ir até a aparência. Tudo bem, desculpe, você tem que ir até os usuários. Todos os usuários. Abra isso. Então abra isso aí mesmo. Então, nome de usuário. E então o nome de usuário é esse e você não pode mudar seu nome de usuário, mas você pode mudar o apelido Então eu não quero isso. Então, vamos dizer como Brian, seja o que for. Em seguida, exiba publicamente ou exiba o nome publicamente como Brian ou qualquer que seja seu nome. Em seguida, anote aqui as informações biográficas como mencionei anteriormente, onde é como se você pudesse ter uma pequena descrição rápida do autor ali mesmo Em seguida, clicaremos em Atualizar perfil. E grades. Vamos revogar os sites e pronto. Então é assim que você muda seu nome. Você pode atualizar a data e colocá-la na categoria, isso é perfeito. Belo link interno para as páginas da categoria. 25. 25 Favicon: Como adicionar um fabricon ao seu site. Portanto, um ícone de tecido ou ícone de site. Essa coisinha está aqui na aba. Então, como você o torna personalizado em vez de ser o logotipo que enviamos e depois misturamos personalizado em vez de ser o logotipo que enviamos e depois misturamos ? Bem, isso é bem simples. Você pode usar o Canva para criar o gráfico e seu site navegando até as configurações e, em seguida, indo para a guia geral E aqui é onde você pode alterar o ícone do site e fazer o upload de um novo ícone criado por você. E mostra o tamanho aqui 512 por 512, pelo menos 512 por 512 pixels Vamos dar um exemplo rápido do Canva, tamanho personalizado, 512, 512, para criar um novo um exemplo rápido do Canva, tamanho personalizado, 512, 512, para design. E lá vamos nós. Então, temos um pequeno quadrado bem ali. Vamos digitar os elementos. Não sei, digite vlogging, vlogar é bom, vlogar é bom, Ok, ou vlog talvez seja melhor. Que tal digitar na câmera? Então, sim, seja o que for. Então, você só quer encontrar algum tipo de imagem ou gráfico que faça sentido para seus tópicos? Deixe-me uma bandeira e veja o que aparece. Sim. Ok, tudo bem. Agora, do ponto de vista prático, realmente deve corresponder ao design do seu site Então esse é o logotipo que eu criei para o meu site pessoal ali mesmo. Então, o tecido lá em cima está aquele símbolo Du ali mesmo, fundo circular, que é transparente. Então, novamente, depende totalmente de você se você quiser projetar isso. Então, se você quiser usar, tipo, um plano de fundo em estilo circular, basta navegar até aqui digitar um círculo. Tudo bem. Bum, e mude a cor ali, talvez faça com que seja azul. Então faça isso bonito e grande, desse jeito. Lá vamos nós. Tudo bem. Agora, posição. Queremos reverter isso. Ok, vamos colocar isso em prática ali mesmo. E sim, tudo bem, então nada mal. E agora queremos que seja uma imagem transparente para que possamos compartilhar e baixar, fundo transparente, baixar. E vamos salvá-lo na minha área de trabalho aqui. E vamos abrir esses sites e minimizar isso, minimizar isso. Vamos arrastar e soltar isso no lugar, alterar o ícone do slide e arrastá-lo para lá. Defina o ícone do site. Lá vamos nós. Clique em Salvar alterações. E então vamos recarregar o site. Aí está. Então, agora temos um pequeno ícone agradável. Então, para fins de tutorial, é assim que você o atualiza. Eu criaria algo um pouco mais personalizado, talvez como um VH ou qualquer outra coisa, mas você tem a ideia de como criar um ícone de site personalizado para seus 26. 26 SEO: SEO básico para seu site. Então, estamos chegando ao final deste tutorial. Então, como configuramos o SEO para um site? Portanto, na otimização de mecanismos de pesquisa, há algumas pequenas coisas que você só precisa conhecer. Então, primeiro na página inicial, aqui, nós a definimos como página inicial, separador de páginas Aprenda como aumentar sua renda, blá, blá, blá. E isso foi preenchido porque eu adicionei o slogan ali mesmo Mas podemos mudar isso. Não estamos presos a isso. Então, navegue até o Painel. Então você quer navegar até o Rank Math, que é um plugin de SEO que instalamos logo no início. E agora, quando tivermos o Rank Math aberto, queremos ir para Titles and Meta. E quando o Titles and Meta estiver aberto, você deve clicar na página inicial aqui E a página estática é definida como primeira página. Adicione a descrição do SCoTile em casa e o Meta na página inicial. Normalmente, você pode editar aqui, mas temos que ir até aqui para editar a página inicial Então, aqui é onde podemos definir o título. Então, como fazemos isso? Muito simples. Então, vamos clicar aqui, há uma pequena caixa que diz rank Math. Em seguida, clicamos em Editar trecho ali mesmo e podemos ajustar tudo aqui. OK. Então, em geral, com maioria dos temas para Wordpress, depois de instalar o rink Math, tudo o que você precisa fazer é clicar na página inicial, e aqui é onde você pode definir um título de SEO Mas isso está nos direcionando para a página inicial aqui. Então, basta clicar nessa pequena caixa lá em cima. Então isso aparece aqui, e é aqui que você pode alterar o título Portanto, deve ser algo como separador da página de título do site VoGHT, aprenda como iniciar um vlog lucrativo Em seguida, a meta descrição deve descrever do que se trata o site. Então, aprenda a criar registros melhores e aumentar seu público. Conselhos e guias sobre blogs. Sempre. Você também pode usar essa geração com IA, se quiser. De qualquer forma, gosto de Ds e parece bom. Clique em salvar, é assim que você altera o título de SEO da página inicial lá em cima Então vamos lá. Muda lá em cima, mas permanece o mesmo aqui embaixo Então aí está. Simples assim. Agora, você também precisa fazer isso com cada página individual. Então, a página Sobre como um exemplo rápido, podemos simplesmente abrir isso, clicar nessa caixa ali mesmo e, em seguida, editar trechos, então esta é a página Sobre, deve ser sobre log, Então, novamente, a mesma coisa. Escreva uma descrição e pronto. Então, a outra coisa que você quer fazer é também para postagens de blog. Então, com postagens de blog, você quer usar um título que não seja excessivamente otimizado e não seja rico em palavras-chave, mas algo que seja um pouco clicável, como a incrível verdade sobre Não sei, algo assim é um pouco mais atraente do que começar um vlog que gera dinheiro para sempre, em vez de começar um De qualquer forma, o melhor microfone geral para vloggers. Você quer clicar aqui, editar para recortá-lo, e então você quer se livrar do nome do site ali mesmo, e então digitar manualmente no Vlog how ou você pode simplesmente se livrar de tudo isso se quiser, e apenas ter o Mas eu normalmente gosto de usar o título e depois o nome do site. Se o título não for muito longo. Portanto, se o título estiver ocupando toda a seção aqui, basta deixá-lo. Mas se houver um pouco de espaço , normalmente gosto de ter o nome do site no final. E então você quer escrever a descrição ali mesmo e ajustar o link do permiano ali Então, você só quer acessar o site e, ao publicar páginas e postagens de blog em sua página inicial, certifique-se de que tudo tenha um título lógico de SEO que seja muito útil e descritivo para o visitante final 27. 27 toques finais: Ok, então agora você deve ter um bom entendimento sobre como criar um site com esse tema que seja bom, atraente, tenha uma boa cópia, seção de ofertas, cópia de vendas, páginas de postagem de blog, todas essas coisas boas Então, deixe-me voltar aqui para o meu painel do WordPress. E deixe-me abrir o editor, só para mostrar alguns pequenos detalhes finais que você pode ajustar se quiser Pessoalmente, gosto da aparência padrão desse tema, mas, novamente, você tem muitas opções aqui. Então, deixe-me mostrar brevemente como as coisas funcionam. Ok, então aqui em cima, temos estilos. Novamente, os estilos afetam todo o site. Portanto, se você quiser alterar um bloco individual, sempre desejará operar acordo com suas configurações. Mas aqui, estilos. Então, eu falei sobre isso logo no começo, mas acima de tudo, os estilos meio que mudam amplamente o site inteiro Se você quiser fazer isso e mudar a cor ali mesmo. Mas, novamente, você pode alterar cada um desses elementos individualmente, mas isso é para todo o site. Ok, então temos nossa tipografia lá em cima. É provavelmente a mais importante porque você pode alterar a tipografia do site Então, se você não gosta dessa escolha de fonte, você fica tipo: Como faço para mudar isso? Me deixa louco. Eu não gosto disso. Aqui em cima. Então, na verdade, você quer mudar seu texto e seus títulos. Texto significa seu corpo de texto, e seus títulos significam seu texto de bloco H um, h2h3 Então, quando você clica nesse elemento, ele diz H um ali mesmo. Isso significa literalmente rumo. Cabeçalho um. Então esse é o título da página. Então H dois é um subtítulo de H um, H três é o subtítulo de H dois, assim por diante Então, aqui com cabeçalhos, podemos mudar os cabeçalhos para outra coisa, se quisermos Tipo, isso é e vamos desistir disso. Então temos o texto ali mesmo. Então, podemos mudar o texto para outra coisa, se quisermos assim ou se estiver aqui. Essas são suas únicas opções, podemos ser cardo, Enter, qualquer outra coisa Então é assim que você muda a escolha e o tamanho da fonte, se quiser brincar com isso ali, e é isso mesmo. E, de um modo geral, você quer que suas fontes sejam parecidas em todo o site. Então, na verdade, suas tags de título H one, h2h, suas tags de cabeçalho são uma opção de fonte, então seu corpo de texto é outra coisa Então você não quer ter, tipo, uma fonte diferente para seus itens de menu e uma fonte diferente para sua H one, tags de título h2h, uma fonte diferente para seu corpo Para. Você quer ir com dois. Um estilo para seus cabeçalhos, outro estilo para o corpo do texto Se você precisar de ajuda para descobrir o que combina, você pode brincar com um site chamado par de fontes aqui E isso dá uma ideia de quais fontes combinam umas com as outras. Mas, novamente, você está muito limitado aqui com sua tipografia É isso mesmo. É um, dois, três, quatro, nenhum dos padrões Então, brinque com isso para ver se você gosta. Mas, novamente, você pode alterar o tamanho, aparência ali, torná-la mais leve, altura da linha e o espaçamento entre letras Portanto, você tem muita flexibilidade com o design aqui. Caso contrário, essa é a principal coisa que você provavelmente vai querer mudar com a tipografia Então temos cores lá. Cor, você pode alterar as cores da tinta interna do link. Então, quando você tem um link interno ou externo para outro site ou qualquer outra coisa, como Amazon ou YouTube ou qualquer outra coisa, é aqui que você também pode alterar a cor do link. Então, se eu tivesse um link ali, vlogs de viagem de alta qualidade, como esses Vamos pegar isso. Deixe-me colocar um link aqui para o YouTube como um exemplo rápido. Lá vamos nós. Vou ousar isso. E então a tinta ali é como eu mudaria essa cor. Então, e se você disser, eu não gosto desse preto. Eu não quero que isso seja preto. Então aqui, contrastando o preto, você pode mudar a cor e brincar com ela ali mesmo para mudar essa cor. Então, os links ali mostram como você muda as cores. Você também tem outras opções e gradientes com os quais pode brincar E, no geral, essas são as principais coisas que você deseja mudar. Biografia, seu H one, bloco h2h3, suas tags de cabeçalho e suas fontes de corpo, depois as cores para, por exemplo, seus links. Praticamente isso. E então sombras ali. Então você tem o layout. O layout é útil porque você pode ampliar o site se quiser e adicionar preenchimento E se você quiser adicionar uma imagem de fundo para todos os sites, você pode fazer isso aqui. E uma última coisa é que você tem CSS adicional lá embaixo e também blocos para que você possa personalizar a aparência de blocos específicos para todos os sites. Portanto, se você quiser personalizar esses blocos, para não precisar alterá-lo continuamente toda vez que o usar, basta alterá-lo aqui mesmo em todo o site E, novamente, como eu disse, CSS adicional está aqui. Então, se você sabe como codificar CSS e quer, onde eu insiro o CSS que eu quero adicionar. Cresça aqui mesmo no seu estilo. De qualquer forma, isso é tudo para este tutorial. 28. Valeu!: Tudo bem, pessoal. Isso é tudo para meu curso Skillshare sobre como criar um site e blog muito bonito e profissional de alta conversão com o tema 2024 do Wordpress Espero que você tenha gostado e espero que tenha extraído muito valor disso e tenha conseguido criar uma página inicial muito eficaz com um apelo à ação inteligente De qualquer forma, eu só quero agradecer e ter um ótimo dia. Tchau tchau.