Web design com o WordPress: desenhe e crie sites excepcionais | Derrick Mitchell | Skillshare

Velocidade de reprodução


1.0x


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

Web design com o WordPress: desenhe e crie sites excepcionais

teacher avatar Derrick Mitchell, Designer | Teacher | Artist | Innovator

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.

      Escolhendo sua plataforma: a diferença entre WordPress.com e WordPress.org

      6:07

    • 2.

      Desenvolvimento local x desenvolvimento remoto e sites estáticos x dinâmicos

      3:03

    • 3.

      Configure, faça login, configure, crie! (Instalação local do WordPress com Volante)

      2:50

    • 4.

      Revisando as preferências para acelerar seu fluxo de trabalho em “Local by Flywheel.”

      7:33

    • 5.

      Fazendo login em um site do WordPress

      2:37

    • 6.

      Configurando as configurações do WordPress

      8:06

    • 7.

      Páginas no WordPress

      5:38

    • 8.

      Crie um menu de navegação personalizado

      7:27

    • 9.

      Introdução aos plugins

      7:45

    • 10.

      Introdução aos widgets

      4:29

    • 11.

      Introdução aos temas

      4:16

    • 12.

      Temas recomendados do WordPress: onde encontrá-los e como escolher o melhor

      13:31

    • 13.

      Introdução aos construtores de páginas

      5:07

    • 14.

      Instalando e ativando temas

      6:20

    • 15.

      Temas infantis

      3:03

    • 16.

      Crie um projeto local: acelere seu fluxo de trabalho e elimine o trabalho redundante

      2:16

    • 17.

      Como redefinir uma senha de Blueprint em local

      3:47

    • 18.

      Instalando o conteúdo de demonstração

      2:56

    • 19.

      Introdução à criação de um site de portfólio

      6:12

    • 20.

      Como acelerar seu fluxo de trabalho com conteúdo de demonstração

      3:58

    • 21.

      Atualize o nome do site e remova o logotipo padrão

      3:47

    • 22.

      Como fazer um logotipo simples e personalizado

      12:58

    • 23.

      Como alterar fontes

      3:02

    • 24.

      Criando uma imagem principal da página inicial e cabeçalhos personalizados

      9:40

    • 25.

      Como configurar seu portfólio

      7:08

    • 26.

      Como adicionar vídeos em loop aos fundos do seu site

      15:38

    • 27.

      Por que adicionar um blog e o que é?

      3:39

    • 28.

      Configurações de blog no WordPress

      3:49

    • 29.

      Postagens no WordPress

      3:38

    • 30.

      Categorias e tags

      6:56

    • 31.

      Comentários no WordPress

      4:27

    • 32.

      Introdução aos formulários de contato

      4:46

    • 33.

      Como instalar o Formulário de contato 7

      6:00

    • 34.

      Configure suas novas configurações do formulário de contato

      7:50

    • 35.

      Uma alternativa mais fácil (mas não gratuita): Gravity Forms

      9:15

    • 36.

      Minha opinião sobre hospedagem e alguns recursos

      2:50

    • 37.

      EU AMO ESSES CARAS! Como configurar uma conta de hospedagem com o Flywheel

      9:42

    • 38.

      QUE ECONOMIZA TEMPO INSANAMENTE! Como empurrar/puxar seu site entre Local e Flywheel

      3:24

    • 39.

      Cliente real: introdução ao estudo de caso

      2:47

    • 40.

      Cliente real: primeiro, faça backup do seu site

      2:26

    • 41.

      Cliente real: instale o novo tema

      9:40

    • 42.

      Cliente real: configurações de temas

      4:00

    • 43.

      Cliente real: configuração do logotipo

      13:18

    • 44.

      Cliente real: configuração super rápida da página com modelos

      5:08

    • 45.

      Considerações finais

      2:04

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

871

Estudantes

2

Projetos

Sobre este curso

Crie sites e blogs do WordPress: especialmente para iniciantes, freelancers e designers gráficos que não querem codificar. 

O objetivo principal deste curso é ensinar qualquer pessoa, mesmo um iniciante, a configurar um site completo do WordPress de forma rápida e fácil.

Enquanto outros cursos ensinam todos os detalhes detalhados e complicados sobre como criar sites, este curso se concentra apenas naquelas coisas necessárias para colocar seu site em funcionamento da mais eficiente possível com belos resultados. 

Com ênfase em elementos de design, vou orientar você por tudo o que precisa para começar a criar um site no WordPress, incluindo como:

  • “Iniciar” novos sites do WordPress em menos de um minuto

  • Instale o WordPress no seu computador (Windows ou Mac) para que você possa aprender sem pagar por um domínio e hospedagem na web.

  • Baixe, instale e configure plugins do WordPress

  • Otimizar seu site para os mecanismos de pesquisa

  • Faça backup, exporte e mova seu site para um domínio e/ou hospedagem diferente

  • Criar páginas e postagens, e como entender a diferença entre as duas

  • Criar menus personalizados e sistemas de navegação que tanto os visitantes quanto os motores de pesquisa vão achar úteis

  • Proteja seu site no WordPress contra hackers e spammers

  • Faça backup do seu site do WordPress em caso de emergência.

  • Configurar ambientes de servidor e hospedagem da maneira mais econômica e segura

  • Crie e edite sites em ambientes de preparo e desenvolvimento

  • Migrar e transferir sites WordPress da encenação para a live e vice-versa

  • Usar alguns dos temas WordPress mais populares e versáteis disponíveis

  • Descobrir várias maneiras de trabalhar com vários temas e estruturas

Conheça seu professor

Teacher Profile Image

Derrick Mitchell

Designer | Teacher | Artist | Innovator

Professor

Hello! My name is Derrick, and I'm so stoked to be teaching here on Skillshare!

Are you interested in making a living in the creative arts industry as a graphic designer, freelancer, videographer, photographer, or web developer?

If yes, then be sure to join me in these courses here on Skillshare as I show you what it's like to be a graphic designer and make a living doing something that you love!

I will help you master the skills you need to become successful. I'll show all of my processes so you can accelerate your success, while also learning from my mistakes so you don't have to repeat them yourself and fall into the same traps that I did.

I have spent my entire career in the creative arts and marketing sector. I had the opportunity to work with br... 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. Escolhendo sua plataforma: a diferença entre WordPress.com e WordPress.org: Tudo bem, vamos falar sobre o WordPress agora. Há uma boa chance de você ter feito um pouco de pesquisa por conta própria, mas eu quero começar do zero apenas para colocá-lo em funcionamento e tipo de ajuda. Você entende a diferença, especialmente entre wordpress dot com, que vemos aqui à esquerda, e wordpress dot org, que temos à direita. Qual é a diferença? Bem, vamos conversar. Vamos falar sobre o WordPress. É um pedaço de código. É um monte de arquivos que compõem esta base para construir sites. Então, com o wordpress dot com, eles estão hospedando esse pedaço de códigos e arquivos para você. Eles cuidam de tudo, e é tudo presente embrulhado em bom e arrumado no wordpress dot org. Você obtém todos esses arquivos sozinho, mas você é responsável por instalá-los em um servidor. Agora muitos de vocês sabem o que é um servidor. Mas para aqueles que não o fazem, tudo o que o servidor é um computador chique. É só isso. Pense nisso como um computador que está sempre em algum lugar que serve seus arquivos. Seu site Pense em um arquivo é como um documento de palavras ou algo assim. Mas neste caso, é um arquivo HTML que seu navegador do site pode exibir. Então você tem o servidor, este computador que está sempre ligado. Então, quando alguém vai ao seu site, ele diz: “Oh, aqui está. Aqui está o arquivo que você está procurando. Então o que estamos fazendo com o wordpress dot org aqui à direita é que estamos pegando essa base que pacote de arquivos e colocando-os em seu próprio computador. Basicamente, você está alugando espaço de um anfitrião alguém como Go Daddy ou Blue Host. Há um monte deles. Falaremos sobre isso em um segundo com wordpress dot. Pense nisso mais como Facebook ou qualquer outro site. Você pode entrar em onde eles lidam com tudo. Você cria sua própria conta, mas eles cuidam de tudo o resto. Vamos falar sobre prós e contras. Uma das maiores prosa é que você pode criar uma conta e estar pronto e funcionando quase instantaneamente com wordpress dot com. Isso é excelente. Se você está apenas tentando chutar os pneus e você quer ver se este é o ajuste certo para você. No entanto, você notará muito rapidamente que existem algumas limitações com wordpress dot com. Vamos dar uma olhada na estrada rápido, vou clicar nesta guia de preços. E mais do que provável, se você entrar no plano gratuito, aqui estão algumas das limitações que eu quero chamar a sua atenção imediatamente. A primeira é que você vai ter um nome de domínio wordpress dot com. Então digamos que você nomeou seu site. Seria qualquer que seja o seu nome é dot wordpress dot com na janela do seu navegador. Isso é bom para brincar como um negócio ou profissional. Isso não vai funcionar tão imediatamente. Você vai querer fazer o nome de domínio personalizado, que coloca você no plano anual de criação de US $4 por mês. Isso não é grande coisa que é muito barato, especialmente para começar. Você também vai ganhar um pouco mais de armazenamento aqui em baixo, o que novamente é ótimo. Mas seis shows não é muito. Se você estiver indo para fazer qualquer coisa com vídeo ou fotos ou qualquer coisa mais do que apenas, você sabe, blog de texto, ele também irá remover os anúncios wordpress dot com, que é ótimo porque no plano gratuito, há serão exibidos novamente em seu site. Não é tão bom se isso vai ser algo que você está usando para o seu portfólio ou de forma profissional em tudo. Então vamos saltar um pouco mais para o plano premium. Isso é ótimo. Acrescenta mais espaço para nós. Remove esses anúncios. Você também pode rentabilizar seu site, e ele dá suporte à imprensa de vídeo. Para ser honesto, eu nunca usei esses, então eu não posso falar sobre o que isso significa. Vamos pular um pouco mais, , então ,por 25 dólares por mês, ganhamos muito mais. Podemos instalar plugins e enviar temas, e eu quero apontar isso para as extremidades inferiores e plugins Salling e upload de temas. Então, um plug in é um pacote de código que permite que você condene ou com seu site. Há muitos plugins. Por exemplo. Talvez queiras uma galeria para mostrar as tuas imagens. Você pode instalar um plug in e, em seguida, ter imediatamente funcionalidade para criar uma galeria ou talvez criar uma loja ou qualquer número de coisas que você vai querer fazer. Você vai descobrir muito rápido à medida que você começar, você vai querer adicionar mais ao seu site, também com temas. Agora, se você está pagando pelo prêmio, isso é novo. Você pode fazer upload de equipes antes que você não poderia fazer para combinar, você teve que escolher entre seus temas e há cerca de 320 que parece ótimo. Mas você provavelmente vai entrar nisso e querer ajustar as coisas aqui e ali. E a menos que você esteja pagando por esse plano mais avançado, você não pode personalizar nada. Então, se você é alguém que gosta de ter, alguém gosta de saber que você está seguro, que seus sites dizem se você tem pessoas para ajudá-lo. Se você tiver problemas, wordpress dot com poderia ser uma ótima opção para você, especialmente quando você está se levantando e funcionando. No entanto, se você estiver indo para estar fazendo qualquer tipo de personalização ou adicionando mais ao seu site do que apenas páginas para um blawg, eu recomendo que você mergulhe com wordpress dot org, que é exatamente o que estamos indo para mostrar a você neste curso. É toda a razão pela qual você se inscreveu aqui. A outra coisa é, digamos que você está fazendo isso por um amigo ou seus pais negócios ou seu negócio, ou você quer começar uma carreira como um desenvolvedor Web e um Web designer. Você pode muito bem apenas mergulhar no ecossistema do wordpress dot org porque você pode fazer o que quiser. Você baixar o pedaço de arquivos que a pasta Zip com todos os arquivos que fazem WordPress e é seu para fazer com o que quiser. Você pode atualizá-lo. Você pode modificá-lo. Você tem acesso a todas as linhas de código. Então, à medida que você progride como você quer adicionar mais ou personalizá-lo, ou como você continua a aprender, você tem controle completo, o que é um enorme bônus. A outra coisa é, se você está trabalhando para outra pessoa e eles têm uma idéia. Se você está no wordpress dot com, sua capacidade de mudar as coisas vai ser muito limitada, e eu posso garantir que se você está trabalhando para outra pessoa, eles estão sempre em ter idéias ou eles vão querer fazer coisas que estar em wordpress dot ou Deus lhe dará a liberdade para fazê-lo. Espero ter respondido a quaisquer perguntas que tenha tido entre wordpress dot com e wordpress dot org. Isso dá a você uma visão geral básica, e você continuará aprendendo mais à medida que avançarmos neste curso, mas espero que isso deixe claro para você onde você precisa ir. Então, no próximo vídeo, vamos falar sobre como levantar e correr rapidamente para que você possa começar a chutar os pneus . 2. Desenvolvimento local vs, sites remotos e sites dinâmicos: Tudo bem. Antes de seguirmos em frente, queria encontrar dois termos para você. O primeiro é estático e depois dinâmico. E como isso se relaciona com o que estamos prestes a fazer é que estamos construindo um site dinâmico. O que isso significa é que temos a base sendo WordPress, mas cada vez que você carregar uma página, ele fala dinamicamente com o servidor. Lembre-se, esse servidor é apenas um computador que você está alugando espaço, como vá papai, seu hospedeiro azul ou alguém. Assim, seu site solicita informações do servidor para construir o site. Então, digamos que você está adicionando uma loja ou um blawg. Seu site é dinâmico, pois você pode escrever sua postagem de bloqueio e está no site. E dependendo do que você disse a ele para fazer, que esse pedaço de código se construirá sozinho. Ele vai para o servidor e dizer: “ Ei, Ei, eu preciso deste post. Preciso dessa imagem e tudo isso acontece em uma fração de segundo. Mas isso é o que chamamos de dinâmica versus, digamos, um local estático. Se você é um designer gráfico, talvez tenha jogado com o Adobe Muse. Há um punhado de outros, ou talvez de volta no dia I Web se você é ah usuário Mac. Mas estes são todos sites HTML estáticos que basicamente eles são como eles são. Não há nada acontecendo entre o seu site não está falando com o banco de dados. Então, quando temos o WordPress, temos nossos principais arquivos principais. Mas então nós também temos o que é chamado de banco de dados e pensar nele como uma planilha do Excel é apenas cheio de dados que ele conecta em seus arquivos WordPress como o site é solicitado. Então, o que precisamos fazer para fazer isso funcionar é colocar os arquivos WordPress em um servidor. Falaremos sobre isso em vídeos posteriores, mas só para começar agora, funcionando rapidamente, vamos baixar um software que vai fingir que é um host. É um servidor virtual rodando em seu próprio computador, então isso é algo que é realmente benéfico por alguns motivos. A primeira é que é rápido porque não estamos esperando por uma conexão com a Internet para construir seu site enquanto você constrói seu site. Mudanças acontecerão imediatamente. Isso é realmente importante para os desenvolvedores como você está trabalhando através das coisas, mas o golpe é porque ele não está em um servidor real. Ninguém fora da sua rede, seu computador na sua frente, seremos capazes de vê-lo. Então, se você tiver um cliente que queira ver seu trabalho, não poderá vê-lo até que você envie capturas de tela ou compartilhe com ele de outra forma , ou talvez entre em pessoa para visualizá-lo. O segundo benefício para construir desta forma é que ele é realmente mais seguro porque o WordPress é dinâmico e está fazendo solicitações para o servidor. Pode ser hackeado, e isso acontece bastante, na verdade. Então, também cobriremos a segurança e como se proteger. Mas enquanto você está construindo seu site agora porque ele está apenas no seu computador e não está disponível 24 horas por dia para hackers tentarem entrar e fazer coisas, é mais seguro construir dessa maneira. Então, agora que você sabe o dia entre estático e dinâmico, vamos avançar com a próxima palestra e baixar um aplicativo para ajudar a colocar seu site em funcionamento 3. Configurar, de forma econômica (Instalação local de WordPress com (WordPress: Muito bem, esta é a melhor parte de todo este curso. Vamos fazer um site WordPress e vamos fazê-lo muito rápido. Então, quando terminarmos, aqui está o que vai ser capaz de acontecer. Você pode abrir este aplicativo que hospedará seus sites. Localmente, você clicará. Crie um novo site e você lhe dará um nome. Continue. Continue. Vamos em frente e adicionar o site. E assim abriu, coloque minha senha de administrador rapidinho. Este aplicativo irá construir seu site local e agora clique em exibir site. E Boehm, há o meu novo site WordPress literalmente tão rápido. Eu posso voltar para o aplicativo e clicar no botão de administração aqui e ele vai me levar direto para o site que acabamos de fazer Ok. E agora eu estou dentro do meu site WordPress totalmente funcional e isso foi em questão de segundos. Você pode ver que é o meu site dot Dev é o nome de domínio. Falaremos mais sobre isso em um segundo. Mas novamente, o que eu quero enfatizar aqui é que literalmente levou alguns segundos. Então eu estou mostrando isso agora porque eu quero que você entenda quando nós pulamos por alguns desses aros para fazer isso acontecer. Por que estamos fazendo isso. Então, agora que sabe que podemos fazer, deixe-me recuar apenas algumas coisas aqui bem rápido. Eu quero te mostrar. Quando comecei a construir meus sites WordPress, usei a senhora. Quando comecei a construir meus sites WordPress, Madame é um aplicativo gratuito que faz basicamente o que acabamos de fazer. É um pouco mais envolvido, mas é grátis e funciona muito bem. É o que eu costumava usar até, literalmente, uma semana atrás, quando descobri esse outro aplicativo. Man Pro é a versão profissional. Na verdade, isso é o que eu usei porque eu poderia hospedar vários sites e tinha muito mais sinos e assobios sob o capô. Se você estiver usando Windows ou Mac, você pode usar qualquer um deles e eles são ótimos. Ok, então a próxima coisa que eu comecei a usar foi o servidor desktop a partir do servidor de imprensa. Você baixar o aplicativo e não faz a mesma coisa novamente. Ótimo aplicativo. Mais rápido do que a senhora para mim. Eu realmente gostei de algumas das coisas sobre ele. E agora eu acabei de descobrir local pelo volante realmente descobrir isso estava pesquisando para este curso, eu queria mostrar a vocês algo que era simples e fácil de usar. E eu amo isso. Então o que eu quero que você faça é ir para ponto local obter o volante ponto com e o que nós vamos fazer é clicar neste grande botão de download gratuito. Agora, o download é de cerca de 500 megs. Então, venha aqui, clique no botão, escolha se você está em um Mac ou Windows, dê a eles seu nome e envie todas as informações por e-mail e clique. Obtê-lo. Agora, o resto é bem simples. Se você já instalou algum, tenha um aplicativo. Então, basta passar por isso, obtê-lo e correr dedo do pé onde você agora tem a opção para executar este local pelo volante. Então vá em frente e faça isso agora mesmo. Tudo pronto, e então na próxima lição, vamos fazer o que eu fiz foram realmente pisado através e criou um site WordPress. Mas vou mostrar-lhe mais opções e Maurer das preferências que você vai querer prestar atenção. Então, tudo bem, vá em frente e faça o download agora, e veremos na próxima lição 4. Reviewing preferências para acelerar o fluxo de trabalho em "Local por Flywheel.": Tudo bem. Espero que você tenha local por volante instalado e pronto para ir. Na verdade, se você é como eu, você provavelmente já criou um site e você já começou a clicar em botões e fazer suas próprias coisas, e você nem precisa mais de mim. Mas vamos em frente e dar uma olhada rapidamente em algumas das preferências. Eu só quero mostrar um pouco mais sobre este programa para ajudar a agilizar seu fluxo de trabalho Então a primeira coisa que quero mostrar é suas preferências. . Então venha até aqui para o título. Local pelo volante. Clique em Preferências. Isso se você estiver em um Mac. Se você estiver em um PC, acho que cabe editar as preferências. Eu não sei. Eu sinto muito. Você está meio por conta própria se estiver em um PC. Tem sido sempre, desde que eu usei um PC de qualquer maneira, Então, em minhas preferências, temos nossos novos padrões de site. Então, toda vez que você cria um novo site, esta é a informação que ele vai usar e onde ele vai salvá-lo. Então, a partir deste ambiente, o que isso significa é que tipo de codificação, linguagem e versões de banco de dados você está usando? Nem se preocupe com isso ainda. Este é um tópico avançado. Vamos deixar como preferimos. E o que isso vai fazer é, desde que seu aplicativo esteja atualizado, ele vai apenas configurar tudo para você por padrão. Então agora temos esse padrão de ambiente. Estamos usando esta versão PHP e esta minha versão de sequela. E mais uma vez, deixava-nos em paz. Nem sequer se preocupe com isso agora como você ficar melhor como você começa mawr desenvolvedor mente. E talvez isso nunca seja para você, mas você será capaz de escolher o que parece. Ok, em seguida, seu nome de usuário administrador, certifique-se de que ele não é admin. Essa é a pior coisa que você poderia fazer. É muito fácil ser hackeado se você colocar isso em seu site. Então vá em frente e reserve um tempo para tornar seu nome de usuário algo único. Talvez até adicionar alguns números, símbolos e outras coisas. A mesma coisa com sua senha. Reserve um tempo para se certificar de que você tem uma senha segura. Vá em frente e coloque o endereço de e-mail que você gostaria de usar. Isso é útil se você esquecer sua senha. Quando ela migrar isso, você pode fazer com que o WordPress envie o link de redefinição de senha para o seu e-mail. Então vá em frente e coloque seu e-mail de administrador lá e, em seguida, o caminho padrão dos sites. Aqui é onde vivem os arquivos. Então, se sobrancelhas agora, ele coloca todos os arquivos do site, na verdade, eles vão estar sob minha pasta raiz em sites locais, e então cada novo site vai ter sua própria pasta que vai ter todos os Arquivos do WordPress dentro dele. Então isso é apenas dizer onde salvar esses arquivos. Você pode colocá-lo onde quiser, mas onde quer que você colocá-lo, certifique-se de que você não movê-lo depois do fato porque ele pode quebrar links e causar muitos outros problemas. Então isso vai ser bom por enquanto. Vá e deixe o modo de desenvolvimento ligado. Eu tenho Como eu disse, eu sou muito novo para este aplicativo, então eu nem sequer fui capaz de usar isso o suficiente para saber se ligar ou desligar vai fazer muita diferença. Os formulários que eu li basicamente só disseram, deixe e esqueça. Então é isso que vou fazer. Temos algumas outras opções aqui para exportar blueprints avançados e adições. Honestamente, todas as coisas agora estão prontas para ir. Este é o cenário principal que eu queria mostrar a vocês. São estes novos padrões do site? Então eu vou clicar neste X aqui no topo, direito para fechar minhas preferências. E agora estou de volta à minha janela principal local. Posso clicar no site que já criamos, e podemos dar uma olhada em mais dessas opções. Estas são coisas que vão entrar novamente em uma data posterior. Só saiba que embaixo do banco de dados, lembre-se do slide que mostrei onde temos o primeiro slide que mostrou o curso desses arquivos principais. E então eu mostrei o banco de dados e o banco de dados é basicamente a coragem do seu site. É a planilha do Excel que tem todos os dados dentro dele para construir seu site. Bem, clicando aqui eu posso clicar em adicionar menor, e este é o meu banco de dados arquivos. Então aqui no canto superior esquerdo, eu posso clicar em exportar, e eu posso exportar todas as informações do meu banco de dados. Super simples de fazer isso. Isto vai ser útil mais tarde quando formos mudar isto e fazer outras coisas. Temos também utilitários RSS l e R. Em seguida, clique no site de administração ou podemos realmente visualizar o site. Ok, então eu sei que eu descubro isso, mas a razão é porque nós não precisamos nos preocupar com isso ainda. Eu só quero mostrar a você que você pode clicar em torno aqui para tipo de ver este mais recursos do seu site. Nós também podemos clicar nesta pequena seta aqui em cima, e isso vai nos colocar na nossa pasta raiz para o site. Ok, isso é tudo bom que estamos recebendo. Estamos levantando e correndo. Estamos nos preparando para ir aqui. A última coisa que quero mostrar antes de seguirmos em frente é esse botão de link ao vivo. Este é também um enorme porque naquele vídeo anterior onde eu mencionei os prós e contras para uma compilação WordPress local, este é um dos enormes contras é não ser capaz de mostrar aos clientes especialmente se seus clientes não estão na mesma cidade, É você? É difícil fazer upload do arquivo. Primeiro, você tem que exportar todo o seu banco de dados e você tem que carregar os arquivos principais e carregar a base de dados e atualizar os links e fazer um monte de trabalho apenas para deixá-los vê-lo. E então, se houver alguma alteração que você não quer trabalhar no local remoto, você tem que puxá-lo de volta para baixo e apenas fazer um monte de trabalho. Então, o que podemos fazer aqui com este botão de link ao vivo se eu clicar em habilitar ele me dá um link. Então isso está ligado agora no meu computador. Se você fosse para acessar este link, você poderia ver este site ao vivo agora. Agora, se você tentar, não vai funcionar, porque sempre que você provavelmente vai para este link, eu sou meu computador pode não estar ligado, e este aplicativo pode não estar aberto. Então, para que isso funcione, seu aplicativo realmente precisa estar ligado e em execução. Então aqui, este é um site em execução. Tem o verdinho ao lado. Isso significa que o servidor virtual está em execução. Eu posso pará-lo clicando no sinal de stop, e ele vai desligar o servidor e tudo o mais que ele precisa para executar. E o que vai acontecer se eu vir até aqui e refrescá-lo? Ele não funciona, então isso é mais provável, provavelmente o que você vai ver se você visitar esse link. No entanto, se você fosse, digamos que você fosse meu cliente e eu queria mostrar-lhe Ei, aqui está o site em que estou trabalhando e aqui está como ele está olhando. Eu ligava esse link, certificava-me de que o meu site estava em execução. Então, clique nesse botãozinho aqui, uma brincadeira. Mas agora meu site tem um círculo verde ao lado dele, me dizendo que é sobre os poderes em seu funcionamento. E se eu atualizar esta página agora, ela funciona. Então agora eu poderia ligar para meu cliente e nós poderíamos ter ou se é um encontro do Google ou uma chamada Skype ou uma chamada telefônica ou algo assim, e nós poderíamos percorrer o site juntos e olhar para o progresso. Então, este é um novo recurso incrível e super fácil de fazer. Você poderia fazer isso com a Mam, e você poderia ter sido capaz de fazê-lo com a versão de imprensa do servidor também. Para ser honesto, eu nunca fiz isso com eles, então eu me lembro que mamãe era um pouco mais difícil. Você não poderia ligá-lo assim. Portanto, esta é uma grande mudança de jogo para ser capaz de trabalhar localmente, ter essa velocidade enquanto você está desenvolvendo, mas também ter a flexibilidade de compartilhá-lo, bem como uma segurança. Então, quando eu desativar isso agora, eu teria que me preocupar com meu site ser hackeado ou qualquer coisa estranha acontecendo com ele antes que eu estou pronto para ligá-lo e ir ao vivo recursos tão, muito legal aqui. O que quero fazer agora é mostrar-lhe rapidamente. Agora, se você quiser fazer outro site, nós temos este em execução. Eu posso clicar neste botão mais aqui no canto inferior esquerdo e apenas adicionar outro site. O que você quiser que seja. Eu poderia continuar e novamente eu poderia continuar porque eu não estou preocupado em fazer qualquer configuração personalizada. E então isso vai puxar as opções padrão que eu defini nessas preferências. Clique em Adicionar site. Então agora eu tenho outro lado aqui, e é tão fácil assim. É super legal. Ir e tomar o tempo para jogar com um pouco, eo que nós vamos fazer no próximo vídeo é realmente começar a explorar WordPress 5. Registrando um site do WordPress: Vamos dar uma olhada em como fazer login no seu site WordPress. Agora já estou logado na lição anterior. Então o que eu vou fazer é vir para o topo direito sobre o meu nome e depois descer e clicar em Log Out. Agora que estou desconectado, há algumas maneiras de você voltar. Se você estiver usando o local por mosca vai aplicativo. Na verdade, é muito simples. Basta clicar no site em que você deseja entrar, depois aqui para a direita. Temos este grande botão de administração e eu vou clicar sobre isso e ele vai me levar direto para a minha página de login para WordPress safaris, lembrando minha senha. Então eu vou clicar nisso e ele entrar e eu estou de volta no painel. Não poderia ser muito mais simples do que isso. Agora, se você está tentando fazer login em um site remoto, digamos, digamos, em Go Daddy ou Blue host ou alguma outra plataforma de hospedagem, tudo que você tem que fazer é ir para o endereço do site, então neste caso é o meu site dot dev. Eu posso bater, retornar e ver o site ao vivo agora porque eu já fiz login nesta janela ele lembra que e tem este heads-up barra de opções de exibição em toda a parte superior. Agora, se eu estivesse realmente desconectado bem, muito tempo fora novamente e vamos voltar para o meu site dot Dev, nós só veríamos o site sem essa barra de opções na parte superior. Então o que nós vamos fazer é clicar no endereço da Web e no final dela em uma barra tipo que tem o ponto de interrogação nele. Faça login e pressione Return. Agora isto funciona. Isso funciona a maior parte do tempo, mas haverá alguns casos em que, por razões de segurança ou algum outro motivo para pagar e a versão do WordPress ou o software em execução no seu servidor, que pode nem sempre funcionar. Então, quando eu apertei Log in e apertei Return, ele realmente me redirecionou para este WP dash log in dot PHP link. É um pouco mais difícil de lembrar, mas se você for para isso para começar, você vai para o mesmo lugar e depois por último. Se fomos para o meu site ponto Deb frente barra Debbie P traço admin luz retornar, e que vai nos levar lá também. Como você pode ver, há muitas maneiras diferentes de acessar sua página de login. Meu favorito, claro, como eu disse, é apenas digitar aquele Ford slash e, em seguida, entrar no final. Então, apenas para recapitular, podemos clicar no botão de administração no local pelo volante. Podemos ir para o endereço da Web e no final digite Ford barra log in. Nós poderíamos digitar para frente barra WP traço admin ou poderíamos digitar na barra para frente WP dash log em ponto PHP. 6. Configurando configurações do WordPress: é hora de arregaçar as mangas e começar a trabalhar com o WordPress. Então eu vou saltar de volta para a minha vista. Vamos voltar para o lodge em processo que acabamos de aprender no vídeo anterior, e eu vou apenas mostrar-lhe uma breve visão geral do painel WordPress e, em seguida, algumas das principais configurações que eu faço cada vez. Então estamos no Wordpress. Parabéns por ter chegado até aqui. Espero que estejas entusiasmado com o que aprendeste até agora, e depois correu bem para ti. Agora o que vamos fazer é passar por algumas coisas rápidas no canto superior esquerdo. Temos qualquer que seja o título do site, você nomeou seu site. Então agora, porque eu chamo isso de minha visão. Este link diz a minha visão. Mas se você chamasse de meu portfólio incrível, diria que meu portfólio incrível. Isso sempre estará aqui quando você estiver logado para que possamos clicar na casa ou no texto, e ele vai falar. Vá e volte entre o seu site ativo e o seu painel de instrumentos, modo que esse é um lugar seguro para poder saltar para frente e para trás. Eu também poderia clicar neste botão site de visita. Mas faz exatamente a mesma coisa . Tudo bem. Então, no nosso painel, no lado esquerdo, temos um monte de coisas diferentes que você deve conferir. Agora, tenha em mente se quebrar alguma coisa. Bem, para começar, vai ser difícil quebrar qualquer coisa tão cedo. Mas se o fizeres, não te preocupes com isso. Porque, como você aprendeu, criar um novo site é muito, muito fácil. Se você está preocupado com isso, você vem aqui e clique com o botão direito do mouse em seu site e clique no botão clone e ele fará uma cópia do seu site para que você não tenha que se preocupar em quebrar nada agora. Na verdade, enquanto eu estiver aqui, vou fazer uma limpeza da casa e clicar em “Excluir vai apagar isso”. Outro site que eu fiz como uma amostra. Também vou pedir que mova os arquivos do site para o lixo. Assim eu não tenho nenhuma desordem no meu computador. Quando tudo isso é dito e feito Agora de volta no painel, Eu só quero executar algumas configurações que você deve estar ciente. Que eu mudo com cada site que eu construo, então o que eu vou fazer é descer o lado esquerdo em direção ao fundo. Temos este link para configurações. Posso clicar nisso. E agora vejo todas as subguias de configurações listadas abaixo dele. Vamos começar na guia Geral e podemos ver o título do nosso site. Você pode mudar para qualquer coisa que você quiser. E quando você fizer isso, ele irá atualizar nesta aba de menu acima aqui, bem como dependendo do tema que você está usando, ele irá atualizar o tema também. Então, por exemplo, quando eu vou comandar clique neste ícone home em um clique de controle do PC, o que isso vai fazer é abrir uma nova guia. E assim eu posso clicar aqui e ver o que está acontecendo sem perder meu lugar no painel. Então eu estou sobre esta aba e você vai ver este título. Diz a minha visão. Apenas outro site WordPress. Assim, alguns temas irão apoiar este outro que pode estar oculto, e pode ser reservado para uma imagem para o seu logotipo. Só depende do tema saltando de volta para as minhas configurações. Este slogan é algo que eu gostaria de tomar o tempo para criar algo que é significativo para o seu site. A razão é que, mesmo que o tema não exiba este texto ou você o tenha desativado no back-end do seu site, esse texto ainda estará lá, e o Google e qualquer outro mecanismo de pesquisa o verão. Então isso ajuda com a otimização do seu mecanismo de busca. Não é grande coisa, mas é algo que ajuda. Então, o resto parece muito bom. O que eu vou fazer agora é realmente certificar-me de que este endereço de e-mail é aquele que eu gostaria receber notificações para fins administrativos. Então, sempre que houver um novo usuário, ou talvez haja uma atualização disponível para o software ou qualquer coisa assim relacionada ao site, isso será enviado para qualquer endereço de e-mail que você colocar aqui. A outra coisa que mudo é o fuso horário. Então agora estamos na UTC mais zero. Vou mudar para UTC menos sete porque estou no fuso horário padrão da montanha. E assim, se eu tiver quaisquer posts blawg ou quaisquer atualizações que vão ao vivo ou quaisquer mensagens agendadas, elas serão publicadas com base no meu fuso horário. Se você quiser descobrir o que vezes em seu em, basta abrir uma nova janela do navegador e Google o fuso horário UTC m I em. E então, a partir daí, você deve ser capaz de ver. Por exemplo, estou no fuso horário padrão da montanha e diz UTC menos sete. Então foi assim que eu descobri isso. Quando eu terminar com essas alterações aqui na parte inferior, nós temos o botão azul salvar alterações, então certifique-se de clicar sobre isso antes de navegar para fora desta página ou você perderá suas configurações. Eu vou até a conta de escrita, e tudo aqui está bem. Normalmente não mudo nada aqui. Agora clique na guia de leitura, e isso é algo sobre o qual aprenderemos mais em futuras lições. Mas quero que saibas que é aqui que podes definir a tua página inicial. Portanto, atualmente as páginas iniciais são dinamicamente configuradas para serem nossas últimas postagens. Então, se eu voltar ao site e uma rolagem para baixo, você verá isso na página inicial. Este post hello World é o que aparece aqui, então qualquer que seja o post mais recente será apresentado no site e vai saltar para o topo. Podemos mudar isso e torná-lo uma página estática. Eu poderia clicar sobre isso, e se eu tivesse quaisquer páginas criadas, eu iria clicar sobre isso e, em seguida, selecionar qual página é a minha home page? Isso vai ser muito útil na estrada quando criarmos nosso site ainda mais. A outra coisa que você pode considerar que eu faço muitas vezes é desencorajado motores de busca de indexar este site. Então agora estamos construindo localmente. Isso não importa muito. Mas se eu estivesse trabalhando em um servidor e publicasse isso, não quero que o Google tire um instantâneo de um trabalho em andamento. E então talvez no final da estrada, uma vez que eu tenha meu site riel ligado, ele poderia estar exibindo pessoas de conteúdo desatualizado nos resultados de pesquisa. Então eu tento deixar isso ligado até saber que tudo está exatamente como eu quero. Vou seguir em frente e clicar, salvar as alterações aqui e, em seguida, em discussão. Porque o WordPress foi desenvolvido para ser um construtor de sites de blogs, ele tem ótimas configurações de discussão e ótimas opções de comentários, que é ótimo se você tem um site que você quer que isso aconteça. No entanto, se você tem um site que é um site estático ou seu site de portfólio, e você realmente não quer um monte de comentários de spam. O que você pode fazer é entrar aqui e desativar a opção para permitir que as pessoas postem comentários sobre novos artigos, então eu vou desligar isso e na verdade eu vou desligar essas duas opções está bem, e então eu vou descer aqui apenas no caso de eu acontecer para ter páginas que já estão para cima que eu possa não estar ciente de que têm que já ativado. Talvez isso tenha acontecido. Antes de desativar essas configurações, eu ativo o comentário. Deve ser provado manualmente. No mínimo, nada passa sem que eu veja para ser publicado no site. Vou rolar para baixo e clicar em, salvar as alterações novamente. Eu vou para esta guia de mídia só para que você possa vê-lo. Nunca fiz alterações a isso, desde que esteja configurado para organizar meus envios em pastas baseadas em mês e ano. Para mim, mantém as coisas limpas e organizadas no servidor. Mas novamente, tudo isso deve ser exatamente como você precisa. Eu não me preocuparia muito com isso ainda e, em seguida, último é Perma links. Os links Perma são basicamente a estrutura do link. Então este é o seu site? Você é do meu lado, Doc Dev. Por padrão, provavelmente será algo parecido com isso. Seria uma pergunta nojenta. Mark p é igual a 123 E o que é, É dizendo carregar o que quer que estas páginas e cada página que você faz no wordpress realmente tem um número, mas para os seres humanos é difícil lembrar o que é isso. Então eu gosto de usar a opção de nome do post. Então, se eu clicar nisso, qualquer que seja o nome da minha página, é isso que vai aparecer. Então, por exemplo, minha página sobre diria que meu site dot dev ford barra sobre Então é isso que eu vou fazer aqui é deixá-lo como Post Name vai rolar para baixo e bater salvar alterações. E agora meus links de permissão foram atualizados. Essas são as maiores mudanças que eu faço para cada site WordPress que eu faço quando eu criei pela primeira vez . Então o que eu vou fazer agora é ir em frente e pausar vídeo, e, em seguida, a próxima lição vamos aprender um pouco mais sobre como criar páginas e mais conteúdo em seu site WordPress. 7. Páginas no WordPress: neste vídeo, vamos dar uma olhada na criação de páginas e WordPress antes de o fazer. Só quero apontar uma coisa bem rápido. No último vídeo eu tinha você definir seus links Perma para Post Name, mas eu notei que através deste índice de ponto PHP lá também. Mas não queremos isso. Eu vou clicar na estrutura personalizada e apenas excluir esta parte aqui, este ponto índice PHP e na barra que eu excluo. E agora ele só tem uma barra percentual de postagem percentual barra. Vá em frente e faça isso e, em seguida, pressione Salvar alterações. Dessa forma, as nossas ligações serão muito mais limpas e simples. Ok, com isso feito, vamos pular e dar uma olhada em páginas e WordPress. Eu vou vir aqui na barra lateral e clicar em páginas, e você verá que temos uma página de exemplo por padrão. Ah, clique no título, que é o mesmo que clicar neste link de edição nos levará exatamente ao mesmo local. E você pode ver que temos o título da página. Podemos ver qual será o nosso elo Perma. E essa é a estrutura. Nós literalmente apenas mudamos Então agora, em vez de dizer meu site dot dev ford slash index dot PHP última página de amostra de PHP Ford Ele só tem essa página de amostra de barra. Posso mudar este link a qualquer momento. E onde isso é realmente útil é se você está fazendo uma promoção. Então eu tenho um monte de clientes que vão fazer coisas diferentes, como o mesmo correio de cartão postal que pode dizer algo como venda de outubro ou venda flash ou algum tipo de evento ou qualquer coisa que você possa pensar. Então o que você pode fazer é destacar este texto, qualquer que seja esta página, e você pode fazer o link o que quiser. Então, neste caso, talvez queiramos dizer venda. Ok, e agora, quando eu terminar, todos apertem este botão de atualização, e o que isso vai fazer é atualizar esta página no site. Então, se eu clicar neste link, eu posso ver o link real seria o meu site dot dep ford venda barra. Então, isso é realmente útil quando você está fazendo uma promoção impressa ou algum tipo de anúncio on-line. Você pode controlar o que é esse link, e isso é realmente útil para uma marca consistente. Vou voltar para aquela página. Vou deixar isso em paz. Só quero apontar mais algumas coisas. Então agora temos esse editor visual aqui, então nosso texto parece melhor. É o estilo que você pode ver. Tem o estilo de parágrafo aplicado. Podemos torná-lo ousado. Eu poderia adicionar indo para o topo disso. Talvez, uh, meu título aqui, clique no menu suspenso e dê um título apropriado para esse estilo e comece a se formar no meu imposto. Posso adicionar listas com marcadores. Eu tenho citações, uma linha, ele em links que podemos ler mawr. Eu posso até mesmo ta ir a opção da barra de ferramentas, que me dá mais opções como cores e coisas assim. Isso tudo é ótimo para ser capaz de digitar qualquer coisa que você quer e ver exatamente o que é . Também podemos adicionar mídia aqui. Então, se eu quisesse adicionar uma imagem nesta página, eu poderia apenas pressionar Return, clicar em adicionar mídia e, em seguida, selecionar um arquivo para o meu computador e nós vamos adicionar mídia mais tarde. Então vamos voltar a isso. Se estou no texto da sua opção aqui, você pode ver o gelo. Posso ver a marcação HTML. Então, se você está familiarizado com HTML, então isso é ótimo. Você pode mergulhar, arregaçar as mangas e realmente lutar com o código para ser exatamente o que você quer. Mas as chances são que se você é designer gráfico, isso parece muito estranho para você. Então você vai querer ter certeza de que você sair nesta guia visual. Por enquanto, isso é tudo o que eu realmente quero focar em alguém atualizar. Eu vou voltar aqui e o que eu quero mostrar é que há várias maneiras de adicionar novas páginas para a imprensa. Então vamos tentar o shopping. Então agora eu vou adicionar uma nova página clicando neste botão na parte superior. Vou chamar este de casa. Vou dizer a minha página inicial. Agora, aqui à direita, vou clicar em Publicar outra forma de criar novas páginas no topo. Temos este novo vir para baixo para página e clique página, e esta é outra maneira de adicionar uma nova página. Vamos ligar para este, e posso guardar isto como rascunho se quiser voltar a ele mais tarde. Dessa forma, ele realmente não publica no site ao vivo. Digamos que você está fazendo algo e você não estava pronto para enviá-lo ao vivo ainda. Você poderia guardá-lo como rascunho. Quando voltei às minhas páginas, podia ver que era o rascunho dele. Mesmo ao lado dele. Posso clicar em edição rápida. E em vez de abrir toda a página da página, ele vai abrir este menu de edição rápida onde eu posso alterar o status do rascunho Toe publicado em uma atualização de clique. E agora essa página estará ao vivo também. Uma outra maneira de adicionar uma nova página é abaixo desta guia páginas para baixo para adicionar novo para que você possa ver há algumas maneiras diferentes de alcançar a mesma coisa. Vou ligar para esta página de contacto, e desta vez vou apertar a pré-visualização. O que isso vai fazer é me mostrar uma prévia de como o site será sem realmente fazer uma alteração no site. Isso é útil se você estiver fazendo alterações de texto ou fazendo alterações em sua página, mas você não quer que todos os outros vejam ainda. Vou publicar. Eu vou voltar para todas as minhas páginas e você pode ver que eu tenho sobre contato casa e uma página de amostra. Agora, se eu for ao meu site, vou clicar aqui no título. Você vai notar quando eu rolar para baixo. Não consigo ver nada disso. Não há cardápios. Não há nada que me mostre as páginas que acabei de fazer. Então, no próximo vídeo, vamos dar uma olhada em como criar um menu personalizado para o seu site. 8. Crie um menu de navegação personalizado: Agora que criamos algumas páginas de exemplo e temos nossas configurações discadas, vamos dar uma olhada na criação de um menu personalizado nesta palestra. Vamos adicionar um menu a isso para que possamos navegar entre todas as páginas que acabamos de fazer. Vamos começar voltando para o meu painel e vamos descer para a aparência e menus Agora que você está aqui, vamos em frente e criar um novo menu. Então, no topo, ele diz, criar novo menu vai clicar sobre isso, e nós temos este nome de menu. Eu só chamo meu May Valete ou menu principal realmente não importa. Isto é apenas para você saber em qual menu é que você está trabalhando. Assim que eu tiver esse nome aqui, eu vou clicar em criar menu. Agora podemos dizer ao WordPress onde colocar este menu. A razão pela qual isso pode ser útil depende do tema que você está usando. Você pode ter vários locais para este menu ir, Por exemplo, você pode ter um menu de rodapé onde você coloca coisas como um F a Q ou coisas diferentes que você veria em um site e commerce como seus termos e política e coisas como que para talvez retornos de envio, etc. Também podemos colocar isso em nosso menu principal. Estes títulos aqui. Este local de exibição vai controlar onde isso aparece. Nem todos os temas têm os mesmos locais e não Ember. Todos os temas chamam-lhe as mesmas coisas. Você vai ter que usar seu melhor julgamento agora. Queremos que este seja o nosso menu principal. Isso vai colocá-lo como nosso menu principal em todo o site. Você também verá com este tema que temos o menu de links sociais e que vai colocar o menu em um lugar diferente. Isso seria se você estivesse tentando colocar, digamos, instagram Twitter vinculado ou coisas assim como seus links sociais para que você pudesse criar um menu apenas para isso. Então, agora que eu tenho o local selecionado, eu iria apertar Salvar menu muito rápido, e até agora nós não temos nenhum item de menu adicionado ainda. Bem, aqui à esquerda, você pode ver as coisas mais recentes que criamos, e o site ainda não é muito grande, então isso praticamente mostra todas as páginas que criamos. Você também pode clicar em Exibir tudo para ver todas as páginas que estão em nosso site. E se este for um site grande, talvez você precise pesquisar para que você possa clicar na caixa de pesquisa e realmente digitar a página que você está procurando. Descobri que geralmente deixando-o na aba mais recente funciona. Ótimo, porque o que eu acabei de criar é o que eu provavelmente estou tentando adicionar ao menu e ele vai aparecer aqui mesmo. Agora, eu posso fazer isso um de cada vez, ou neste caso, eu quero adicionar tudo a este menu. Vou clicar em Adicionar ao menu. E agora eu tenho meus links de menu. Se eu salvar isso e agora saltar para o meu site e atualizar a página. Você pode ver que esses links aparecem na parte superior. Isso é ótimo. Temos um bom começo agora. Notei que a página de amostra está aqui no canto superior esquerdo. Eu não quero mostrar a página de exemplo tudo e minhas páginas iniciais aqui à direita, e eu prefiro que ele esteja aqui em sua primeira posição. Vou voltar para o meu menu ou fazer algumas coisas. Então eu vou clicar nesta pequena seta para baixo no lado da página de amostra e eu vou clicar. Remover que irá apagá-lo para o meu menu. Mas ele não vai excluir a página do WordPress, modo que a página ainda existe. Se você tiver um link para ele em algum lugar à sua vista, isso ainda funcionaria. Mas, por enquanto , simplesmente não aparecerá no nosso menu. Agora eu vou fazer é clicar e arrastar este link inicial até a posição superior. E por último. O que eu quero mostrar é que você pode realmente aninhar itens de menu. Então vamos dizer que eu tinha o sobre Tab e eu queria, digamos, contato e um monte de outras coisas listadas abaixo dele. Eu posso arrastar isso para a direita e agora para ser um subitem. Às vezes é difícil obtê-lo exatamente onde você quer para que você possa clicar naquele giro para baixo novamente, e você pode fisicamente clicar neste para cima ou para fora do link que irá fazê-lo manualmente sem tentar deslizá-lo para a direita posição. A outra coisa que você pode fazer é, digamos, em vez de apenas dizer contato. Talvez queiras algo mais criativo, como dizer olá. Você pode fazer a etiqueta de navegação. E esse é apenas o título do link. O que quiser , não mudará a página. Nomeie o link que definimos na página ou o título da página. Isso só mudará o rótulo na navegação. Com essas mudanças feitas, vou apertar Salvar menu. Eu vou até a minha outra conta e apertar Refresh. E agora você pode ver que essas alterações foram aplicadas. Chegamos em casa na primeira posição. A página de amostra foi excluída e a guia sobre agora tem a nossa página sobre. Se eu clicar sobre isso, bem como a nossa dizer olá, página de contato aninhada abaixo. Vou fazer um ninho por enquanto e mais uma coisa que quero mostrar é que também temos outras opções. Digamos que, à medida que seu site fica mais robusto, você pode adicionar postagens diferentes em sua navegação. Você pode adicionar links personalizados. Digamos que você tenha um site específico. Você quer um link, Teoh ou podemos colocar esse texto aqui também. Adicione isso ao menu. Também podemos adicionar categorias diferentes. Então, digamos que você tenha diferentes postagens blawg ou postagens de portfólio. Ou talvez seus produtos como camisetas, etc. Você também pode adicionar a categoria inteira ao menu. Eu apertei, salvar menu e mais uma vez virá aqui e olhar para isso irá atualizar a página. E esses links agora aparecem. Temos o nosso post “Olá Mundo”. Temos o nosso link externo que atualmente substitui o que acabamos de clicar. Se você vai enviar alguém para um site externo, o que você pode querer considerar voltará para este link rápido de fluxo de trabalho que colocamos lá e não vemos as opções agora. Então eu vou fazer rolar até o topo e ver esta pequena guia de opções de tela. Vou clicar no menu suspenso. Eu vou adicionar link alvo e você também pode adicionar algumas outras coisas aqui também. Então, medida que você se torna mais avançado, você pode adicionar classes CSS para talvez alterar certos links que, digamos, um link. Você quer ser realmente detestável? Talvez seja um fundo vermelho ou algo assim. Você pode adicionar classes CSS a isso para ajudar a estilizar links individuais. Então, de novo. Isso está nesta guia de opções de tela. Clique para baixo sobre isso e eu ativei Link alvo. Então agora eu posso voltar para baixo para o meu link e eu posso clicar em abrir link na nova guia, salvar meu menu vai voltar para este outro para o nosso site principal. Vou atualizar esta página. E agora, quando eu clico nesse link, ele realmente o abre em um novo navegador. Certo, voltando ao meu menu. Vou em frente e remover este link. Vou remover o meu “olá World Post “, e vou deixar estes três como estão. Vou guardar o menu. E a última coisa que eu quero mostrar a vocês é que se vocês quisessem ter seu link na superior e na parte inferior, eu poderia colocar isso em ambos os lugares apenas tendo ambos selecionado luz salvar menu. E agora vamos ver onde esse tema o coloca. Eu vou atualizar a página e eu vou rolar para baixo apenas para ver e você pode ver que temos esses links sociais em cada um deles. Eu aposto. Deixe-me clicar nisso, correlacionar com a coisa com os três no topo. Então, vamos olhar para como estilizá-los mais tarde com os logotipos reais e as plataformas de mídia social com as quais eles podem estar relacionados. Mas pelo menos você pode ver como você pode atribuir seu menu a diferentes lugares em seu tema. Tudo bem, no próximo vídeo, vamos dar uma olhada nos plugins e como você pode adicionar ainda mais funcionalidades personalizadas ao seu site. 9. Introdução a plugins: Tudo bem, é hora de um pouco de diversão com plugins como eu mencionei em vídeos anteriores. Plug-ins ajudar a estender a funcionalidade do seu site Então fora do portão WordPress pode fazer um monte de grandes coisas e você já viu algumas dessas, tais como criar páginas. Faça menus personalizados rapidamente obter um site pronto e funcionando sem ter que codificar nada que é incrível. Mas o que acontece quando estiver pronto para mais? Vamos em frente e saltar para a nossa página de plugins aqui. Então, em nossa barra lateral vai para plugins, e este é o lugar onde todos os seus plugins vão viver uma vez que eles estão instalados. Atualmente, você verá que não temos nenhum. Então vamos em frente e procurar por alguns. Vou clicar nisto. Adicionar novo botão na parte superior, e estes são todos os plugins em destaque, então eu não tenho certeza de quem inventa isso. Mas estes são todos os plugins que o WordPress quer apresentar e para você ver, então este é um ótimo lugar para começar. Um lugar ainda melhor para começar seria clicar nesta guia popular, e a razão pela qual se baseia em quais plugins são populares no momento em que você está assistindo a este vídeo, isso pode mudar. Agora temos contato com o Formulário 7. Este é um plug incrível para criar um formulário de contato em seu site. Realmente? Basic faz o trabalho. Yost s CEO é um grande plug WordPress que vai ajudar a sua otimização motor de busca. Ele irá dizer-lhe se seus sites estão funcionando bem e como você pode adicionar mais palavras-chave para ser encontrado melhor. Jetpack é outro grande plug in. Isso adiciona muita funcionalidade ao seu site. Você basicamente cria um nome de usuário wordpress dot com para afundar isso com o seu site, e ele faz todos os tipos de coisas relacionadas a posts, otimização do motor de busca, compartilhamento social. Protegerá seu site. Poderia fazer reforços e muitas outras coisas. Definitivamente vale a pena conferir. Há muito mais aqui que o comércio é ótimo. Se você vai construir qualquer coisa que tenha a ver com comércio, seja vender bens digitais ou produtos físicos como camisetas, etc., este é o plugue e você definitivamente quer usar, e há muito mais. O outro que quero apontar é a palavra de segurança. Eu uso isso em todos os meus sites, e isso realmente ajuda a protegê-lo contra hackers ou de coisas diferentes que podem acontecer com seu site. Então, há muito Maurin aqui. Na verdade, há mais de 1000 páginas sobre 43.000 plugins diferentes que você pode escolher. Então, em um lago tão grande, como você escolhe o que é certo para o seu site? Como você começa a saber onde procurar? Bem, o que eu descobri é que você pode ter uma boa idéia para se ele é um bom plug in, com base em sua classificação, quantas classificações ele tem e quão recentemente ele foi atualizado. Alguns plugins como este plugue Yost foi atualizado apenas seis dias atrás. No momento desta gravação, alguns deles podem ser semanas, e alguns deles poderiam ser anos atrás. Então definitivamente estado para plugins que foram atualizados recentemente e têm classificações mais altas . Então o que vamos fazer agora é começar a adicionar alguns plugins. Vamos nos preocupar em formatar e configurá-los mais tarde. Mas por enquanto, o que eu quero fazer é apenas instalar, se você vai instalar este formulário de contato irá instalar o Yost. Se você está curioso sobre um Web Ah, conecte e quer saber o que ele faz, tudo que você tem a fazer é clicar neste link mais detalhes, e uma pequena janela pop-up irá mostrar-lhe a descrição do plugue em como instalá-lo. Quaisquer perguntas frequentes sobre isso. O registro de alterações, tanto quanto o que foi feito, o que foi atualizado ao longo do tempo com cada revisão, capturas de tela e comentários. Então esta é uma boa maneira de ter uma boa sensação, pois se isso é um plug in, você quer usar ou não, estamos dentro. Instale esta palavra aberturas de segurança e vamos ir em frente e rolar para baixo e ver se há mais alguma coisa que queiramos colocar aqui agora. Acho que isso é bom por enquanto. Então, vamos mostrar mais uma coisa que você pode fazer quando estiver pronto para adicionar mais plugins aqui em cima, certo? Enfraquecer a busca. Então, digamos que você está pronto para adicionar uma galeria de fotos ou talvez até mesmo instagram feed para o seu site enfraquecer tipo em qualquer coisa que você possa imaginar, e provavelmente haverá um plug in para isso. Então agora o que eu poderia fazer uma rolagem através e apenas obter uma compreensão do que plug in pode atender às minhas necessidades. Então, se eu quisesse exibir meu feed instagram em uma página, eu poderia olhar através e encontrar o gin play certo e minha escolha vai ser baseada em novamente a classificação mais alta, que todos têm mais instalações e qual foi atualizado mais recente. Então, enquanto eu percorrer, vejo que há um pouco de opções. Então, agora, isso está um pouco além do que eu quero mostrar nesta palestra, mas eu queria ajudá-lo a entender onde encontrar plugins. Assim, se você quiser tipo de saltar para a lagoa por conta própria e instalar alguns plugins, você pode fazê-lo. Então agora o que eu vou fazer é clicar de volta neste link plugins instalado na minha barra lateral. Se você não vir que clique na guia plugins e, em seguida, ele será padrão para esta página de plugins instalados . Então agora podemos ver quais plugins foram instalados em seu site quais estão ativos, e se houver alguma atualização, você verá um link para atualizar o plug in. Se você descobrir que quer se livrar de um plugging, é simples como excluí-lo. Ou você pode em massa, excluir ou alterar. Então eu posso clicar em múltiplos de cada vez, vir aparecer para ações em massa e que eles queriam mantê-los por perto, mas apenas desativá-lo . Então, eles não estão sendo executados no meu site. Eu poderia clicar, desativar e, em seguida, clicar em Aplicar. Por agora. Vamos em frente e clicar. Ativar apenas neste plug de segurança palavra cerca porque eu não estou pronto para fazer nada com os outros ainda. E assim que eu fizer isso, você verá que eu tenho essa atualização para a opção premium e eu posso ver detalhes. Mas a opção premium. Você começa mais sinos e assobios, tais como autenticação de dois fatores, Então o que isso vai fazer é quando você vai entrar no seu site WordPress, ele vai enviar um dedo código especial. Seja qual for o telemóvel ou dispositivo móvel especificado com um código secundário para iniciar sessão. Essa é uma ótima maneira de impedir que seu site seja hackeado é atualizar este serviço premium . Acho que é cerca de 40 dólares por ano. Não me cite sobre isso. Já faz um tempo. Eu, pessoalmente, não uso premium. Eu só uso a versão básica e faz um ótimo trabalho. Tudo bem. Agora, quando você ligar ou ativar um plug in novamente, estes ar ainda não ativo seus arquivos estão no meu servidor em uma pasta. Mas para realmente tê-los ligado e trabalhar com o site e integrar-se nesse código, você ativá-lo. Então nós apenas ativamos a cerca de palavras, e muitas vezes, quando você ativar o plug in, ele vai colocar um menu na barra lateral. Então, por exemplo, nós temos este menu de palavra fence na minha barra lateral agora, e eu posso ver que há um monte de coisas diferentes Enfraquecer Configurar aqui é Bem, eu vou apenas clicar no título da cerca de palavra, e Você pode fazer a turnê e ele vai me guiar por todas as características. Eu recomendo que você faça isso ou apenas clicou e a turnê, e você pode passar e verificar tudo por conta própria. Então nós ativar cerca palavra, definitivamente passar e dar uma olhada em tudo o que está acontecendo aqui por enquanto, As configurações padrão ar grande. Estamos prontos para ir lá. A outra coisa a prestar atenção é, às vezes, quando você configura um plug in, suas configurações podem entrar neste menu de configurações. Então agora, se eu passar o mouse sobre as configurações, você verá que temos equitação geral, discussão de leitura, mídia e links de permissão. Às vezes, essas configurações podem ser adicionadas a este menu. Às vezes eles são jogados no menu de ferramentas, e às vezes nós o colocamos em todo lugar onde você meio que tem que cavar e ver onde isso vai dar. Cada desenvolvedor plugging lida com isso de forma diferente. Você vai ter que tentar ler a documentação, dependendo dos plugins que você usa. E à medida que passamos por este curso e eu mostro o que uso para meus clientes, você terá uma melhor compreensão de onde procurar. Isso é sobre isso para plugins. Neste momento, medida que continuamos a construir MAWR, sites avançados ao longo deste curso irão percorrer algumas configurações de plug in diferentes e como usá-las em detalhes 10. Introdução a widgets: Muito bem, vamos aprender um pouco sobre widgets nesta palestra. Então vá em frente, vá para o painel e, em seguida, desça para a aparência e, em seguida, widgets em sua barra lateral. Aqui vamos clicar sobre isso, e você pode ver que temos a barra lateral de um blog. Temos um pé ou um e um pé ou dois. Estes são os widgets padrão que estou vendo com o tema atual que estamos usando. E aqui no lado esquerdo, podemos ver widgets disponíveis, então há um monte de coisas com as quais podemos trabalhar agora. Essa opção pode parecer diferente para você, com base no tema que você estiver usando. E se você instalou outros plugins que possam ter adicionado widgets adicionais a isso , por exemplo, por exemplo, tivéssemos instalado esse widget do instagram? Eu sinto muito. Instagram plug no widget pode ter aparecido aqui onde poderíamos arrastar e soltar isso em nossas áreas de barra lateral ou rodapé. Então vamos dar uma olhada em como isso realmente funciona. Se eu for ao meu site principal e estiver na página inicial, posso vê-lo. Meus posts ainda estão carregando, e por isso esta é tecnicamente uma página blawg e cada página blawg neste site. A barra lateral terá esses elementos para que pesquisar postagens recentes, comentários recentes e etc. Vamos olhar para aqui e você pode ver todos aqueles em formato de trabalho. Por exemplo, isso feito na área onde podemos fazer login, sair e verificar outras coisas. Vamos saltar de volta para aqui. Se eu clicar no giro para baixo em Mehta e excluí-lo, ele aparecerá imediatamente aqui quando eu atualizar a página. Então agora que fez uma área está completamente desaparecida. Onde widgets são grandes é que você pode fazer uma mudança em um ponto aqui nesta página widgets, e isso irá atualizar dinamicamente cada página em seu site. Então, em vez de ter que passar por cada página atualmente no site para alterar a área do rodapé , você pode fazê-lo em um ponto aqui, e ele fará essa mudança em todo o site. Então, por exemplo, digamos que eu quisesse adicionar meu logotipo à área da barra lateral do blog. Eu poderia arrastar e soltar o widget de imagem. Eu posso adicionar uma imagem clicando neste botão de imagem de anúncio, e eu tenho meu logotipo aqui. Você pode selecionar um arquivo do seu computador ou apenas o Dragon Drop passar o mouse sobre essa janela. Solte, e ele fará o upload do logotipo para sua biblioteca de mídia. Vou clicar em Adicionar widget dedo do pé aqui e eu vou clicar, salvar. E agora, quando eu atualizo esta página e todas as outras páginas blawg que eu visitar, meu logotipo agora fica no topo. Outro ótimo lugar é o rodapé. Você pode adicionar um menu personalizado. Vamos clicar e arrastar este widget de menu personalizado. Posso adicionar um título como o meu menu de rodapé personalizado e, em seguida, selecionar o menu. Agora. Fizemos um menu personalizado alguns vídeos de volta, mas você pode adicionar outro menu personalizado apenas para este rodapé. Talvez não seja para os seus laços sociais. Talvez este seja algo um pouco diferente. Você selecionaria esse menu. É salvar. E então, no momento em que você salvar isso, ele estará ao vivo em seu site para que você não precise, no nosso caso, ter essa janela aberta, então eu tenho que atualizá-la para ver a mudança. Mas qualquer pessoa que entrar no seu site depois de clicar no botão Salvar verá imediatamente essas alterações. Então aqui está o meu pé personalizado ou menu com esse menu que criamos para a navegação principal. Então, voltando ao nosso menu de widgets, eu vou excluir isso também e apenas mostrar-lhe, se você alguma vez quis dizer, salvar algo, mas alterá-lo temporariamente como, digamos que eu não quero este logotipo em aqui Por enquanto, eu poderia girá-lo fechado, clique e arraste, e Aiken escondê-lo aqui na área de widgets inativos, modo que vai mantê-lo fora de seu site. Mas ele permanecerá configurado da mesma maneira, mantendo essas configurações. Dessa forma, se você quiser trazê-lo de volta para o seu site, você pode. Se você tem um monte desses empilhados e você está pronto para limpar a casa, você pode clicar em limpar widgets inativos, e ele irá removê-los desta lista e excluir todas as configurações. E isso é praticamente tudo para widgets. Agora mesmo. Mais uma vez, quero dizer que isso mudará dependendo do uso do fêmur e dos plugues que você instalou. O que mais eles querem apontar é, se você instalar a grade de palavras, você pode estar recebendo esta notificação para clicar aqui, para configurar ou descartar. Se você não passou e aproveitou o tempo para passar por todas essas configurações, vá em frente e configure isso caso contrário, basta sentar, descartar por enquanto, e isso vai desaparecer para esta sessão. Tudo bem, isso é tudo para widgets. Então, na próxima lição, vamos dar uma olhada nos temas. 11. Introdução a temas: neste vídeo. Quero dar uma olhada rápida nos temas e dar-lhe uma breve introdução. Então vá em frente e vá para sua barra lateral e sob aparência. Clique em temas, e se você tem seguido ao longo até agora, dependendo de quando você assistir a isso, seu tema padrão é provavelmente 2017. Posso clicar, personalizar e personalizar as opções dentro deste tema, como O quê? Minhas imagens de cabeçalho. Se ele tem um fundo de vídeo, eu posso clicar nesta seta para trás e selecionar o menu que ele está usando. Eu também posso mudar se as primeiras páginas de uma primeira página estática ou, neste caso, meus posts mais recentes, e você vai notar alguma redundância essas configurações de ar que originalmente definimos de volta na área de configurações WORDPRESS principal. Dependendo do tema que você instalou, todas essas opções para personalizar seu tema serão alteradas com o tema 2017. Eu posso rolar para baixo e clicar na ferramenta de lápis, que vai me levar direto para o item de menu na minha barra lateral. Por enquanto, eu vou para x fora deste personalizador e eu estarei de volta à minha página Temas. Então temos alguns outros temas que foram instalados na minha instalação do WordPress , mas eles não estão realmente ativos. Então, se eu quisesse, eu poderia clicar em Life Preview para ver como isso mudaria a aparência do meu site. Se eu gostar, eu posso clicar, salvar, salvar, desativar E eles notaram que quando eu chegar ao meu site principal ao vivo e atualizar a página, ele terá mudado. Vou voltar para a minha página de Temas e digamos que você não queria os de lá e de novo. Eu gosto de manter as coisas o mais limpo possível para que você possa clicar na página de detalhes e aqui na parte inferior, direito, você clica em excluir, e ele vai realmente excluir e remover todos esses arquivos de tema do seu site. Então agora eu só tenho este tema 2017, mas vamos dizer que você quer passar para algo que se parece mais com você e sua marca. O que você pode fazer é aqui em cima. Temos a opção de adicionar um novo tema, vai clicar sobre isso, e há um monte de temas em destaque que você pode passar e verificar, bem como temas populares. Esta é outra ótima maneira, assim como nós procuramos por plugins para ver o que é popular, o que é tendência, o que outras pessoas têm usado ou o mais recente que tem sido a última versão de diferentes temas. A parte agradável sobre a área mais recente é que você provavelmente vai encontrar os estilos de design mais tendências e atuais nos recursos mais recentes. Agora, uma coisa que eu aconselharia você com qualquer um desses temas é que há uma boa chance eles serem muito bons. No entanto, como eles são gratuitos, você pode não ter o suporte para as atualizações que você gostaria de ter. Portanto, se você se comprometer com um desses temas ao longo do tempo, eles podem ficar datados e talvez não tenham tantas atualizações de segurança como um tema premium. Então o que eu vou fazer é pular de volta para a área popular de temas e rolar um pouco para baixo . E só para mostrar como você pode instalar um desses por conta própria, eu vou rolar e vejo esse tema principal. Vou em frente e clicar em instalar, então ele está instalando todos os arquivos no meu servidor, basicamente em uma pasta. Todas as imagens e pedaços de código que ele precisa para construir este tema assim como os plugins, embora ele realmente não ligá-lo ainda. Então, eu posso clicar ao vivo, visualizar e ver como seria esse tema no meu site. Mas ainda não está ativo. A partir daqui, posso alterar configurações diferentes antes de ativá-lo para garantir que há uma quantidade limitada de tempo de inatividade no meu site é possível. Ou eu poderia simplesmente clicar, salvar inativar e o tema será ativado imediatamente. Então, esta foi apenas uma breve introdução básica aos temas, principalmente para que você possa ver onde eles estão e como mudar a aparência do seu site. Tudo bem. A partir daqui, você tem uma boa compreensão de como configurar WordPress como adicionar páginas, plugins, plugins, widgets, temas e todos os tipos de coisas para levá-lo muito longe na estrada em seu site WordPress. Agora o que vamos fazer é mudar um pouco de marcha. Quero mostrar como usaria todas essas ferramentas e elementos diferentes que mostrei para criar sites para meus clientes na próxima seção. Vamos dar uma olhada mais avançada no design do tema e layout da página. 12. Temas recomendados para WordPress :: onde encontrá-los e como escolher o que é melhor: Tenho muito terreno para cobrir nesta palestra. Vamos falar sobre temas, mas há muito a saber e muito a considerar ao escolher o seu tema WordPress. Como você viu na palestra anterior, você pode baixar muitas opções diferentes que são gratuitas. Descobri, no entanto, que você terá melhor suporte e tipicamente melhor experiência com temas mais premium e comprar premium. Quero dizer que você tem que pagar por eles, então eu não espero que você tenha que comprar nada para este curso. Mas eu quero mostrar exatamente o que eu uso no meu fluxo de trabalho que eu realmente construir projetos riel para clientes reais com. Então, se isso é algo que você quer fazer mais do que apenas como um hobby ou de mais do que apenas seu próprio site pessoal, aqui estão algumas coisas a considerar. Primeiro, eu costumo comprar temas fritar no tema floresta dot net. Tentei muitos temas diferentes. Eu tentei um monte de mercados diferentes, mas os que eu estou usando atualmente todos vêm daqui. Então, se você vai para o tema força dot net, você tem esta guia aqui para WordPress E se você clicar em itens populares, esta página é constantemente atualizado e tipicamente classifica pelo que é o tema WordPress mais popular e mais vendido para a semana. Então você pode ver agora o número um é avada. Isso ficou no número um por um longo tempo. Durante anos, provavelmente há o tema X, e aqui em baixo é saliente. Estes são os três que eu usei e tenho uma vasta experiência. E só quero salientar que só porque as uso, não significa que sejam certas para ti. Eles são apenas aqueles que eu usei muito, e como eu os uso muito, eu sou rápido com eles. Eu sei onde os desenvolvedores colocaram todas as suas configurações. Lembre-se de como eu mencionei que nem todos usam o mesmo tipo de configurações e as coisas podem ser meio enterradas. Então eu tento encontrar os mesmos temas para a maioria dos meus sites porque acelera meu fluxo de trabalho porque eu não tenho que tentar adivinhar como fazer alterações. Então sinta-se livre para dar uma olhada. Há um monte de grandes temas que estão chegando. O que eu vou fazer muito rápido é segurar minha tecla de comando no PC novamente. Você poderia manter pressionada a tecla de controle, e eu vou clicar nesses três temas Nevada X e em Salient Só para que possamos dar uma olhada nessas opções, você vai notar imediatamente o preço $0,60. Há prós e contras que você poderia pensar. Isto é como, oh, meu Deus, $60. Por que eu gastaria $60? Ou você poderia pensar se você ou eu tivéssemos que tentar desenvolver tudo o que este tema faz do zero. Você provavelmente teria que gastar uns 100 mil dólares, talvez 20 mil. Eu não sei. Um casal 100 pode ser um pouco íngreme, mas seria muito dinheiro apenas para tentar e desenvolver toda a funcionalidade que essas coisas embalam. Então nós temos o tema Avada, e se você quiser ver como ele se parece, podemos clicar neste botão de visualização de vida. Ele abrirá uma nova janela do navegador e você pode percorrer e verificar algumas das diferentes configurações. Você pode conferir todos os diferentes layouts que ele tem e a única coisa que você vai notar imediatamente . Quando você entrar nesses temas mais robustos, premium lá quase exagero. Há muitos códigos. Os sites podem ser mais lentos com a animação, e eles tentaram explicar tudo sob o sol que você pode querer usar. Então, por causa disso, os temas tendem a ser mais inchados. Então isso é algo a considerar se você está tentando construir um site enxuto que carrega rapidamente, ou se você está tentando ter algo que tem todos os tipos de opções para você imediatamente fora do portão. Então eu vou saltar para o tema X e eu vou clicar em Visualização ao vivo. Agora, uma coisa que eu quero dizer sobre os desenvolvedores do tema X. Na verdade, fui a uma conferência em Las Vegas e conheci as pessoas por trás deste tema, e elas são ótimas pessoas. Adoro trabalhar com eles, e adoro apoiar uma empresa quando acredito no que estão fazendo. Então esses caras são ótimos. Eles têm um bom serviço ao cliente, e isso é novamente, algo que você não vai encontrar com o tema gratuito. Então, se você tem uma pergunta ou você fica perplexo, há um mercado de membros onde você pode fazer perguntas, e na maioria das vezes, alguém provavelmente já fez a mesma pergunta. E você pode encontrar soluções na forma. Dito isto, uma das minhas duas coisas favoritas sobre o tema X é este construtor de páginas Cornerstone. Então, um construtor de página é algo onde você pode literalmente arrastar e soltar os elementos em uma página . Então, em vez de tentar codificar, você pode realmente olhar para a página, arrastar e soltar e mover as coisas, e vamos falar sobre isso um pouco mais no futuro. Mas esta é uma enorme vantagem para este tema, bem como demonstrações, então você pode clicar aqui em baixo sobre as demonstrações, e eles têm uma tonelada de amostras para este tema. O que é ainda mais legal é que uma vez que temos isso carregado, você pode fazer com que ele instale automaticamente uma demonstração funcionando totalmente. E assim seu site pode ser construído insanamente rápido. Então vamos voltar e olhar alguns desses daqui a pouco. Mas algumas dessas demonstrações, por exemplo, se eu quisesse construir um site de ginástica, eu posso clicar em Demo, e este é um exemplo de site que eles construíram, e quando você está dentro do WordPress. Com seu site, você tem um tema instalado. Você pode clicar em instalar, e basicamente replicará esse site exato em seu servidor. Então, a partir daí você poderia borda imagens de estrada em seu próprio texto, e você seria um longo caminho abaixo da estrada e ter um site bonito da próxima vez que eu quiser pesquisar mostrar você é saliente. Vamos clicar em Life Preview. Eu realmente gosto deste tema. Acho que é muito escorregadio. Parece bom. Ele tem alguns grandes elementos de animação, e é realmente o que eu uso no meu site pessoal. Então, se eu for para a garagem do Mitchell, este foi o site que usamos para a nossa agência, e é bem básico. Quero dizer, não há muita coisa acontecendo, mas eu realmente gostei de trabalhar com este porque era simples de usar. Eu gosto de como ele era liso, e era basicamente basicamente, quero dizer, como designer gráfico, eu gosto de escolher coisas que parecem boas. Então foi assim que acabei com o Salient. Agora, uma coisa que eu quero salientar é com salient. Ele vem com outro tipo de layout de página para um compositor visual chamado Não é bem como eu não diria amigável, mas com com a pedra angular com X, você pode literalmente ver exatamente o que você está trabalhando com o compositor Visual. Não é tão intuitivo, mas gosto do estilo. Então, para ajudar você a entender melhor o que um plug de layout de página faz deixe-me mostrar-lhe isso. Vi recentemente um comercial para Divvy. Este é outro tema, e eu não tenho nenhuma experiência com ainda, mas isso parece incrível, e eu quero mostrar algumas coisas aqui. Primeiro, deixe-me reproduzir este vídeo para que você possa aprender um pouco mais sobre ele. Construir um site é como pintar uma obra-prima, exceto que não é nada como pintar uma obra-prima. Veja, quando você pinta algo, você pode realmente ver o que você está fazendo. Então, quando você desenha uma casinha, olha, há uma casinha. Mas quando você está construindo um site no WordPress, você está trabalhando no back-end com uma interface criada para a criação de conteúdo, não para design. Além disso, você não tem idéia de como qualquer coisa vai realmente olhar neste site. Difícil criar uma obra-prima longe. Última peça. Agora há Devi, com Devi você pode criar seu site WORDPRESS no site real em tempo real, então se você quiser adicionar um widget ou texto, vá em frente. Tudo é gota de dragão e forma totalmente personalizável, tamanho, cor da fonte. E com mais de 40 elementos de conteúdo diferentes, não há nada que você não possa adicionar. Então agora construir um site realmente é como pintar uma obra-prima, só que muito mais fácil. Divvy a maneira mais rápida e fácil de construir sites bonitos. Tudo bem, então parece que Divvy é definitivamente um candidato a algo que ajudaria a acelerar nosso fluxo de trabalho, e especialmente para aqueles que não têm experiência em codificação. Então, se você estiver interessado em brincar com ele um pouco mais, você pode clicar. Experimente de graça. E quando você fizer isso, vai abrir uma página de demonstração onde você pode literalmente chutar os pneus e ver exatamente como ele funciona. Assim, ao passar o mouse sobre elementos diferentes, você tem opções diferentes para como redimensionar as coisas e clicar e arrastar. É realmente fácil. Eu posso clicar em vermelho aqui e colocar em meu nome ou o que eu quiser atualizar e ver como isso vai funcionar para mim. Então esta é uma plataforma incrível. Estou realmente impressionado com isso. Mas novamente, eu não tenho nenhuma experiência com isso no mundo real, trabalhando para um cliente saber se ele vai atender todas as minhas necessidades. Mas novamente, olhando para ele, parece que vai ser incrível. Eu posso adicionar preenchimentos de fundo realmente fácil clique em qualquer clara quer hit. Certo, e assim, a seção de fundo mudou, então definitivamente vale a pena chutar os pneus. Agora o lado negativo para isso. Eu não sei onde você está em dinheiro, mas eles cobram $89 por ano, então isso é mais do que 60 e é obviamente mais do que grátis. Mas eu acho que você tem um grande valor. Uma coisa que eu quero apontar para $90. Basicamente, você pode ter acesso a todos os temas elegantes, temas. Ele tem acesso a todos os plugins, bem como atualizações de temas. Assim, à medida que as alterações de código ou os patches de segurança passam, você obtém acesso a tudo isso, bem como suporte premium. Parece que sou um vendedor para eles. Honestamente, eu não os conheço. Eu não sei. Você sabe que eu não tenho nenhuma experiência em primeira mão para saber isso. Não sou pago para te dizer isto. Só estou vendo o que isso poderia fazer por você. E uma coisa que eu quero apontar é que a razão pela qual eu estou considerando isso é porque eu acho que é realmente importante dar um passo atrás como um desenvolvedor ou um designer e continuar aprendendo e educando a si mesmo sobre as tecnologias mais recentes. As tendências vão mudar, e eu aposto que em um ano eu recomendaria algo diferente do Divvy. Mas a questão é, sempre aprendeu e tenta descobrir o que vai ser um bom ajuste para o seu fluxo de trabalho. Então, novamente, por US $90 vamos dizer que eu uso este tema duas vezes. Eu teria que gastar $120 se eu usasse o tema X, porque você tem que comprar uma licença para cada u. R L que usa o tema tão logo você tem para sites onde há basicamente $120 aqui. Ou como com Devi, eu poderia comprar o tema ou a assinatura por um ano, e eu poderia usar isso em 100 sites e só gastar US $90 por isso é um grande negócio Agora. Se você decidir que não deseja renovar, poderá manter todos os temas instalados ativos em todos os sites antigos. Eles simplesmente não receberão mais suporte premium, e eles não receberão nenhum patch atualizado à medida que eles forem divulgados. Então, honestamente, eu acho que é um grande negócio, e se você pode pagar, então definitivamente valeria a pena considerar e verificar isso. Agora a outra coisa que eu quero apontar com ex e mesmo com Avada e eu acho que com saliente, eu sei que o X parece ter mais extensões de qualquer maneira. Você pode obter extensão, então uma extensão. Basta pensar nisso como um plug in que é empacotado com o software com o tema. Então, por exemplo, como esta extensão de pedra angular, o plug convertido. O que isso faz é que você tem uma pequena caixa pop-up para um opt informar. Você pode fazer o conteúdo, Doc, que faz algo semelhante. Você pode fazer galerias e grades e no Google Analytics e a revolução Slider e um monte de coisas diferentes que vêm com o tema. Portanto, é um grande valor. Agora esta última evolução. Deixe-me falar sobre isso rapidinho. Uma coisa que eu quero apontar Enquanto você está olhando, que tema escolher, Considere o fato de que é basicamente uma base para seus gráficos e seu texto. Então, esta revolução de letras é basicamente uma galeria de imagens enorme ou controle deslizante de imagem que poderia ir em sua página inicial. Então aqui está um exemplo. Esta grande tela aqui é a evolução do Slatter. Então imagine se eu usasse o tema X ou vela entrou Devi ou qualquer outra coisa. Realmente? Tudo o que vejo agora na página inicial quando eu chegar aqui é apenas a navegação. O resto desta coisa toda é a evolução do Slatter. Então eu tenho essas nuvens animadas, as montanhas em camadas e o texto, bem como um botão sentado em cima. Então isso é algo a considerar. Agora eu estou entrando no arquivo de tema real neste estilo no layout, então tenha em mente que só porque você gosta do jeito que algo parece, vamos pular aqui em Devi novamente. Digamos que eu estou rolando por este site e você pode gostar de tudo, mas quando eu chegar a esta seção aqui e dizer, oh, cara, eu realmente amo isso. Se quebrarmos e olharmos honestamente, todos estes são Dragon deixou cair esta imagem aqui. É só uma imagem. Então, enquanto eu olho através dessas imagens diferentes que vieram deste site, é uma bela imagem. Há outra bela imagem. Digamos que tirei estas três fotos e as coloquei em qualquer outra plataforma. De repente, vai parecer exatamente o mesmo. Então, ao escolher seu tema, pense no que vai no back-end dele, que tipo de extensões você obtém e talvez como a navegação se parece por padrão, então você não precisa fazer muito estilo com ele. Então, pulando de volta aqui para a revolução do controle deslizante, aqui está outra amostra novamente. Este ocupa praticamente a tela cheia quando você chegar lá e há um monte de outros exemplos de uso que você pode ver. Então este vídeo está ficando muito longo, e eu não quero te sobrecarregar, mas eu acho que o que eu estou tentando mostrar é que há muitas coisas que você pode usar e seguir em frente. Talvez Devi seja uma boa opção para você. Eu vou estar trabalhando com os X e temas salientes só porque eu tenho um monte de amostras para mostrar a vocês e nós seremos capazes de começar e funcionar. E daí eu vou ser capaz de mostrar a diferença é para que você possa escolher o que funciona para você. 13. Introdução a construtores de páginas: Ok, Agora que você tem uma melhor compreensão de encontrar temas no mercado e tipo de ter um olhar para ele, eu quero ir em frente e mostrar a você o backend dos temas que eu uso. Só que você poderia ter uma idéia melhor de como seria se você comprasse isso. Então nós vamos começar com X com saliente, e então eu vou compará-los para dividir. Agora, eu descobri que de todos os temas que eu usei, o tema X parece ser o mais fácil para meus clientes usarem. Então isso tem sido uma ótima coisa para usar quando eu sei que vou entregar as chaves para outra pessoa. Por isso, se eles próprios vão fazer edições, deixa-me ir em frente e mostrar-te porquê. Então este é o tema X, e quando você vai editar uma página, você verá algo que se parece com isso. Isso é chamado de Cornerstone em seu construtor de página de temas ex. O que quero dizer com isso é, à medida que você passa o mouse sobre cada elemento, você pode literalmente clicar e arrastar e soltar para reorganizar ou clicar dentro para editar o texto que você verá no lado esquerdo. Temos todas as configurações diferentes para cada elemento. Eu posso clicar em uma seção aqui, e eu posso controlar coisas diferentes, como o alinhamento de texto ou adicionar imagens de fundo. Eu poderia até mesmo clicar em gerenciar layout e realmente facilmente clicar para alterar como as linhas são divididas em colunas com layout de coluna. Parece que eu poderia voltar para o principalmente aqui fora e ver essas seções principais, e Dragon deixou cair essas ou apertar o botão clone se eu quiser adicionar uma cópia de algo para mudá-lo. Então, para um cliente que não sabe como construir qualquer coisa com Web design, isso pode ser muito fácil, familiar e amigável para eles. Então é uma ótima opção. Eu sinto que os modelos que ele tem são um pouco limitados, e eu acho que no geral, no entanto, ele vai ajudar um cliente a começar a trabalhar porque não haverá uma quantidade esmagadora de escolhas. Agora vamos saltar para o tema saliente. Salient usa um construtor de páginas chamado Visual Composer, e se você for editar uma página, isso é o que parece aqui. Se eu clicar de volta no modo clássico, você pode ver que ele está usando um monte de códigos curtos, e isso não é super intuitivo. Então volte para a visualização do construtor de páginas, e isso é pelo menos um pouco melhor. Eu posso clicar e arrastar para reorganizar as coisas, mas eu realmente não tenho idéia de como isso vai parecer em uma página? Se eu clicar em pré-visualizar alterações, você pode ver que é realmente uma página bonita. E isso é uma coisa que eu realmente gosto. Salient é? É um tema muito afiada olhando, mas aqui está um pouco escondido Jim que torna este provavelmente o meu favorito é este pequeno botão modelo . Quando eu clico sobre este, Vela tem um monte de pré construído, seções muito bom olhar que você pode trabalhar com. Então, por exemplo, digamos que eu queria adicionar uma seção de heróis. Posso clicar aqui, e há um monte de tela cheia, o que chamamos de bloqueio de herói. Então vamos dizer que eu quero adicionar este mínimo chamado seção de ação vai clicar lá, e ele jogou para baixo na parte inferior da página para que eu possa clicar e arrastar para nos mover de volta para a visualização superior. Vamos pular para essa página. E agora eu tenho um completo com imagem de herói de altura completa, e isso foi muito fácil para Dio. Vamos voltar e adicionar outra seção. Venha ao meu modelo aqui e vamos adicionar apenas tipo de rolagem na Síria. Rápido, o que temos aqui. Que tal uma seção de biografia em tela cheia clicar nisso e a visualização em branco novamente saltaria para essa página. Como eu rolar para baixo, você pode vê-lo adicionado todas essas imagens de tamanho completo desta grade e novamente, apenas super liso, belas animações realmente fácil de trabalhar com. Então eu definitivamente, como saliente muito se você fosse trabalhar em seu próprio site como um portfólio, algo onde você queria parecer bem afiado e você não se importa tipo de arregaçar as mangas um pouco para descobrir alguns dos esta loucura aqui. Agora deixe-me pular para dividir de novo. Não tenho um site para mostrar que construí com Davey. Isto é relativamente novo para mim, mas parece ter o melhor dos dois mundos. O que quero dizer com isso é que você pode ver exatamente como vai parecer. Mas eu também posso clicar aqui. Isso seria fechado. Normalmente clique neste pequeno botão roxo aqui em baixo e, em seguida, clique em todo este pequeno botão esquerdo e eu posso mostrar a visão esquelética deste se eu quisesse arrastar e soltar em espécie de reorganizar as coisas. Então sinto que faz um bom trabalho. Hum, eu não necessariamente acho que ele tem os melhores modelos, tem alguns bons modelos, mas não como Celean faz. Basta clicar nele e ele puxa em todos esses belos modelos pré-construídos, que eu acho que são super úteis como você está aprendendo a construir melhor Web design. Então é isso que estamos chegando. Então, o que vamos fazer nos próximos vídeos, eu quero mostrar a vocês como eu instalaria o X, porque novamente, é uma ótima solução para clientes por causa de todos aqueles plugins e extensões incorporados que ele vem com, bem como muito fácil para os clientes descobrirem. Então o que vamos fazer é saltar sobre dois salientes e dar uma olhada em como construir um portfólio estelar novamente. Eu acho que salient tem melhores opções de portfólio em todos os temas que eu já vi até agora. E então, a partir daí, vamos continuar a aprender mais sobre locais de construção em geral com o WordPress. 14. Instale temas e ativando temas: nesta palestra, vou mostrar-lhe exatamente como eu compraria um tema da floresta Tema. Eu não espero que você acompanhe ou compre nada hoje. Só estou te mostrando isso porque isso é exatamente o que eu faria se eu fosse construir um site para um cliente. Então, em primeiro lugar, você precisa criar uma conta com tema forçado se você ainda não tiver. Já que já tenho um dos mais que ele entrou, vou mergulhar. Então tema floresta dot net. Eu vou vir aqui o WordPress e para baixo para itens populares porque o tema que eu quero é quase sempre nesta linha superior. É rápido e fácil. Se você não vê o tema X, você pode procurá-lo aqui em cima eu era X e bater em retorno e, em teoria, lá está ele, bem no topo. Então este é o tema que eu quero comprar hoje. Eu vou em frente e clique nesse link e eu posso clicar. Compre uma licença. Você vê, é $59 que eu vou clicar. Adicionar ao carrinho. Agora vamos para check-out e com o mercado no Votto ou floresta temática e como queremos Olhe para ele. É um pouco diferente se você apenas verificar com poder de pagamento. Eles realmente cobram uma taxa de manuseio de $2, então o total seria $61. Agora você pode usar um cartão Visa, e a mesma coisa se aplica que lhe dará uma taxa de manuseio de US $2. Ou você poderia fazer algo chamado de crédito Votto. Agora, eu tenho $3 sobrando de comprar assim no passado, mas o que você faria é vir até sua conta e descer para adicionar crédito, e então você pode adicionar uma quantia exata. Agora, por qualquer motivo, é no início de $20 sobe em incrementos de $10 para que você possa adicionar 60 ou $70 à sua conta. E assim não seria cobrada a taxa extra de 2 dólares. Mas você vai acabar como eu fiz com dólares extras na sua conta que você pode não usar. Então, de qualquer forma, seja como for, no entanto, você quer verificar agora, você pode adicionar crédito ou você pode verificar com essa taxa de manuseio de US $2. Eu vou voltar para o meu carrinho e eu vou clicar. Confira agora, Quando eu estiver pronto para ir, eu vou clicar. Confira com minha conta PayPal e a transação será concluída. Então eu já passei por isso. Vou para a minha seção de downloads. Então, uma vez que você comprou um tema, você verá tudo o que você comprou e você pode ver ter comprado várias cópias do tema X no meu dia. E o que você pode fazer é, uma vez que você tem isso, isso sempre estará em sua conta. Então, quando você estiver pronto para instalar este tema em seu site, venha aqui para este grande botão de download verde e eu vou clicar sobre isso. E eu tenho a opção de baixar todos os arquivos e documentação. E se você fizer isso, vai ficar assim. Você pega uma pasta zip e eu abro isso e você verá as extensões. E esses são todos os abside on Desculpe, todos os plugins que estão empacotados com este tema. Se vir o contrato de licenciamento, receberá um ficheiro XML com o conteúdo de demonstração. Então é assim que podemos importar todos esses sites totalmente acabados e totalmente funcionais. Você receberá esse arquivo de documentação, que mostra exatamente como instalá-lo, como ativá-lo. Todos os complementos, basicamente o manual do usuário. Se você sentir vontade de ler tudo, aprenda a usar X. E então, claro, este zip extra é o arquivo de tema real. Então, se você só queria isso e você já está pronto para ir uma vez que você começa a saber como fazer isso no futuro, você pode apenas baixar o instalar um arquivo Bill WordPress apenas, e isso vai baixar apenas esse tema regular Zip pasta. Tudo bem, é basicamente isso. Então vamos fazer isso. O que vamos fazer é saltar para o nosso local pelo volante. Eu tenho o meu site. Clique em admin para entrar na minha área de administração mira ao longo de duas aparências e eu vou clicar em temas. Agora eu posso clicar em adicionar novo aqui ou eu tenho este grande adicionar novo sinal de mais. Vou clicar nisso. Qualquer um deles vai funcionar muito bem. E porque nós compramos esse tema, nós realmente vamos fazer o upload da pasta zip. Então aqui no topo, eu tenho tema de upload e eu vou clicar lá e, em seguida, eu posso clicar para escolher o arquivo ou pelo menos em um Mac. Eu posso clicar e arrastar e simplesmente soltá-lo ali e eu vou clicar em Instalar agora. Uma vez que o tema é feito de instalação, eu posso fazer uma visualização de vida. Posso ativá-lo ou não posso fazer nada em troca da Página de Temas. E é isso que vamos fazer agora. E olha para isto. Ainda temos o tema demo que estávamos jogando com o Active, e agora temos o tema X pronto para ativar. Então o que vamos fazer agora é ir em frente e clicar. Ativar, tudo bem. Depois de ativar o tema, ele irá adicionar este item de menu na barra lateral e, provavelmente, redirecioná-lo para esta página . E vai dizer: “ Ei, Ei, você está quase terminando. Você só precisa colocar em seu código o seu código de compra para provar que você comprou isso, mas você pode fazer é ir sobre a floresta tema, e onde quer que você baixou esse tema, você pode clicar no certificado de licença e código de compra. Baixe isso e abra o arquivo de texto, e ele vai mostrar quem é licenciado para quem é o autor do tema o que foi comprado e, o mais importante, este código de compra de item. Então eu posso copiar este código e depois voltar para o meu tema e colá-lo aqui. Agora, você pode precisar gerenciar suas licenças diretamente dentro da conta de código de tema para que você possa clicar em learn mawr para realmente fazer um processo de validação de produto. Mas uma vez que tudo estiver feito, você não terá que se preocupar mais com isso. E então seu site será atualizado automaticamente e você terá acesso a todas essas outras extensões. Então o que eu vou fazer agora é ir em frente e pisar o código aqui e apertar Return. Vai verificar a licença. Parabéns. Meu site está agora validado e todos os bloqueios vermelhos agora ficam verdes e eu tenho um monte de bônus. Então eu tenho todas as minhas atualizações automáticas prontas para uso. Tenho acesso à base de conhecimento. Se eu ficar preso, posso fazer perguntas, ter o conteúdo de demonstração dele. Então eu posso rapidamente passar por aqui e adicionar qualquer um desses sites ao meu site, bem como todas essas extensões. Então, agora que você instalou o tema X, você estaria pronto para começar. Agora o que vamos fazer no próximo vídeo é falar sobre temas infantis. Sei que acabamos de instalar essa coisa, mas vamos fazer mais uma coisa que nos ajudará a dar a maior flexibilidade à medida que avançarmos . 15. Temas infantis: Certo, vou tentar explicar temas infantis se fizer um trabalho terrível, sinto muito, mas basicamente, aqui está o que estamos tentando alcançar. Temos o principal extremo que acabamos de instalar em nosso site, e agora queremos colocar um tema infantil. É basicamente um recipiente em branco onde vamos colocar qualquer coisa que queiramos substituir sobre o tema. Por exemplo, digamos que alteramos o layout de navegação ou alteramos as cores no tema. Se os desenvolvedores do tema X ir sempre lançar uma nova versão do site, o que eles fazem, que substituiria todo o nosso estilo. Então o que nós vamos fazer é criar nosso próprio basicamente muitos temas que irão substituir seu estilo. Assim, ainda podemos atualizar os arquivos do X Corps, manter tudo atualizado, mas não perder nenhum desses estilos. Espero que isso faça sentido. É muito mais fácil do que eu estou fazendo parecer, tenho certeza. Então vamos em frente e mergulhar, então eu vou para Theme Dot Co. Aqui é onde você teria sua conta de membros depois de comprar o tema e validar a licença e criar sua conta aqui, parte superior do clique no Apex. E como eu já fiz login, ele deve me levar direto ao meu painel. Assim que você tiver criado sua conta com o tema Co, eu posso baixar as versões mais atuais do tema X. Eu posso comprar outra licença ou eu posso rolar um pouco para baixo e eu vejo esta caixa de temas infantis . Eu vou clicar sobre isso e clique em baixar tema criança para que eles torná-lo realmente fácil de fazer novamente. Provavelmente parece assustador como estou tentando explicar isso para você, mas é bem simples. Então eu vou voltar para a minha área de administração de mira. Eu vou descer para a aparência e temas Clique sobre isso e você pode ver que ainda temos o extremo ativo e dar uma olhada nisso. Temos uma versão atualizada. Então, se eu tivesse estilizado tudo isso e eu cliquei em atualização, eu teria perdido esse estilo. Então é exatamente por isso que estamos fazendo isso. Então eu vou clicar, adicionar novo Eu vou fazer upload do tema e então eu vou arrastar e soltar esta pasta zip ex-criança que acabamos de baixar e clicar em Instalar Agora, uma vez que isso é feito, Amenah clique, Ativar e eu vou voltar e você pode ver agora que tudo parece o mesmo. Tudo o resto vai funcionar exatamente da mesma forma. Vou voltar à aparência sob temas e você pode ver agora que o tema ativo é este tema ex-criança e então eu tenho o principal extremo aqui. Agora você não pode excluir isso. Este tema filho só tem partes e peças deste framework X. Então isso ainda tem que estar na pasta do seu tema para que isso funcione. Se fôssemos feito com esses outros temas, por exemplo, este tema primário eu posso clicar sobre isso e apertar excluir e eu vou clicar em OK, e isso seria muito bom. Mas se eu deletasse esse ex tema, receberia uma mensagem assustadora dizendo que isso não está funcionando mais. Então, agora que temos nosso tema infantil feito no próximo vídeo, este vai ser um ótimo lugar para voltar ao nosso local por configurações volante. E eu quero mostrar-lhe algo que vai poupar seu tempo no futuro 16. Crie um texto local: Até este ponto, nós praticamente fizemos um monte de limpeza. Instalamos o tema. Criamos nossas configurações gerais, adicionamos algumas páginas menores e criamos um menu. Ainda não houve muita coisa que tenha acontecido. Todas as coisas que fizemos até agora vão ser universais, não importa o que você dija para qualquer site. Então este é um ótimo lugar para criar um projeto local por volantes. Então o que vamos fazer é basicamente criar um modelo. Dessa forma, toda vez que você cria um novo site, todas essas coisas que acabamos de fazer já estão feitas para você. Então, para fazer isso, é realmente muito simples. Tudo o que faremos é clicar com o botão direito do mouse em seu site e clicar em Salvar como Blueprint. Uma vez feito isso, você pode criar um nome de blueprint. Então este chama-se “minha visão”. Vou chamar isso de impressão azul do Derricks Main. Muito bem, muito criativo. Tudo bem, salve o projeto. E agora o que ele está fazendo é criar um blueprint para eu usar sempre que eu criar um novo site. Agora eu quero ir para fazer quaisquer novos sites. Tudo o que tenho que fazer é clicar. O grande botão gigante mais fará meu novo site clicar nas opções avançadas, e essa é a chave aqui. Quando criarmos um novo para o blueprint e aqui criar site a partir do Blueprint, vou clicar neste menu suspenso e escolher o nome do blueprint que acabei de criar e um clique criar site a partir do Blueprint. Agora o que ele vai fazer é realmente copiar todos os plugins, todas as páginas, todos os temas. Qualquer coisa que eu tenha feito neste site será um clone exato até este ponto. Assim eu posso mergulhar e começar a personalizar o site para cada cliente. Vamos dar uma olhada neste novo site. Vamos clicar ver site agora É em um novo site ponto Dev, e você pode ver o extremo está ativo. Tudo o mais que fizemos até este ponto, deixe-me fazer login e você será capaz de ver que nós temos a palavra fence plug in, instalado e rodando. Temos todas as nossas páginas que criamos os temas X já instalados, e esse blueprint está pronto para ser usado. Tudo bem, então certifique-se de ter um tempo para criar um projeto. Isso ajudará a agilizar seu fluxo de trabalho à medida que você continuar a criar mais sites. 17. Como redefinição de uma senha de Blueprint em local: este será um vídeo de atualização para mostrar como recuperar seu nome de usuário e senha . Se você criou um blueprint dentro do local, e então você não consegue lembrar o que é. Então, por exemplo, em um vídeo anterior deste curso, criamos um blueprint e abrimos uma captura de tela aqui para que eu possa ver suas configurações. Então o nome de usuário administrador era Derek. Mas e se não se lembrar qual era a senha? E se já passou algum tempo e você quiser definir um reset? Bem, a outra coisa que fizemos foi configurar nosso e-mail administrativo como e-mail Dev Dash no volante ponto local . Então, como não entrar no endereço de e-mail se eu queria redefinir a senha, então eu vou te mostrar como fazer isso rapidamente. Vamos apenas como uma atualização rápida. Vamos fazer um site de redefinição de senha aqui. Vamos usar a planta para saliente que criei mais cedo. Eu vou clicar em criar porque o que vai acontecer é que ele vai criar tudo vai chamar em tudo que nós configuramos, incluindo o nome de usuário e senha, então eu não tenho a opção de colocar algo novo lá. E então o que acontece éque vocêpode ter que você configurado vários blueprints com senhas diferentes ou nomes de usuário diferentes e não ser capaz de lembrar o que você usa. Vamos em frente e clique. Criar site a partir do Blueprint e ele vai extrair tudo e nos colocar todos configurados aqui . E agora vemos e nosso painel para este site. Vemos todas as configurações e clique em ver site, e definitivamente clonou tudo. Eu tenho o tema saliente em andamento e estou pronto para começar a construir. Mas se eu clicar no administrador para o site e isso me dá a opção de lei novamente, se você não consegue se lembrar de nada? Vou em frente e clicar na senha perdida. Ele vai pedir o nome de usuário ou endereço de e-mail. Então, neste caso, acontece que me lembro o que é isso. Mas vamos digitar isso e eu vou clicar em obter nova senha. Bem, o próximo problema é... Bem, onde é que esse e-mail foi? Como posso acessá-lo? Se não fosse, você sabe, meu e-mail atual que eu tenho acesso. Então o que vamos fazer é voltar aqui no painel e clicar com o botão direito nos utilitários. Vamos abrir um porco macho, e bem ali vemos o e-mail que veio do nosso reset. Então isso é ah, basicamente uma ótima maneira de obter acesso ao seu site se você esqueceu como ou se você está desenvolvendo seu site e quer ser capaz de testar formulários de contato em diferentes coisas de e-mail dessa maneira também. Então vamos clicar nisso, e agora eu posso ver que eu tenho meu nome de usuário e eu posso clicar aqui para redefinir meu nome de usuário e senha. Então vamos em frente e fazer isso. Só vou usar o que recomenda. Vai clicar em redefinir senha, vá em frente e salve-a. Ou talvez não seja o que for. Vamos em frente e logar. Não, não, é o Derek. E eu deveria ter guardado a senha porque agora eu não lembro o que era, mas aprenda com meu erro, e é assim que você faz. Vamos tentar isso mais uma vez. Vamos voltar aqui e clicar em Perdeu sua senha. Turner, usando o nome de novo. Clique fez nova senha e vamos voltar para o porco macho. Volte para a nossa caixa de entrada e temos uma nova de apenas alguns segundos atrás. Ou reiniciá-lo. E desta vez eu vou fazer as senhas da senha. Dessa forma. Não se esqueça disso. Nunca use essa senha. Vocês sabem disso. Tudo bem, vamos entrar bem rápido e ver se funcionou. Perfeito. Ok, Agora estamos em nosso projeto que acabamos de criar, e agora podemos começar a fazer alterações em nosso site. Tudo bem, pessoal, espero que isso tenha ajudado a esclarecer algumas coisas. Algumas das perguntas que tivemos sobre como entrar em seus sites de blueprint. E se você pudesse fazer mudanças. Uma outra coisa, eu quero salientar que você não pode criar ou editar seus planos O que você precisa fazer. Se vamos vir aqui para as preferências, até as plantas, posso apagar um esquema, mas não posso fazer alterações. Então, o que você tem que fazer é realmente fazer as alterações em seu site que você deseja dificar. E depois que você estiver pronto e feliz com isso, então volte para sentar no aplicativo local. e crie um novo blueprint com base nessas alterações. Espero que isso faça sentido. Pessoal, obrigado por assistirem, e veremos na próxima lição. 18. Instalando o conteúdo de demonstração: Então vamos em frente e usar o tema X para instalar um desses sites de demonstração. Eu vou em frente e criar um novo site, e vamos chamar este um x demo. Iremos às minhas opções avançadas e usaremos esse plano principal. Eu vou para a área de administração do site, e agora o que eu posso fazer é ir para a área principal de configuração X, descer para o conteúdo de demonstração e vamos apenas ir em frente e jogar com o site Jim. Vou clicar em configurar conteúdo de demonstração. Sim, prossiga. Isso vai assumir tudo aqui, e vai baixar todas as imagens e colocá-las dentro de sua pasta de mídia e configurar tudo para você para que possa levar um pouco de tempo para que todas as imagens baixadas. Mas assim que o fizerem, podemos ir em frente e clicar de volta no meu site, e você pode ver que temos este site de academia todo configurado. As navegações foram configuradas. Tem até um logotipo. Todo o texto funciona. Todos os links funcionam, e há até postagens personalizadas. Todos os tipos de coisas já foram configurados para você, então isso tem uma maneira incrível de começar e correr e ser capaz de chutar os pneus e verificar tudo bem. E sejamos honestos, acabamos de construir um site totalmente funcional e altamente dinâmico em menos de dois minutos. Isso é insano. Sei que demorou um pouco a chegar a este ponto. Mas digamos que você foi capaz de transformar isso em uma carreira e vender sites para outros clientes . Esses sites que estavam criando valem de 2000 a US$10.000 ou mais. Eu cobrei pessoalmente tanto dinheiro. Quando eu crio sites. Eu não estou prometendo que você pode ganhar esse tipo de dinheiro. Mas o que estou dizendo é que há valor aqui, Riel, valor tangível que você pode vender para seus clientes. Então este é um momento incrível para criar sites e fazer parte desse ecossistema online . Então eu fico muito animada. E eu só queria apontar para vocês que acabamos de criar um site totalmente funcional em nenhum momento, que ele retorne à discussão que tivemos sobre pagar por temas premium. Agora eu sei que muito do trabalho que acabamos de fazer foi basicamente feito usando local pelo volante. Eu entendo isso. Mas também importando esse conteúdo demo do X, e eu acho que divvy faz algo muito parecido. Então, claro, você pode ter que gastar $60 ou talvez até $90 para entrar neste mercado. Mas a barreira para a entrada é tão pouco quando você pensa que se você tivesse que codificar tudo isso do zero ou se criou, você pode estar gastando US $20.000 ou mais apenas para chegar onde estamos e o que fomos capazes de fazer sob um Alguns minutos. Então eu só queria apontar isso e trazer isso à sua atenção, porque esta é uma oportunidade incrível. 19. Introdução à construção de um site de portfólio: nesta seção, vamos nos concentrar exclusivamente na construção do seu portfólio, se todo este curso foi apenas para que você pudesse aprender a fazer WordPress para o seu próprio site. Ou se você quiser aprender como transformar isso em um show mais pago onde você está criando sites para outros clientes. De qualquer forma, um portfólio será o próximo passo para que você possa mostrar seu trabalho. Então o que vamos fazer é baixar o tema WordPress saliente porque eu acredito que este vai ser o tema mais forte para exibir um portfólio que eu já vi atualmente. Então você é bem-vindo para se desviar e fazer outra coisa. Mas aqui está como eu construiria meu site de portfólio. Vou começar pulando para a floresta temática, então vá para a rede Tema Forçado Dot e depois na bilheteria de busca. Digite saliente, e deve ser a primeira coisa que aparece. Vamos clicar neste tema, e se você ainda não seguiu junto com quando recebemos o tema X novamente, se você quiser fazer isso, adoraria que você acompanhe. Você não tem que fazer isso de forma alguma, mas novamente, é assim que eu fiz meu portfólio. Só quero te mostrar exatamente o que fiz. Então vá em frente e compre este tema se você estiver pronto para ele. Eu já fiz isso. E assim, na minha seção de downloads do meu perfil, eu tenho o tema WordPress saliente, e eu já fui em frente e baixá-lo. Então o que eu tenho aqui são todos os arquivos de documentação e instalação nesta pasta zip . Então, clique duas vezes sobre isso e abra isso. Eu tenho meu licenciamento sobre minhas informações de dados. Eu tenho o meu tema infantil, que aprendemos na última seção. Eu tenho meu guia do usuário, que é super útil para mostrar como instalar tudo. E então eu também tenho o principal tema saliente. Então, agora que temos todas as peças, vamos em frente e acender outro local. Então, vou saltar para o local. Vou clicar no botão de adição aqui para adicionar um novo site, e vou chamar isso de um plano saliente. Vou usar a planta que fiz na última seção só para começar. Mas se você se lembra, nós realmente salvamos isso com o extremo. Então ele vai ter todas as páginas que eu fiz, mas também vai ter todas as configurações configuradas da maneira que eles precisam ser, e vai ter o extremo. Então vamos fazer um pouco de limpeza aqui na atualização ou planta. Assim, temos opções para ambos os temas. Eu vou clicar em admin e eu vou saltar para a aparência e depois ir para temas e você pode ver que temos o tema X instalado. Vamos em frente e dar a este o tema saliente. Então, clique em adicionar novo upload parecer, e eu vou começar com o zip principal vela ian ponto. A razão pela qual eu começo com esse primeiro é porque este é o tema principal dos pais. Então isso vai ter tudo o que precisamos para o tema funcionar. E depois vamos fazer o tema da criança por último. Assim, quando tudo estiver pronto e me dá a opção de ativar, eu posso clicar, ativar, e esse tema infantil estará pronto para ir. Então, em vez de clicar, ativar desta vez vamos clicar em retornar aos temas. Vamos clicar, adicionar novo tema de upload e soltar esse tema filho lá Agora clique em Instalar, Tudo bem, e uma vez feito, vamos clicar em Ativar. E agora meu tema infantil saliente é o tema ativo. Então, vamos fazer um pouco de limpeza aqui. Temos algumas coisas para ver. Este tema tem alguns plugins que vêm com ele e que é necessário para que ele funcione. Então você tem que instalá-los. E enquanto estamos nesta página de temas, vamos em frente e limpar esses temas que não estavam usando. Então eu vou clicar em 2017 primeiro excluir clique em OK, clique no tema X. Ele vai bater, excluir e, em seguida, clique em OK, e eu quero mostrar-lhe algo muito rápido. Nota lateral. Se eu tentar ativar este tema filho sem um tema pai, você notará que recebemos esta mensagem de temas quebrados aqui porque novamente, o tema filho não funcionará sem os temas pai arquivados. Então, de qualquer forma, eu só queria apontar isso para você rapidinho para mostrar a você por que nós temos que ter os dois. Vamos reativar o tema infantil saliente e eu vou apagar os arquivos X aqui em baixo. Tudo bem, então agora os temas salientes estão prontos para ir. Vamos em frente e pular e vamos clicar nisso e começar a instalar o botão plugins. E embora ele queira que eu instale Woo Commerce, eu não vou usar isso para o site de portfólio. Então isso é extra e eu não tenho que instalá-lo. Você verá aqui que diz necessário para este compositor visual saliente e diz, recomendado para o comércio de rua. Então, novamente, sou um grande fã de não colocar mais do que você precisa, então não queremos desordenar nossos arquivos ou ter outros problemas que possam surgir. Então, não estamos recebendo comércio de restolho agora. Vamos clicar aqui e clicar em Instalar para o compositor visual saliente. E quando isso acabar, devemos estar em boa forma. Vamos fazer mais algumas coisas. Vou descer para a aparição e depois dois menus. E porque instalamos uma nova costura, preciso dizer qual menu usar. Já tínhamos o menu configurado, mas precisamos dizer onde queremos isso. Nestes temas específicos. Vou clicar no menu de navegação superior e clicar em Salvar menu. Agora, quando eu saltar para o meu site. Deveríamos ver que temos o nosso cardápio por cima. E, atualmente, tudo o resto está em boa forma. É óbvio que temos muito trabalho a fazer, mas esta é uma boa base e um bom lugar para salvar a nossa planta. Então o que eu vou fazer é saltar de volta para o local. Vou clicar com o botão direito do mouse no blueprint saliente e clicar em Salvar como Blueprint. Então, desta vez, para o nome do projeto, vou chamar este plano “O que salvou”. E agora, se eu quiser gastar um novo site com tema saliente, podemos clicar no novo botão de mais e depois adicionar o plano saliente para ele ou eu tenho meu esquema de derricks que tinha o extremo Se eu quiser ir por ali Este é um ótimo lugar para parar. Temos saliente configurado. Temos um novo blueprint criado para quando avançarmos e vamos fazer dentro A próxima lição é ver como importar parte do conteúdo de demonstração do salient para que você possa ver como tornar seu portfólio rapidamente 20. Como acelerar seu fluxo de trabalho com conteúdo de demonstração: Tudo bem. Obviamente, olhando para onde estamos até agora, não é tão impressionante. Então vamos saltar para o painel e eu vou mostrar-lhe como extrair conteúdo de demonstração com salient. Então, com o extremo. Se você se lembrar que tinha um pequeno X aqui em cima e você vai notar com salient. Ele lança seu próprio menu meio caminho para baixo na barra lateral. Então, outro indicador de como diferentes desenvolvedores pensam de forma diferente quando criam seus temas. Então você pode clicar aqui ou mergulhar diretamente em um dos itens do submenu. Se quiser, vamos ao Demo Importador. Então, clique nisso. E agora você pode ver que temos muito conteúdo de demonstração que podemos trazer para o nosso site. Na verdade, há um monte de ótimas opções, então definitivamente tomar o tempo para conferir essas opções. O que vamos fazer agora, no entanto, é importar este portfólio mínimo. Então vá em frente e clique em importar demonstração e clique em OK, e o que ele está fazendo agora é realmente baixar qualquer imagem e todos os arquivos de conteúdo que ele precisa para criar esta demonstração para que ele possa extrair algumas imagens de fundo. Mas eu notei algumas das imagens ar apenas espaço reservado cinza. Então, novamente, dependendo da velocidade da sua Internet e do Demel em que você clicar, pode demorar um pouco. Pode ser muito rápido, então vamos deixar esse tipo de fazer sua coisa bem rápido, tudo bem. E uma vez feito isso, podemos voltar para o site principal e veremos que a navegação que tínhamos originalmente configurado está funcionando. Você notará, embora a página inicial não pareça correta, e nenhum outro ainda. Então vamos dar uma olhada por que eu vou voltar para o meu painel de controle. E primeiro vamos descer à aparência e depois aos menus. E agora você vai notar que eu tenho selecionar um menu para editar. Se eu clicar nisso, há outro menu aqui agora. Então ele trouxe em seu próprio menu para o tema, então eu vou clicar no menu portfólio mínimo. Ah, clique em selecionar, e agora que será o menu Aqui na minha estrutura de menu, eu vou rolar para baixo e eu vou escolher este menu de navegação superior e pressione Salvar menu. Agora ele voltou para o site principal, e você notou que nossas páginas estão corretas agora. Então, se eu clicar na página sobre é o real sobre a página para o nosso tema, mas observe. Temos todos esses códigos curtos e todos esses disparates, então vamos dar uma olhada nisso. Vamos voltar para o painel e esses são os plugins. Vamos ver o que está acontecendo lá. Então o que precisamos fazer é que eu ainda tenho alguns restos do outro projeto. Ainda temos este plugue de pedra angular. Vamos desativar que isso era uma coisa de ex tema. Eu vou em frente e acerto. Excluir Clique em OK em. O compositor visual saliente está instalado, mas ainda não está ativo. Então vamos clicar, Ativar E agora vamos dar uma olhada no nosso site. Clique na página sobre que parece muito melhor. Vamos clicar em nossa página de contato, e isso parece muito melhor também. Então agora vamos voltar e vamos para nossas configurações e, em seguida, ir para baixo para ler e vamos desligar o seu post mais recente na página inicial e, em vez disso, torná-lo uma página estática. Clique sobre isso e vamos escolher o nosso portfólio Home Dash Minimal e vamos clicar em salvar alterações. Vamos voltar aqui e dar uma olhada e isso parece muito melhor, tudo bem, então você pode ver imediatamente que este é um portfólio bastante impressionante. Ele tem algumas animações realmente sutis que parece que se eu arrastar minha janela menor, você pode ver que é responsivo, o que é incrível. Muito bem, estamos um passo mais perto do nosso portfólio. Então, agora vamos em frente e aprofundar como personalizar nosso site no próximo vídeo. 21. Atualizar o nome do site e remova o logotipo padrão: Agora que temos este belo site e o conteúdo de demonstração instalado, vamos começar a torná-lo nosso. Vou começar com o logo só porque é uma vitória simples. Se você não tem um logotipo, tudo bem. No próximo vídeo, vou mostrar-lhe uma dica rápida sobre como criar algo que irá atender às suas necessidades à medida que você começa . Mas, por enquanto, vamos em frente e saltar para o painel do nosso site quando estivermos lá a meio caminho . Como estamos usando o tema saliente para esta demonstração, todas as opções salientes nesta aba personalizada aqui. Então temos nossas configurações gerais e todos os tipos de coisas, e é aqui que a maior parte do seu estilo vai acontecer. Se você estiver usando esse tema, dependendo do tema usado, provavelmente verá algo como isso ou sob aparência. Você pode ver personalizar, e você pode ir lá também. Então isso é algo onde você vai ter que fazer um pouco de pesquisa e descoberta por conta própria. Mas novamente, quando você compra um tema ou baixamos um tema, eles geralmente têm documentação. Então, de novo, é aqui que eu começaria. Eu vou vir aqui e você pode começar a clicar ao redor e apenas explorar todas as opções diferentes e literalmente apenas começar a clicar nas coisas e bater. Salve alterações, volte para o seu site e veja o que ele muda. Então é aqui que você vai ter que passar algum tempo se familiarizando com o tema que você está escolhendo. Por enquanto, vamos pular para o logotipo, e acontece que eu sei que isso está sob a guia de navegação do cabeçalho. Então eu vou clicar lá e você vai ver sobre esta aba para logotipo e estilo geral. Então, se você tem um logotipo, tudo que você precisa fazer é clicar neste botão de upload e jogá-lo lá em cima e clique em Selecionar aqui e então ele estará lá. Em seguida, você pode adicionar uma versão retina onde é exatamente duas vezes o tamanho do seu logotipo. Para os monitores de alta densidade, você pode dizer exatamente quais alturas serão. Há algumas outras configurações que você deve saber sobre aqui, mas novamente, apenas tipo de percorrer e ver o que ele faz quando você estiver pronto pressione salvar alterações e seu logotipo estará ativo. Agora, se você não tem um logotipo. Basta clicar no botão de desligar. Aqui vamos clicar, salvar as alterações. E agora quero manter o meu lugar aqui. Não quero perder o que estou trabalhando, então vou manter pressionada a tecla de comando em um Mac. Você pode manter pressionada a tecla Control no PC e, em seguida, clicar que abrirá uma nova guia para você. Isso é realmente útil porque então eu posso ver as mudanças que eu fiz neste caso. Eu tenho o meu site como o título em vez de um logotipo. Mas eu também posso saltar para trás onde eu tenho essas mudanças acontecendo. Assim, eu posso alternar rapidamente as coisas ligado e desligado ele salvar as alterações, recuperado de volta para a outra guia. Refresque. Neste caso, eu normalmente apenas apertar o comando estão em um Mac. Eu acredito que o atalho é F cinco em um PC, mas seja o que for, basta atualizar a página e você pode ver essas mudanças à medida que elas acontecem. Então é assim que você mudaria o logotipo. Muito simples de fazer isso vá em frente e comece com isso. Agora, se você tem que dizer, vamos em frente e desligar isso, vamos salvá-lo voltar aqui. Poderia comandar agora? Diz “Minha visão”. Digamos que você queria que ele dissesse outra coisa. É uma mudança rápida. Vamos voltar para o Dashboard. Vamos até Configurações gerais e o título do site. Vamos mudar para qualquer que seja o seu nome e vamos fazer o slogan meu costume. Na verdade, vamos fazer assim. O portfólio de design gráfico virá até aqui e acertará as alterações salvas. Voltar para o site da vida quando você vê que agora ele tem meu nome no canto superior esquerdo. Tão simples de fazê-lo Vá em frente e faça essa mudança agora em seu site. Se você estiver acompanhando e na próxima lição, mostrarei uma dica rápida sobre como criar seu próprio logotipo personalizado para entrar aqui se você ainda não tiver um 22. Como fazer um logotipo simples e personalizado: Se você já tem um arquivo de logotipo com o dedo do pé, fique à vontade para pular este vídeo. No entanto, vou mostrar-lhe algumas dicas que podem ser úteis na estrada, não importa em que esteja trabalhando. Então o que eu vou fazer é tirar uma foto de uma assinatura falsa em um pedaço de papel branco . Eu só desenhei com um marcador de Sharpie. Eu uso meu iPhone para tirar a foto, e essa é a foto que eu tirei dela. Bastante básico. Bastante simples. Sinta-se à vontade para desenhar seu logotipo ou esboçar seu nome ou o que quiser fazer, mas simplifique. Faça isso rápido. Então o que eu vou fazer com isso é ir em frente e pegar a foto que eu acabei de tirar e compartilhar realmente usei o airdrop em um Mac. Mas você pode enviá-lo por e-mail para si mesmo ou enviar uma mensagem para si mesmo O que? Se quiser, vou arrastar o arquivo de fotos sobre o ícone da minha loja de fotos. Presumo que, como designer gráfico, você provavelmente tem acesso à loja de fotos. Se você não fizer isso, você provavelmente pode fazer algo semelhante em qualquer software de design que você usa. Mas aqui está o que eu vou didio Eu tenho a minha camada aqui. Eu vou apertar o comando J para pular cortá-lo em uma segunda camada aqui, eu vou clicar de volta na camada de fundo e eu vou preenchê-lo com um Ault Deletar verde brilhante para preenchê-lo com esta cor de primeiro plano que eu já tinha. Então, agora, quando faço essas mudanças, posso ver o que acontece. A primeira coisa que vou fazer é subir os meus níveis. Então o atalho para isso é o comando l dos níveis. Eu vou trazer meus brancos um pouco, e eu vou derrubar meus escuros para realmente triturar isso de volta para baixo. E, você sabe, eu poderia deixá-lo um pouco para cima porque eu meio que gosto disso. Posso ver um pouco da textura do marketing aqui. Na verdade, parece legal. Então talvez eu vá recuar um pouco e lembrar os brancos ainda mais e eu vou te mostrar como isso pode funcionar para você em um momento. Então, uma vez que você tem um tipo de clique feliz, OK? E agora o que eu vou fazer é clicar duas vezes na camada Agora, não clique no nome E não clique na miniatura tipo de clique fora para o lado aqui , e isso vai abrir seu estilo de camada e este pequeno controle deslizante esta mistura se é toda a magia vai acontecer. Então vamos pegar essa camada atual, aquela que tem minha assinatura falsa nela, e vamos esfregá-la um pouco para a esquerda, e vai esconder qualquer um dos tons mais claros. E eu poderia fazer o mesmo com os escuros se eu quisesse. Neste caso, eu poderia limpar os tons escuros e agora o preto se esconde. Mas o que eu quero é esta assinatura preta em cima. Então eu vou arrastá-lo e você pode ver se eu zoom aqui que eu ainda tenho um pouco de branco em torno das bordas. Agora isso não importa muito para o que vamos fazer a seguir. Mas se você quiser misturar que mesmo Mawr, eu posso segurar a tecla altar e clicar e arrastar sobre este controle deslizante branco, e ele vai começar a tipo de puxar para fora os brancos. Mas deixe alguns dos cinzentos para trás para que você possa ver uma espécie de obter que lavado para fora. Olha por onde vem o verde. Então você pode gostar disso para sua assinatura. Só depende do que você está procurando. Vou clicar. OK? E agora, tecnicamente, isso é apenas um estilo de camada. Na verdade, não cortou o branco. Então a maneira que eu sei que é, se eu fosse aplicar, como uma sombra ou algo assim, clique em OK, por movimentos para o lado. Aplica-se uma sombra a toda essa imagem. O que? Não queremos que faça isso. O que eu quero fazer é em outra camada logo acima desta, esta camada de assinatura falsa, eu vou segurar a tecla de comando para selecionar ambos. Essa é a chave de controle no PC. E agora o que eu vou fazer é subir para camadas mescladas. Isso é o comando E. E agora o que é feito é basicamente esmagou essas duas camadas juntas. Mas qualquer coisa que fosse transparente, ele realmente cortou. Então, agora, se eu aplicar uma sombra, você verá que ela realmente segue a assinatura, que é ótimo. Eu não quero adicionar uma sombra, no entanto, entanto, mas o que eu quero fazer Aqui é onde é realmente legal, já que agora eu posso mudar a cor desta coisa. Deixa-me mostrar-te como. Se eu clicar neste pequeno botão de transparência de bloqueio, eu vou clicar nele. Agora eu só vou ser capaz de afetar qualquer um dos pixels reais que têm conteúdo neles, mas ele não vai tocar em nada que é transparente. Então aqui está como isso é útil. Digamos que você queira mudar a cor para outra coisa. Qualquer outra coisa eu vou clicar em qualquer tipo de cor. Põe o meu primeiro plano assim e eu vou acertar o Ault. Excluir, preenche o primeiro plano e preenche apenas os pixels que têm dados de pixel. Então é isso que este bloqueio faz, para que você possa facilmente mudar a cor. Ou talvez você escreveu em um ponto azul porque isso é tudo que você conseguiu encontrar. Bem, você poderia clicar e arrastar até aqui, fazer isso oh, Arfield. Preencha sua cor de primeiro plano com preto e agora pressione excluir novamente para preencher meu primeiro plano com preto. Então, a única coisa que preciso fazer agora é endireitar isso, então eu tenho meus governantes nisso. Comando são se você não vê-los ou ir para ver e ligar suas réguas para que eu possa arrastar um guia para baixo. Vou clicar nesta camada e chegar perto do comando T ou controlado T no PC, e vou arrastar este pequeno ponto de ancoragem aqui. Então, agora, quando eu virar ou curvar isso, eu posso colocá-lo em uma linha reta. Aí está a sua assinatura. Estamos prontos para ir agora. Agora eu tenho que fazer é exportar isso. Então o que eu vou fazer agora é desligar esta camada de fundo e vir aqui para cima para a imagem para baixo para cortar e realmente criar esses atalhos personalizados. Então você provavelmente não verá isso porque eu uso esse atalho o tempo todo, mas clique em aparar. E agora o que posso fazer é cortar os pixels superiores à esquerda e à direita com base em pixels transparentes . Então, qualquer coisa que seja transparente, vai cortá-lo para isso. Então, se eu clicar em OK, ele vai cortá-lo todo o caminho até aqui. Deve haver algo aqui em baixo que não consigo ver com o meu próprio olho. Então eu vou fazer é apenas apertar a letra m para obter a minha seleção de letreiro e eu vou clicar e arrastar sobre como que vai apertar a tecla delete. Eu vou clicar e arrastar Eu apenas um comando fazer. Você foi rápido para de selecionar clique e arraste aqui e aperte a tecla delete mais uma vez, certificando-se que eu faço isso nesta camada. Comando D. Vamos tentar essa imagem. Aparar. Atalho de novo. Lá vamos nós. E agora ele o cortou de volta. Então agora o que precisamos fazer é exportar isso para que possamos realmente usá-lo agora? Se eu olhar para isso, porém, e olhamos pela minha régua, eu posso ver que esta imagem tem cerca de 1200 pixels wides. Isso vai ser enorme. Vamos voltar para o nosso site bem rápido. E se eu quisesse ser deste tamanho, eu só vou fazer uma mudança de comando de captura de tela no número quatro ou clicar e arrastar. Então meu logotipo era deste tamanho. Eu posso ver que tem cerca de 166 pixels de largura por 55 pixels de altura, então eu vou apenas pegar este outro no parque de bola. Então vamos fazer isso. Cerca de 150 pixels de largura, eu apertei a chave do mar para pegar minha ferramenta de corte vir aqui e mudá-la, Teoh. 100 e 50 pixels por. Vou apagar porque não me importa a altura. Eu só quero ser tão alto quanto o logotipo, e eu vou repensar isso um pouco. Abaixe isso um pouco e eu aperto a tecla de retorno. E vamos dar uma olhada no que está acontecendo aqui em cima. Ok? Então eu ainda tenho esses dados de pixel aparecerem. Vou apagar isso. Vou colocar 72 por 72 pixels por polegada de retorno mais uma vez. Lá vamos nós. E eu vou comandar a chave número um. Parece que vai ver, e depois 100% só para que eu possa ver o quão grande isso se transformou em. Ok, ótimo. Então agora estamos prontos para ir. Só tenho que exportar. Então o que eu vou fazer é ir para o arquivo para baixo para exportar. E eu vou apenas fazer uma exportação rápida como um arquivo PNG porque ele suporta transparência. Vamos chamar esse logotipo e eu vou jogá-lo direto na minha área de trabalho. Então é fácil de encontrar quando eu carrego isso. Agora quero mostrar mais uma dica ou truque quando estiver trabalhando com gráficos da Web. Eu encontrei este site legal chamado minúsculo P e G, e o que ele faz é comprimir suas imagens. Então, se eu for para minha área de trabalho e eu olhar para o arquivo local que eu acabei de exportar agora, são apenas quatro kilobytes, o que é pequeno, e isso é incrível. Então, realmente, eu não vou ficar tão pequeno assim. Mas se fosse uma imagem de cabeçalho grande ou se o seu logotipo talvez fosse um pouco maior , você pode soltar isso aqui e ele vai comprimir e você pode ver que ele ainda fez isso. Cerca de metade é grande, o que é incrível, porque agora ele vai carregar ainda mais rápido. Será uma das primeiras coisas para pouco meu site. Então eu tenho esse logotipo pronto para ir. Vou voltar para o meu site. Vamos para o painel abaixo dois salientes para baixo para a navegação de cabeçalho. Vamos voltar a ligar o logotipo do meu site e vamos fazer o upload aqui mesmo. Agora é aqui que eu gostaria de ter um tempo para colocar um texto Ault. Isso ajuda a otimizar seu mecanismo de busca. Ele ajuda o Google e outros motores de busca. Encontre seu site para que você possa apenas nomeá-lo. Coloque seu nome lá ou o que quiser, mas isso ajudará você a ser encontrado quando as pessoas pesquisarem seu site. Então, se você continuar a fazer isso enquanto você carrega imagens, isso irá ajudá-lo a longo prazo. Clique em Selecionar. E lá está o meu logotipo baseado e eu estou realmente indo para fazer upload exatamente o mesmo para o meu logotipo retina também. E vamos voltar para a loja de fotos rapidinho. Vou apertar o comando A para realçar toda a tela. E se eu for para a janela para baixo para informações, ele vai abrir minha paleta de informações aqui, e eu posso ver que a largura é 150 na altura é 70. Então, se eu quisesse, eu poderia cortar isso ao meio e fazer esta ser a minha versão completa da retina. Ou eu poderia fazer outra versão com 300 pixels de largura por 140 pixels de altura e depois fazer as contas para mim. Mas por enquanto, só para terminar isso, vou deixar isso em paz. Ele salva as alterações. E vamos ver se isto parece bem. Aí está minha assinatura, e novamente você pode ver que é bem pequena. Então vamos voltar aqui e mudar a altura local para 70. Agora deixe pra lá. Deixe-o 70 pixels de altura bater, salvar as alterações vai saltar para trás aqui e bater comando são para atualizar a minha página. E aí está. Aí está a minha assinatura personalizada, e está com bom aspecto. Agora há mais uma coisa que quero te mostrar. Se você estiver em qualquer outro site, você provavelmente seria feito neste momento. Mas o tema saliente realmente suporta várias versões do logotipo. Sobre a razão pela qual se eu clicar aqui em baixo em qualquer um desses itens do portfólio, você verá que algumas coisas estão acontecendo. Um. Tem uma enorme imagem de cabeçalho, sobre a qual falaremos na próxima palestra. Como fazer isso. Mas você também notou o logotipo aqui em cima. O antigo logotipo saliente ainda está lá, e aqui está o porquê. Se eu saltar de volta para o tema saliente e eu voltar sob salient, para baixo para navegação cabeçalho e, em seguida, eu clicar nesta guia de transparência, a navegação tem transparência, suporte, e quando o valete é transparente dá-lhe algumas opções de ou logotipos, Então este seria o meu logotipo inicial. Então, quando você chega a uma página, o que está aparecendo aqui? E neste caso, é um logótipo branco saliente. Então, quando escurecer, o que vai ser? E eu já tinha carregado isso. Então estes ar a versão escura. Então o que eu preciso fazer é criar uma versão branca ou leve do meu logotipo para páginas como este realmente simples de fazer, eu vou saltar de volta para a loja de fotos. Eu tenho esta camada selecionada. Só vou me certificar de que eu ainda que a transparência trancou quente a letra D para obter minhas amostras de cores padrão aqui. Vou fazer a letra X trocar. Assim, minha cor de primeiro plano está na frente. Você também pode clicar nessas setas aqui para trocá-lo. Agora eu vou fazer é apertar Ault deletar. E agora o meu logótipo está em branco, por isso vou guardar isto bem depressa. Teremos arquivo. Nós vamos descer para exportar rápida como PNG e vamos chamar este logotipo traço branco, e então vamos voltar para a nossa página web de volta para o menu saliente, e vamos em frente e fazer upload da versão branca rapidinho. Vá para a minha área de trabalho. Vamos jogar isso lá e novamente dar um pouco de texto, tudo bem, e agora ele é carregado para a versão retina também. Vamos salvar nossas mudanças. Saltar de volta para a nossa primeira página aqui vai recarregá-lo. Lá vamos nós. Isso parece ótimo, e é basicamente isso. Então, no próximo vídeo, vamos dar uma olhada em como podemos personalizar a tipografia e as cores para começar a fazer isso corresponder à nossa marca. 23. Como mudar fontes: Vamos mudar suas fontes para corresponder à nossa marca. E enquanto estamos aqui, vamos em frente e atualizar este texto no topo só assim, faz sentido. É uma vitória rápida. Eu vou clicar em Editar página e eu vou para a direita para este bloco de texto. Vou clicar na ferramenta de lápis em vez de dizer olá. Eu sou Phil. Vamos mudar para qualquer que seja o seu nome. Neste caso, é o Derek. Eu sou um designer gráfico de Callis Bell Montana. Tudo bem, vamos deixá-lo na batida. Excluir. Temos que bater em salvar aqui no fundo, e então também temos que atualizar aqui à direita. E agora, quando voltarmos para a página inicial bem rápido, basta clicar na página de visualização, e isso está tudo aparecendo nítido. Então vamos em frente e mergulhe em suas fontes. Então eu vou voltar para o meu painel e eu vou voltar para o menu de reparação saliente. E aqui em baixo temos este menu de tipografia, então eu vou clicar sobre isso, e é bem simples lá. Caixas suspensas, por isso é muito fácil de mudar. Mas como você sabe como é a falha, bem, estes estão todos sendo puxados de fontes do Google. Então, se você apenas Google fontes Google, você vai descobrir que você vai para fontes dot google dot com e você verá todas as fontes que estão disponíveis para que você possa percorrer e encontrar qualquer coisa que você quer usar que você gosta. Então, digamos que eu queria atualizar minha navegação também. Eu não sei. Que tal Playfair? O que eu poderia fazer é agora que eu vejo o que parece, saltar de volta aqui, eu vou clicar no meu menu suspenso e eu vou apenas digitar em play fair. E ali está ele. Vou clicar nisso. É seguro e vamos pular para o site ao vivo. E assim, minha navegação é atualizada, então isso é realmente muito fácil, e muitos novos temas são assim. Eles facilitam muito o upload e a mudança de fontes. Uma coisa que eu consideraria como você está jogando com fontes e tipografia para toda a sua página é manter duas fontes sempre que possível. Então o que isso significaria é que você teria como uma fonte de exibição. Então talvez algo que você use para sua navegação principal e seus títulos, e então você teria sua fonte de cópia corporal, algo que provavelmente é mais simples e fácil de ler em um site, algo que Sand Saref e eu nunca iríamos mais de dois fontes, porque o que vai acontecer é que ele vai começar a olhar realmente desordenado e sua marca vai olhar realmente desarticulado. Portanto, fique com duas fontes por enquanto, para aqueles de vocês que querem mais controle sobre suas fontes. E se você já se inscreveu na loja de fotos e ilustrador e no design de toda a suíte criativa, você deve ter acesso ao kit de tipo. Então, se você tem um tipo kit dot com, há, ah, toda outra biblioteca de fontes que estão disponíveis para você. E isso está um pouco fora do escopo desta palestra agora. Mas quando você entrar, eles vão mostrar-lhe como instalar kit de tipo em seu site para que você possa escolher ainda mais fontes toe trabalhar com OK no próximo vídeo, vamos dar uma olhada em como personalizar as imagens de cabeçalho 24. Criando uma imagem de heróis de de de sua casa e cabeçalhos personalizados: nesta palestra, vamos dar uma olhada na criação de uma imagem de cabeçalho personalizada para o seu site. Então não importa o tema que você usa ou o que você está construindo. Colocar uma nova cabeça, um gráfico ou uma imagem deslizante em seu site mudará drasticamente. Ah usuários. Primeira impressão do seu site. Agora temos este site de portfólio realmente limpo, mínimo, que é ótimo, mas saliente realmente suporta o uso de imagens de cabeçalho. Então, novamente, se eu clicar em uma dessas peças do portfólio, você vê que podemos ter essa imagem em tela cheia no topo. O que eu vou fazer é voltar para a home page e clicar em Editar página e você pode ver que se eu rolar para baixo aqui, eu tenho a opção de adicionar um plano de fundo de imagem para o cabeçalho da página. Se eu clicar em “upload “agora, vou jogar um aqui. Isso já está lá vai bater, selecionar, e eu vou bater atualizar página de exibição rápida, e você pode ver que isso muda drasticamente sua primeira impressão do site. Você também verá que o logotipo branco que fizemos mudou automaticamente o logotipo usado porque agora ele está usando um menu de navegação transparente. Tudo bem. Então o que eu quero mostrar a vocês é como eu iria sobre projetar um gráfico de cabeçalho para o meu site na loja de fotos. Normalmente o que eu faço é ir sobre pixels p e x e l s ponto com e apenas procurar por qualquer tipo de imagem, ou provavelmente tomar o meu próprio da minha própria câmera. Mas neste caso, você pode procurar aqui e encontrar todos os tipos de grandes imagens. Então está fingindo que era uma imagem da minha mesa que eu tirei. Eu poderia clicar em download gratuito, e ele iria baixá-lo em uma nova guia. Tudo bem, clique e clique em copiar imagem. Ou você pode simplesmente clicar, salvar a imagem como e colocá-la em um lugar seguro, como em sua área de trabalho ou em uma pasta na qual você está trabalhando. Iremos em frente e copiaremos. Esta imagem vai saltar para a loja de fotos, e eu vou fazer um novo documento. Que arquivo novo. E isso é algo que eu quero apontar. Você sabe, realmente depende do tema que você está usando, qual é o seu objetivo final e quem vai usar o seu site. Mas normalmente o que eu faço, eu faço a largura das minhas imagens com cerca de 2000 pixels de largura e a altura muda com frequência. Mas vamos apenas colocar 500 pixels para agora eu criar, e você pode ver que este é um gráfico mais rasgado. Em saliente. Eu tenho a opção. Vamos voltar para lá bem rápido. Vamos clicar na página de edição quando eu rolar para baixo, tem a opção de nos fazer um cabeçalho de paralaxe, e eu também posso torná-lo uma altura de tela cheia. Então, se você vai fazer isso, você vai precisar de uma imagem muito maior. Então, olhando para a imagem do cabeçalho da página para este site, ele sugere 1600 a 2000 pixels de largura em uma altura mínima de 4 75 Se eu clicar na altura da tela cheia e isso é bom e visualizar o que seria, você pode ver que eu vou precisar de um imagem muito maior para esse trabalho do dedo do pé. Então isso depende de como você quer trabalhar e do que você vai fazer. Tudo bem, vamos voltar para a loja de fotos e digamos que eu queria fazer isso maior. Eu posso apertar a opção de comando na letra C, que abre o tamanho do meu campus e eu posso mudar minha altura em vez de ser 500. Talvez. Vamos fazer com que 700 pixels de altura. Eu não cliquei. OK, agora, o que eu posso fazer é pressionar o comando V para colar a imagem que eu tenho aqui e a razão pela qual ela ainda estava na minha área de transferência. Foi porque eu tinha clicado com o botão direito no arquivo pixels e eu clique em copiar imagem. Ou você pode abri-lo de onde você diz fazer sua área de trabalho. De qualquer forma , não importa. Vou apertar o comando t nesta camada que acabamos de trazer e dimensionar a minha imagem para caber. Agora, tudo bem, mas se eu jogasse isso lá em cima, seria um cenário de distração. Então, o que vamos fazer, há algumas maneiras de trabalhar. Vou criar uma nova camada acima dela. E vamos apenas dizer que eu queria trabalhar com talvez esta cor verde aqui para a minha biblioteca. Eu seleciono isso e preencho minha cor de primeiro plano. Ele também exclui para preencher a frente. E agora eu vou fazer é apenas percorrer alguns modos de mistura diferentes para ver o que eu gosto mais. Portanto, certifique-se de ter esta camada selecionada na letra V para obter sua ferramenta de seleção. E agora vamos apertar a tecla Shift e o sinal de mais. E o que isso vai fazer é percorrer todos esses modos de mesclagem aqui embaixo . Então, é hit shift plus apenas para tipo de ciclo através e ver o que eu gosto. Você sabe o que eu não quis dizer para este vermelho, mas na verdade é meio que uma cor legal. Eu poderia deixar assim, mas vamos apenas falar com através aqui para que você possa ver como ter o verde em cima interage com a camada abaixo. Mas isso pode não ser suficiente para você. Então, o que? Você pode considerar fazê-lo, configurá-lo de volta ao normal e vamos arrastar esta camada para baixo. Vou selecionar esta camada de imagem e comando J para saltar cortá-la. Então eu tenho uma versão dele. Se eu não gostar do que eu faço, basicamente, apenas clonando, eu vou clicar de volta nesta camada e agora e apertar o comando shift na letra você, que de satura minha imagem que deve ser sobre descuidado ver imagem ajustamentos até de saturar. Então foi aí que eu peguei esse atalho. Agora o que vamos fazer é mudar o modo de mesclagem da camada de imagem, e acontece que eu sei que isso se multiplica. Provavelmente vai nos dar a melhor opção. Então eu vou clicar sobre isso e você pode ver que nós temos uma imagem de cabeçalho agradável. Mas vai estar escuro o suficiente para não dominar todo o resto no site. Então agora eu vou fazer é ir em frente e exportar isso. Então venha aparecer para arquivo de humor e exportação. Desta vez, em vez de escolher um PNG, vou exportar como a razão pela qual esta é uma imagem tão grande. Quero mais controles sobre o tipo de exportação de arquivos. Dessa forma eu posso realmente reduzir o tamanho do arquivo, então não demora muito tempo para carregar no site. Vou clicar em exportar como e você pode ver agora. Se eu não toquei em nada, este arquivo vai ter 660 kilobytes e você pode não ter nenhuma referência para o tamanho que é. Mas isso é bem grande. Eu tenderia a ficar abaixo de 300 kilobytes se em tudo possível quando eu faço meus sites normalmente querem exportar essa qualidade. Todos disseram que era 70% ou talvez até menos do que isso. Vamos ver o que isso faz para o nosso tamanho de arquivo, então isso faz com que seja cerca de 198 kilobytes, o que é bom, é algo em que você tipo de precisa prestar atenção à velocidade do navegador que seu mercado-alvo provavelmente usando e o que mais você tem em seu site porque você não quer que as pessoas tenham que esperar o carregamento de gráficos. Então, se eu ampliar isso, você pode ver que comprimir para baixo na verdade não prejudica essa imagem. Eu realmente não posso dizer que ele foi comprimido, então talvez eu poderia ir ainda mais longe do que isso. Vamos tentar 50% e ver o que acontece, e nesse ponto ele ainda parece muito bom, e um tamanho de arquivo é de apenas 107 kilobytes, então estou feliz com isso. Vou em frente e clicar em exportar tudo. Vamos apenas chamar este cabeçalho em toda a minha exportação desktop, e isso é algo onde você ainda pode puxar para cima aquele pequeno site P e G que eu mostrei a você na palestra anterior e você pode comprimir sua cabeça ou imagem para baixo ainda mais. E recomendo vivamente que faça isso. Porque mesmo que o Photoshopped seja um ótimo trabalho de compactação da imagem, você quer que ela seja o mais fino e um tamanho pequeno possível de arquivo. Então eu vou arrastar essa imagem para a minha área de trabalho para esta pequena zona de queda em minúsculo P e G vai comprimir. E sabes que mais? Não conseguimos muito, mas ainda são oito kilobytes salvos. Então vá em frente e clique em Download aqui. Vai jogá-lo na minha pilha de downloads. E agora vamos voltar para o nosso site. Vou clicar em Editar página, desça até a parte inferior. Vamos para o fundo da imagem, e eu vou clicar no botão remover upload aqui, abaixo dessa imagem e vamos clicar em carregar, carregar outra imagem, que é a que acabamos de criar. E novamente, não se esqueça de adicionar todo o texto tributado ou descrição. Se você tem algo a adicionar para o seu site, apenas novamente tentando ajudar seu site a ser encontrado pelo Google ou outra pesquisa em motores de busca, e, em seguida, outra opção que podemos fazer é clicar nesta opção Parallax Header novamente, isso está em saliente, mas o que ele vai fazer é adicionar um efeito de profundidade muito legal enquanto você rola. Então vamos em frente e salvar isso em vista de como isso parece agora. Então agora nós temos essa imagem em tamanho real, e enquanto eu rolar, você vê, ele tem o efeito de paralaxe, onde o fundo está se movendo em uma velocidade diferente do primeiro plano e outros elementos da página . É muito legal, e isso é praticamente como faras a imagem de cabeçalho. Claro, se você tiver mais habilidades de design, você poderia adicionar muito mais elementos a isso. Você poderia fazer coisas como ele vai adicionar uma nova camada, obter minha ferramenta Grady int aqui clicando arrastar e talvez fazer isso uma multiplicação. Então dá um pouco de borda queimada aqui. Poderíamos fazer muito mais. Poderíamos adicionar texto. Poderíamos adicionar mais imagens e enlouquecer com isso. Mas agora tudo o que estamos tentando alcançar é apenas um elemento de design sutil que tipo de ajuda a construir nossa marca e construir a história por trás do site, e isso é praticamente tudo. Eu sei que isso é muito simples, especialmente se você já é um designer gráfico, você deve saber como criar seus próprios gráficos. Mas espero que isso ajude você a encontrar maneiras simples de adicionar um pouco mais de interesse visual aos seus projetos . E não importa o que o musing, se é o padrão 2017 atualmente no WordPress ou mesmo qualquer outro pot site de lá fora , quase todos eles dar-lhe uma opção para adicionar um gráfico de cabeçalho. E se você está no WordPress e você está usando um tema diferente e talvez ele não tem a opção para um gráfico de cabeçalho como este, não se esqueça. Você pode adicionar a revolução deslizante, conectar-se também, e adicionar muito mais funcionalidade para criar esses gráficos incríveis para o seu site. 25. Como configurar seu portfólio: nesta palestra, vamos apenas olhar para algumas configurações de portfólio no tema saliente. Então, o que eu quero mostrar é atualmente a página inicial. Pelo que instalamos, ele tem basicamente elementos de página padrão, e então ele tem o portfólio que carrega abaixo. Então, a maneira que funciona agora, se eu clicar na página de edição acima aqui, você pode ver que a maneira como isso está funcionando. Ele tem o plug-in compositor visual, e tem essas seções aqui, e tem este elemento de portfólio adicionado a ele. Eu posso clicar na ferramenta de lápis, e eu posso mudar exatamente quais categorias ele está puxando para dentro. Eu posso controlar como o layout é controlar um monte de coisas aqui. Eu vou ir em frente e bater, salvar as alterações, porque você pode verificar isso sozinho agora, se eu quiser. Se eu voltar para o site principal, você vai notar que nós realmente não temos um link de portfólio. Mas se eu quisesse criar minha própria seção de portfólio e ter a home page ser mais básica ou ter texto em vez de imagens ou qualquer outra coisa, eu poderia excluir essa seção e criar uma nova página apenas para o portfólio. Então, se eu vir até aqui para Novo e clicar em Página, eu posso fazer uma página de portfólio. Capitalize isso, e depois o que eu vou fazer. Eu não tenho que fazer nada aqui no meio. Na verdade, há um modelo construído no tema saliente. Eu vou até aqui, clicar no menu suspenso e escolher Portfolio, e agora tudo o que eu tenho que fazer é acertar. Publicar. Se eu tivesse vista Página, você pode ver que eu tenho um portfólio totalmente dinâmico construído sobre as configurações padrão de dentro . Saliente. Agora não aparece no menu. Se eu quisesse, eu poderia voltar aqui para os menus, e é a última página que acabamos de adicionar. Então clique nisso e adicione ao menu, talvez arraste isso para cima no lugar e pressione salvar. E assim, adicionei uma página de portfólio personalizada ao meu site também. Então isso é algo que você pode querer fazer depende de como você quer que seu layout seja, e então a próxima coisa que eu quero mostrar é se nós rolarmos para baixo, você pode ver que temos essas categorias configuradas. Então, se eu clicar em anúncios ou aplicativos ou branding design gráfico. Todos os projetos embaralham de acordo com a sua categoria. A maneira como isso funciona é bonito é bem simples. Eu vou clicar no meu painel novamente e eu vou descer para o menu do portfólio e, em seguida, aqui para baixo , ter categorias de projeto, então eu vou clicar sobre isso. E vocês podem ver que foi aqui que criamos essas categorias, e aqui podemos ver quantos projetos diferentes pertencem a cada um. Então, se há algo aqui que você não quer mais como uma categoria, eu poderia apenas acertar, excluir, ou eu posso adicionar uma nova categoria todos juntos. Então, talvez eu queira adicionar Web design como uma categoria adicionar nova categoria de projeto, e agora Web design estará aqui, e ele automaticamente criou um slug. Então você notou que eu não tive que tentar colocar isso aqui e de novo. A lesma é apenas a versão amigável do nome. Então é o que ele coloca no endereço quando você vai para essa categoria diferente. Então tudo o que eu tinha que fazer era colocar o nome hit, adicionar nova categoria de projeto e, em seguida, se eu quisesse, vamos voltar para o nosso site principal aqui, e dar uma olhada nessas categorias. Você vai notar que ainda não apareceu. E a razão é se eu clicar em qualquer um desses. No momento, não temos nenhum deles aparecendo como um desses itens de categoria, então vou editar qualquer um desses. Não importa o que, mas vou clicar na categoria Web design em um desses projetos na atualização. E agora, quando eu voltar para aquela home page novamente porque temos um projeto que apresentava Web design, essa categoria agora aparecerá. Agora que você sabe como configurar o portfólio e alterar algumas das configurações básicas, vamos realmente olhar para o post em si, as páginas reais do portfólio e como trabalhar. Com isso, vou voltar ao meu painel. E se eu voltar para esta guia portfólio, eu vou clicar sobre isso e você vai notar que quando eu estiver na torneira principal do portfólio, você pode ver todas as partes diferentes do portfólio que vieram quando instalamos o conteúdo demo . Então, se você está pronto para criar suas próprias coisas e você não precisa disso como um guia. Você pode clicar na caixa de seleção na parte superior, ir para ações em massa e ele foi movido para o lixo. Em seguida, clique em aplicar, e ele iria jogar todos estes no lixo e você poderia começar do zero. A outra coisa, você poderia fazer como você está tipo de colocar seus pés sob você e tipo de se acostumar com como isso funciona é apenas ir em frente e clicar em qualquer um desses e apenas começar a engenharia reversa como eles têm cada página configurada. Então, uma vez que este é um post sob a categoria portfólio e novamente aqui, podemos controlar a categoria específica a que pertence, e podemos adicionar várias categorias de você deseja atualizar rapidamente. Eu vou bater ver post, e você pode ver que cada post tem um layout diferente abaixo. Assim, à medida que você percorre todos esses projetos e vê o que você gosta, você pode começar a adicionar em seu próprio conteúdo em seu lugar. Então, enquanto eu rolar para baixo mais para baixo em direção à parte inferior, você pode ver que ele tem este próximo botão de projeto que é um padrão embutido neste tema. Mas eu posso voltar no item Click Edit Portfolio, e eu tenho este compositor visual aqui. Então, se eu quisesse, posso reorganizar qualquer uma dessas coisas. Clique em Rag Aiken, ADM. Ou Elements. Clique nesse botão mais e há muito mais elementos como imagens, textos, título animado, muitas coisas que você pode adicionar aqui. Então isso vai ser algo que você vai ter que decidir o que você quer fazer sozinho. Também podemos adicionar modelos como aprendemos no início desta Siri, onde você pode ver um anúncio, qualquer tipo de elementos como toda essa categoria de projeto. Então, digamos que você queira mostrar algo com esses iPhones como uma amostra. Você pode clicar sobre isso, e esta galeria habilitada de quatro toque visível é adicionada até a parte inferior. Então aqui está aquela galeria em que posso clicar e arrastar de volta para o topo. Digamos que eu queria ser a primeira coisa que eles vêem todas as mudanças muito rápido e agora em um pergaminho para baixo. Essa é a primeira coisa que vemos agora não adicionou as imagens desta vez, mas novamente, isso vai ser algo que você vai querer preencher com suas próprias imagens. De qualquer forma, a única outra coisa que eu realmente quero mostrar é se nós rolamos para baixo sob os posts em si, você pode controlar o que as imagens em destaque, e isso vai ser o que a equipe usa enquanto exibe miniaturas e tal. Então isso é algo onde você pode adicionar sua imagem de feição lá. Há também configurações adicionais abaixo, que você possa torná-lo um item completo com portfólio. Você pode torná-lo um item de grade de conteúdo personalizado. Você pode alterar a imagem em miniatura personalizada. Você também pode controlar, se o tamanho do item de alvenaria, se isso é largo, alto, regular Então o que isso significa. Vamos voltar para a página inicial muito rápido como eu rolar para baixo. Então este é largo este quadrado. Este é alto para que você possa controlar se sua imagem é qualquer um desses layouts. Então ele se encaixa melhor com qualquer que seja o projeto. Então, espero que isso ajude você a obter uma boa compreensão de como mergulhar e atualizar seu portfólio com o tema saliente 26. Como adicionar um vídeo em loop ao seu fundo de site: Tudo bem pessoal, nesta lição, eu quero mostrar a vocês como adicionar um vídeo ao fundo do seu site. Eu acho que é uma tonelada de diversão de fazer e ele realmente adiciona um monte de interesse visual e pode muito facilmente elevar a aparência do seu site sem uma tonelada de trabalho. Então, assim como você vê na tela agora, eu tenho uma tela cheia enquanto não em vez de tela cheia. Mas ele vai para todas as bordas do navegador da Web, este vídeo aqui e enquanto eu rolar, ele tem um efeito de paralaxe e nós temos algum texto HTML sentado em cima dele. Você vai notar, e, em seguida, quando rolamos para baixo o resto do site apenas tipo de se parece com qualquer outro site . Então, o que vamos fazer neste vídeo está nesta lição é aprender a colocar em um vídeo como este. Então, outro exemplo só para talvez te dar mais algumas ideias. Neste caso, só temos o título acima do topo. Mas neste outro site aqui eu criei para um podcast. Nós usamos o vídeo de introdução que eles usaram no YouTube que eu realmente fiz este vídeo para, hum de qualquer maneira, então nós temos este vídeo sentado em segundo plano, e em cima dele é um logotipo que eu desenhei como um arquivo PNG. Então é transparente. Nós temos algum texto HTML, e então se eu clicar no botão, ele rola para baixo e é interativo. Então nós temos alguns elementos interativos sentados em cima do vídeo. E novamente, eu acho que isso é uma tonelada de diversão e apenas uma maneira tão fácil de adicionar tanto valor ao seu site . Então vamos em frente e mergulhar, e eu quero salientar que ambos esses sites estão usando o tema WordPress saliente. Meu site também usa o tema WordPress saliente. Eu só estou muito confortável com isso, e eu realmente gosto disso. Mas a maioria dos editores da Web modernos e a maioria dos novos temas que você está vendo agora para WordPress vai permitir que você faça fundo de vídeo. Então, hum, vá em frente e acompanhe para que eu possa mostrar algumas dicas, truques e coisas para realmente evitar ao longo do caminho apenas para ajudar a preparar você para o sucesso. E eu acho que você será capaz de aplicá-los a praticamente qualquer tema que você usar, mas novamente, para este estamos usando salient. Então, a outra coisa para começar. Vá em frente e baixe o vídeo anexado a isso se você quiser acompanhar ou usar esse vídeo. Mas se você quiser criar seu próprio vídeo, talvez para seu próprio site pessoal ou talvez para outra empresa ou cliente, eu realmente recomendo a assinatura in Votto Elements. Eu uso isso para todos os meus recursos criativos. Ultimamente, tenho gostado muito. Eles têm todos os tipos de itens, desde vídeo de estoque, música, gráficos e fotos. O Fonz. Refiro-me a todos os tipos de coisas. Eu realmente não posso recomendar isso altamente o suficiente. Então, hum, qualquer maneira, confira. É muito fixe se vieres aqui e procurarmos o Opener, que é o que estamos a fazer. Basicamente, eu venho aqui e clique em modelos de vídeo, e nós vamos clicar na lupa pequena para procurar. Você vai ver que temos mais de 9000 modelos de vídeo abridor, então basta ir através, encontrar um que você acha que é legal, baixá-lo e, em seguida, soltar em suas próprias fotos de seus próprios vídeos e criar seu próprio Ah, abridor dinâmico. muito legais. Então Ah, uma coisa que eu quero apontar para Eles têm diferentes aplicações suportadas. Então, se você está confortável ou familiarizado com efeitos após, por exemplo, então talvez você queira pesquisar por isso. Eu notei que a maioria dos realmente legais foram feitos em após efeitos. Mas há alguns realmente bons para premier também. Então, basta encontrar o que você gosta, clicar nele e, em seguida, você pode baixá-lo e, em seguida, substituir a filmagem com a sua própria. Tão simples. E muitos deles têm tutoriais embutidos sobre como editar esses modelos. Então, uma vez que você está feito com isso, uma vez que você tem um vídeo que você quer colocar em segundo plano, eu recomendo qualquer lugar de , você sabe, cinco segundos a 30 segundos de duração estavam apenas tentando apenas adicionar rapidamente alguns interesse visual aqui. Então pegue seu vídeo, e então a próxima coisa que queremos fazer é realmente torná-lo assim. Este vídeo pode ser colocado neste site, então deixe-me ir em frente e mostrar-lhe como isso parece no back-end. Então, novamente, eu estou usando salient e vai parecer um pouco diferente, dependendo do tema que você está usando. Mas vamos clicar em Editar nesta página, e há algumas coisas diferentes acontecendo aqui. Então nós temos o construtor de páginas de padaria WP, e é apenas uma maneira de ser capaz de arrastar e soltar seu conteúdo por aí. Eu não estou muito preocupado com isso agora, mas se clicarmos nesta ferramenta lápis sobre este fundo neste recipiente esta linha, se eu rolar para baixo, você percebe que eu posso adicionar uma imagem de fundo ou eu posso até vir aqui e clicar em ativar fundo do vídeo. E assim que eu fizer isso, eu tenho a opção de usar um vídeo do YouTube. Seu l então basicamente ir até você para encontrar qualquer vídeo. Naquele ponto. Você sabe que tem que fazer um vídeo. Você poderia apenas colar o U. R L aqui bater salvar alterações e os vídeos serão reproduzidos automaticamente. Mas isso depende de você ter que ter uma conta do YouTube ou uma maneira de pegar um vídeo que você deseja usar. A outra maneira é fazer o que chamamos de auto-hospedado para que você realmente faria upload de seu arquivo de vídeo em seu site WordPress e hospedado de seu próprio site. Então, para fazer isso, precisamos de três tipos de arquivos diferentes. Precisamos de um arquivo Web M. Precisamos de um arquivo MP 4 e precisamos de um arquivo nog V. Basicamente, eles são apenas o mesmo vídeo, mas diferentes tipos de arquivos. Se você está familiarizado com gráficos regulares, pense em um J peg ou PNG ou arquivo PDF ou um presente para o arquivo Jeff. Seja como for, tudo o que estamos fazendo é criar o maior , suporte, dependendo do navegador que as pessoas estão usando, seja safari ou cromo ou Firefox ou algo assim outra coisa. Portanto, ao ter todos esses tipos de arquivos diferentes, dependendo do navegador da Web que seu visitante está usando, é inteligente o suficiente para servir qualquer tipo de arquivo que eles precisam. Espero que isso faça sentido, e é isso que vamos fazer agora. Vamos pegar esse vídeo e vamos fazer. Eu tenho aqui mesmo. Meus downloads. Então é só abrir isso. Este é um vídeo 42º, e é apenas uma sequência de abertura que obtivemos de elementos envolvidos e depois deixamos cair em nossas próprias filmagens para torná-lo relevante para o nosso site. Certo, então vamos em frente e usar este vídeo, mas para fazer isso vai notar que aparece no nome do arquivo. É um ponto mp quatro arquivo. Então o que eu preciso fazer é vir aqui para um site que eu uso chamado online Dash Convert. E provavelmente há versões melhores. Se você souber de um comentário abaixo, também há plugins para Premier. Então você pode procurar por, uh oh gv Premiere Pro. E você vai ver alguns diferentes como converter toe GV e inversões da Web com Premier. Então, por padrão, o Premier não suporta esses tipos de arquivos, tanto quanto, como, apenas exportá-lo rapidamente. Então é por isso que temos que usar este conversor de vídeo online. Tudo bem, espero que você acompanhe comigo. Vamos entrar nisso e ver como funciona. Então, vamos clicar nesta opção de conversor de vídeo. Nós vamos descer aqui e clicar no formato alvo, então o 1º 1 vai dio Vamos apenas fazer a versão Web M. Isso realmente não importa porque temos que converter alguns diferentes irá redirecionar para a página do conversor Web M. Vamos escolher o arquivo e vamos pegar o arquivo de vídeo. Clique em Abrir e ele vai carregá-lo e, em seguida, processá-lo. Você verá o progresso aqui e, em seguida, quando estiver no upload, podemos apenas clicar aqui no botão Iniciar conversão. Tudo bem, então uma vez feito isso, carregar tudo que eu preciso fazer é clicar em Iniciar conversão ou se você quiser, você pode rolar para baixo e você verá que temos algumas opções diferentes. Pessoalmente, nunca me meto com isto. Mas se você quiser, você pode cortar maneiras diferentes e você pode alterar o tamanho da tela. Mas neste caso, eu estou apenas tentando para cima, convertê-lo em um tipo de arquivo diferente. Vamos clicar nisso, e agora está baixando o vídeo. É um cued o vídeo, e está trabalhando em processá-lo. Quando tudo estiver pronto, ele vai jogá-lo automaticamente em seus downloads. Tudo bem. Então ele terminou a conversão do meu arquivo, que originalmente era cerca de 60 megabytes, e você vai notar que esta versão Web M é apenas 12, o que é incrível, porque ele vai puxá-lo para baixo em um site que queremos carregar Imediatamente . Então, ter um muito menor vai ser incrível. Então, agora eu tenho isso feito. Eu posso realmente clicar no botão verde de download, mas ele já jogou na minha pilha de downloads e você vê a falta aqui em baixo. Mas preciso converter o arquivo original novamente. Então acabamos de fazer. Deixe-me checar duas vezes. Fizemos a inversão da web. Então, vamos clicar neste arquivo original convertido novamente. Botão. Assim eu não tenho que recarregar o arquivo. Nós vamos rolar para baixo que nós vamos para o conversor de vídeo, e nós vamos para O G V. Clique sobre isso, e nós vamos clicar, iniciar a conversão e fazer todo o processo novamente. Certo, então o arquivo O G. V está pronto, e você percebe que este é um pouco maior. São 40 megabytes, mas baixou automaticamente para minha pilha de downloads. Se não o vir, deverá poder clicar no botão verde de download. E no último tipo de arquivo de vídeo que eu preciso. Se eu voltar aqui e checar novamente, você verá que fizemos a Web M.O.G V e agora precisamos de um arquivo MP 4. Então, na verdade, é o arquivo de vídeo com o qual começamos. Mas eu vou deixar a conversão on-line ligar e fazê-lo novamente, só para ver se podemos comprimir um pouco mais. Então ele carrega ainda mais rápido. Então eu vou converter o arquivo original novamente, voltar para baixo o conversor de vídeo, e então nós queremos o MP 4. Vamos clicar sobre isso e vamos clicar em iniciar a conversão mais uma vez para você começar o MP para o arquivo, tudo bem. E o arquivo MP quatro é apenas 28 megabytes em vez de 60. Então isso é incrível. Tudo bem. Temos todos os três formatos de arquivo de vídeo aqui com os quais precisamos trabalhar. Agora, o que precisamos fazer é realmente colocá-los em nosso site WordPress. Então, para fazer isso, aqui está o meu fluxo de trabalho. Não necessariamente a melhor maneira de fazê-lo. Exatamente como descobri fazer isso neste caso. Então o que vamos fazer é voltar para o site onde a edição deveria vir para a mídia aqui na barra lateral. Porque o que isso está procurando é o u. R L Bem, como você encontra o URL para este arquivo? Aqui está como. O que vamos fazer é falar com a mídia. Vou manter pressionado o botão de comando quando eu clicar. Se você estiver em um PC, mantenha pressionado o botão de controle e clique e ele vai abrir esse link em uma nova guia , o que é incrível. E agora posso enviar o vídeo. Então eu já fiz isso uma vez, e você verá que eu tenho os arquivos de vídeo aqui. Então, para acelerar isso, o que vamos fazer é clicar nesse arquivo de vídeo. Faremos o primeiro a cantar. Veja, o que nós podemos fazer é uma de algumas coisas que eu poderia apenas pegar este vídeo que nós fizemos este web m clique e passar o mouse sobre isso em qualquer parte da janela e simplesmente deixar ir. Ele vai carregá-lo automaticamente. E, ah, uma vez que isso é feito, você vai notar que ele vai ter Ah, miniatura como esta e eu posso clicar sobre isso e você vai notar aqui eu posso copiar o link. Este link inteiro aqui é para o ativo de mídia que acabamos de enviar. Então clique triplo e lá para destacar tudo. Ou basta clicar no botão copiar link e, em seguida, voltar para este portfólio. Adam, deixe-me. Ok, então eu tenho Thea a versão Web M. Tudo bem, vamos voltar aqui. Nós vamos para a web e arquivar o seu l e bem, passeá-lo lá dentro. Agora, precisamos do arquivo do MP 4, Earl. Então vamos voltar aqui e podemos alternar para frente e para trás. Vamos em frente e pegar este arquivo MP quatro clique triplo aqui. Copiá-lo, colá-lo lá e, em seguida, último é este oh, arquivo gv. Vamos voltar aqui e descobrir que gv deste alternar para frente e para trás aparecer. Ou podemos fechar esta janela e clicar duas vezes de volta lá. É ele a fazer isso. Ah, bem, clique triplo copie o link e cole-o. Eles estão bem. Então, a última coisa que provavelmente queremos fazer é uma imagem de visualização de vídeo. Então, a maneira como isso funciona é digamos que alguém está em uma conexão lenta com a Internet e o vídeo não começa imediatamente. Ele vai exibir a imagem de pré-visualização primeiro antes de saltar para o vídeo. Então, é bom ter apenas para que eles não estejam vendo uma tela branca. Então nós vamos pular aqui, eu vou para minha biblioteca de mídia, e eu vou apenas selecionar uma imagem que eu já enviei apenas para fazer isso aqui, e então nós rolamos para baixo. Temos outras opções, mas vamos deixar assim por enquanto. Vou clicar em, salvar as alterações. Vamos clicar em atualizar, e depois vamos fazer. E, na verdade, eu deveria apontar normalmente eu iria clicar em alterações de pré-visualização. Mas o servidor que estou usando agora tende a descontar todas as minhas coisas que eu faço todas as mudanças. Então, quando eu clicar em pré-visualizar alterações, isso não aparece para mim por algum motivo. Mas, na maioria das vezes, eu clico em pré-visualização muda. Eu não iria apenas atualizá-lo sem olhar para ele primeiro, mas neste caso, uh, estava indo clique atualizar. Tudo bem, então vou ver o correio. Devíamos ter dois vídeos a tocar agora. Devíamos ter um dos top que eu tinha originalmente. E se eu rolar para baixo, é realmente confuso ver, mas você vai notar que eu tenho um fundo de vídeo atrás deste outro contêiner também. Então é assim que você entra em vídeos, pelo menos, uh, especificamente com salient e WordPress. É assim que você faria. Mas o que é mais importante, para apontar é apenas como converter seus arquivos para esses outros formatos da Web e como fazer isso, bem como outra maneira que você pode fazer isso é através de soltar em um link do YouTube como eu mostrei a você no início desta lição. Então eu vou ir em frente e voltar para editar este item do portfólio e vamos em frente e tirar isso porque eu não quero isso nessa seção. Vamos ver. Foi bem aqui quando eu clicar sobre isso e nós vamos apenas excluir esses links e que fundo vai embora. Vamos tirar um vídeo ou aquela foto. Vamos clicar, salvar as alterações e atualizá-las. E então esse vídeo será removido do conteúdo. Mas se eu for à minha mídia, você notará que esses ativos ainda estão na minha biblioteca de mídia. Se eu já quis usá-los novamente em outro lugar no site, então a única outra coisa que eu quero apontar apenas para realmente tipo de puxar para trás a cortina e mostrar-lhe tudo terminou neste site específico. Se eu voltar para a escola da página inicial agora, então vamos aqui e vamos para este projeto ou ver o projeto. Então temos o vídeo no topo. Role para baixo. Tudo parece bom. Esse vídeo foi removido. Certo, vou editar esse item do portfólio e só quero apontar isso. Se você estiver usando salient como você iria cair nesse vídeo. Então nós temos nossa seção principal de construtor de página. Vou em frente e fechar isso, e se rolarmos para baixo, você percebe que realmente a configuração do projeto. Isso é porque eu estou trabalhando especificamente dentro de um tipo de post portfólio agora. Então é assim que estou vendo essa opção. E se eu rolar todo o caminho para baixo, eu também tenho a configuração de cabeçalho do projeto. Então eu fiz a mesma coisa que eu acabei de mostrar a vocês, mas isso é específico para o cabeçalho. Então eu deixei cair no arquivo web m. Eu soltei o arquivo MP quatro no arquivo GV e a visualização ativei a opção de cabeçalho Parallax . Então ele rola com aquela animação paralaxe. Fiz uma tela cheia. Acabamos de ligar isso aqui. Ou podemos definir a altura do cabeçalho da página. Se você quer que ele seja em tela cheia, aqui está um exemplo onde eu poderia apenas fazê-lo dizer, 350 pixels. Órgão alto. Ligue-o aqui para ser tela cheia. Se eu atualizar isso, voltaremos a esta página mais uma vez para ver a postagem, e veremos apenas cerca de 350 pixels de vídeo. Vamos ver como nos saímos. Tudo bem, então agora isso é muito mais fino em vez de tomar conta de toda a janela, que você pode preferir fazer assim em vez disso. Então, novamente, dependendo do tema que você usá-lo, você pode ter opções diferentes. Mas pelo menos agora você sabe onde procurar e como converter esses vídeos para soltar. Os homens são homens. Se você tiver alguma dúvida, por favor, comente abaixo. Além disso, se eu for muito rápido, sei que fico excitado. Eu falo muito rápido. Não se esqueça que é um vídeo. Pode repetir se perdeu algo em particular, mas espero que tenha aprendido muito. E espero que isso tenha sido muito útil para vocês. Tudo bem, obrigado por assistir 27. Por que adicionar um blog, e o que é isso?: O que é um blawg? Bem, nesta seção, vamos instalá-lo em seu site. E antes de mergulharmos, só quero desmistificar isto. Eu sei. Para a maior parte, você provavelmente sabe realmente o que é um blawg, mas não quer mais pensar que realmente tudo um blawg é apenas uma coleção de artigos. Não é nada extravagante. Não tem que ser Cite um blawg. Você não precisa usar o WordPress. Você poderia fazê-lo com páginas HTML estáticas. Realmente? Tudo o que é é uma coleção de artigos que estão em ordem cronológica inversa. Normalmente, a publicação mais recente aparece primeiro. Então, com o WordPress, podemos realmente agendar nossas postagens, e podemos fazer algumas coisas bem extravagantes. Mas novamente, se você sabe como codificar uma página da Web você tem que fazer é adicionar outra página e adicionar alguns links , e essencialmente, você criou um blogueiro ou sua coleção de artigos. Também organizamos nossos blogs com categorias e tags. Isso ajuda a se tornar mais fácil de usar, bem como melhorar a otimização do nosso mecanismo de busca . Qual razão para o próximo ponto faz blogs realmente ajudar s CEO ou otimização motor de busca , Eu diria que sim e não. Então, sim, porque por sua própria natureza é apenas uma coleção de artigos. Então, sempre que você tiver mais conteúdo em seu site, ele vai ajudar com a otimização do mecanismo de busca vai ajudar os motores de busca como o Google sendo Yahoo, o que quer que seja, vai ajudá-los a encontrá-lo. É realmente na publicação regular de conteúdo, então você pode fazer isso apenas adicionando páginas. Não precisa ser necessariamente um blawg. O que é bom sobre um blog, entanto, é que essa classificação das categorias e tags e todos os posts no reboque um ponto vez de adicionar uma tonelada de páginas, ele apenas ajuda a mantê-lo limpo e não ser tão confuso. Então é aí que é realmente útil. E, honestamente, é apenas lançar uma rede mais ampla para os motores de busca encontrarem. Então, novamente, você está adicionando muito mais conteúdo, muito mais texto, que então dá a esses mecanismos de ordenação algo para realmente descobrir e, em seguida, mostrar para as pessoas que estão procurando por ele. Então, a outra maneira que isso realmente ajuda, especialmente com o WordPress, é que você tem estes construído em fez uma tag. Então, seus títulos, suas descrições, suas palavras-chave que adicionamos, como nas imagens em destaque, quando carregamos o logotipo em algumas palestras onde adicionamos todo o texto. Isso, em seguida, dá Google bem novamente qualquer motor de busca, algo para descobrir. Então é aí que a magia realmente acontece. Como Faras, está ajudando seu CEO. A outra coisa é links de página em geral, que os motores de busca podem seguir. Então, quando eles pousam no post e você tem outras categorias em sua barra lateral ou outros links que, em seguida, deixá-lo aranha para fora e rastejar e descobrir todas as outras páginas em seu site. A outra peça para isso é o motor de busca amigável você RL's. Então, sempre que você tinha uma nova página ou novo post no WordPress, seu L a. O topo qualquer que seja o seu nome de domínio é ponto com barra direta qualquer que seja o título da página, e isso é mais uma maneira para os motores de busca para encontrá-lo. Então, concluindo, a informação que acabei de compartilhar com vocês foi escrita originalmente por John Crenshaw há alguns anos, e o link está na descrição aqui. Eu encorajaria você a lê-lo. Ele passa e dá alguns pontos realmente grandes para isso, bem como se você está considerando mergulhar em todo o blog, viu alguns passos práticos e dicas sobre como criar postagens diferentes. Como chegar a idéias quando publicá-las para fazer o resultado máximo para o seu esforço. E por último, eles são super fáceis de configurar, especialmente porque já estamos usando o WordPress, então vamos mergulhar. 28. Configurações de blog do WordPress: criar um blogueiro no WordPress é muito fácil, porque era isso que o Wordpress pretendia fazer desde o primeiro dia. Então o que vamos fazer é continuar com o site em que temos trabalhado. E não importa se você não tem seguido junto por causa de passos que eu vou mostrar que você vai trabalhar , não importa o tema que você está usando, desde que seu próprio WordPress. Então vamos em frente e mergulhe em nosso painel. E o que vamos fazer é criar uma página normal. Vamos chamá-lo de Blawg. Pode dar o nome do que quiser. Pode ser notícia. Poderia ser artigos em destaque. Não importa qual é o nome. Nós estamos indo apenas para criar uma página que irá abrigar todos os posts e post são tipo de páginas como. Mas há post lá apenas designado como no artigo essencialmente, e todos esses posts estão indo para carregar dinamicamente em qualquer página que nós dizemos a ele, também. Então vamos em frente e fazer isso. Primeiro, vamos saltar para as nossas páginas. E quando você criou seu site de demonstração, ele pode ser criado uma página blawg para você. Se não o fez e mesmo se o fez. Você pode adicionar uma nova página e, novamente, você pode chamá-la do que quiser. Neste caso. Já que ainda não tenho um blog, vou chamá-lo de Blawg. Eu vou em frente e bater, publicar, e então eu vou saltar para as minhas configurações vai para baixo para ler. Vou clicar nisso. E agora o que vou fazer é dizer ao Wordpress que a minha página de publicação é esta página blawg . Então agora o meu post blawg vai carregar nesta página, eu vou clicar, salvar as alterações. E agora eu vou voltar para a minha aparição em dois menus e eu vou adicionar essa página blawg ao meu menu. Vamos clicar aqui, clicar em Adicionar ao menu, talvez arrastar isso para cima. Então o contato é a última página lá. Será que vai salvar o menu? Vamos voltar para o site ao vivo, e agora temos o link blawg. Eu vou clicar nisso e você vai notar que eu tenho isso. Olá mundo. Então, esta foi uma das postagens padrão que é instalado quando você carrega o WordPress. Então, dependendo do seu tema, seu estilo pode parecer muito diferente. Uma maneira que podemos controlar isso com o tema saliente. Se eu voltar para editar página, eu não tenho uma função templates aqui no lado. Alguns temas terão que onde você pode clicar em um pequeno menu suspenso e ele terá a opção de, como,portfólio de como, blogueiros em breve controlar o que é essa página. Neste caso, você vai querer vir até o menu saliente, ir até Blawg e clicar sobre isso, e então você terá mais configurações do blog que você pode definir para como você é blawg é exibido. Então, se você passar por aqui quando controlar um monte de coisas de como ele carrega na animação para o tipo de layout é se neste caso, é blawg padrão com uma barra lateral. Ou talvez seja um blawg de alvenaria onde tem todas as imagens. Como o Pinterest faz. Se eu salvar isso rapidamente e voltarmos para a página inicial e depois clicar em Blawg, isso deve mudar o layout. Agora, este mundo Olá não tem uma imagem em destaque, então eu vou clicar neste post muito rápido. Eu vou editar postagem e eu vou jogar rapidamente em uma imagem em destaque apenas novamente. Assim podemos ver como isso funciona. Clique em Definir imagem em destaque. Vou atualizar esse post. Vamos voltar para a página principal do blawg aqui e agora você pode ver como ele puxa nessa imagem. Então, basicamente, se olharmos para o que fizemos no início disto, criamos uma página e dissemos ao WordPress que página ia ser a nossa página blawg. Então, no próximo vídeo, eu vou falar um pouco mais sobre postagens, como configurá-los e como controlar as configurações no WordPress. 29. Postagens no WordPress: no último vídeo, temos o blog dela configurado em nosso site WordPress. Agora eu quero falar sobre posts em geral. Então agora estamos na página de bloqueio, Vamos voltar para o painel e você pode ver isso na barra lateral. Nós temos esta guia post, então se eu clicar sobre ele agora, nós só temos este Hello World Post. É muito fácil adicionar um novo post. Posso clicar nisto. Adicionar novo botão aqui. Eu posso clicar, adicionar novo na barra lateral ou enquanto eu estiver no site e eu tenho essa barra de opções na parte superior . Eu posso clicar em Novo post aqui, então eles vão levar você para a mesma coisa, e esta página vai parecer muito familiar. Parece quase exatamente como uma página normal e nós somos peito. Então, neste caso, alguma vez quis adicionar outro artigo pós barra? Seja lá o que você quer que seja chamado, podemos adicionar um título lá em cima e você vai notar que ele dá o link Perma ou o URL aqui mesmo . E falamos sobre o primeiro vídeo desta seção, onde isso ajuda com a otimização do mecanismo de busca. Então, este será o link real que vai acima em seu motor de busca estão em seu seu l na janela do seu navegador. Então, se você quiser mudar isso, você pode mudar isso e torná-lo algo que é ainda mais s CEO amigável e específico para o seu tópico. Uma vez que você tenha feito isso, você pode adicionar qualquer textura um aqui e talvez por causa deste tutorial vai apenas copiar alguns Epsom quente lá. Lauren Epsom. Para qualquer um de vocês potenciais não designers é apenas texto de preenchimento. Então vamos deixar isso lá dentro. Agora que eu tenho que eu posso continuar a adicionar mais coisas dentro deste post. Então, se você não vir isso, você pode clicar nesta barra de ferramentas de alternância, e você pode adicionar ainda mais estilo ou aparecer. Podemos adicionar mídia. Então, neste caso, você poderia enviar uma foto se você quisesse Teoh e inserido diretamente em seu post em qualquer lugar que ele quiser. Você também pode criar sua imagem em destaque e como falamos brevemente no último vídeo e fazemos algo diferente para que possamos ver o que é isso. A imagem em destaque é o que aparecerá nessa página blawg. Agora, dependendo do seu tema, algumas coisas vão puxar essa imagem em destaque e realmente usá-lo para o gráfico de cabeçalho e vai usá-lo em muitos lugares ao longo de seu blawg desde em torno salient. Você também tem uma configuração de cabeçalho personalizado aqui onde podemos carregar qualquer coisa que queremos para essa página. Vamos em frente e selecionar um arquivo lá. Poderíamos fazer paralaxe. Podemos adicionar todo o tipo de coisas aqui, e eu vou publicar isso agora. Na verdade, antes de eu fazer aquela coisa que eu quero mencionar, você pode salvar um rascunho e voltar a ele mais tarde. Você também pode editá-lo, dependendo se você tem uma equipe trabalhando com você. Ou você pode até mesmo publicá-lo automaticamente para que você possa criar todas as postagens do seu blog em um fim de semana ou sempre que você estiver pronto para ele e, em seguida, agendar todos eles liberar automaticamente a qualquer momento. Então eu vou em frente e acertar Publish. Agora eu posso clicar em ver post aqui para me levar diretamente para o post. Então, há aquela imagem de cabeçalho que fizemos enquanto você rola para baixo. Esta foi a imagem em destaque. Isso é o que aparece em cima. E então isso foi aquele gráfico em linha que nós deixamos cair lá. Se eu voltar para a minha página principal do blawg, você notará que a postagem mais recente aparece primeiro. Felizmente, agora você está recebendo uma melhor compreensão de como as postagens se alimentam na página blawg. Na próxima palestra, vamos falar sobre categorias e tags no WordPress. 30. Categorias e marcas: Vamos falar sobre categorias e tags no WordPress agora. Não penso muito nisso. Na verdade, você já trabalhou um pouco com eles se você tem seguido junto. Quando montamos nossa seção de carteiras com nosso portfólio, tínhamos categorias também, mas elas eram um pouco diferentes. Eles foram, Vejamos, aqui tivemos aplicações de anúncios, branding, design gráfico, fotografia e Web design. Então, essas são apenas categorias, então provavelmente é mais fácil olhar para ele e pensar assim. Quando eu clico nessas categorias diferentes, qualquer que seja o projeto é filtrado nessa categoria. Então vamos fazer a mesma coisa com o nosso blawg, mas vamos dar um passo adiante. Então aqui temos categorias, mas também podemos adicionar tags. Então algo que eu quero apontar quando comecei a pesquisar isso porque para ser totalmente honesto categorias e tags não é algo que eu usei muito no meu passado, porque eu não sou um grande blogueiro ainda. No entanto, estou começando a ser, medida que crio mais desses tutoriais para você. Mas, entretanto, tive de procurar porque queria ter a certeza de que estava a ensinar-te correctamente. Então eu encontrei este ótimo artigo e algo que eu achei realmente interessante. Isso, eu queria salientar, é que Blawg postou claramente se encaixam em uma única categoria. Então novamente, sua categoria, sua principal coisa pai que você está indo para classificar isso para que ele não deve caber em múltiplos. E o exemplo que este autor dá é lembrar de jogar com aqueles blocos quando criança que você teve que colocá-lo através do todo, seja um quadrado ou círculo. O ponto dele é que se for um quadrado, não vai caber em um buraco redondo a menos que você bata nele com um martelo. Então o que ele está dizendo é que, como uma categoria principal, seu post, ele só se encaixa em um desses. Agora você pode ter um quadrado vermelho em um quadrado azul e o quadrado amarelo e tudo isso seria etiquetas. Então, para mim, isso fez muito mais sentido. Além disso, o exemplo dele é dizer, você é um blogueiro de café da manhã e você tem café da manhã. Sinto muito por tomar café da manhã um blogueiro de comida, e você tem café da manhã, almoço e jantar e, em seguida, dentro daqueles que você poderia ter etiquetas de rolagem para baixo bacon aguçado enquanto ou vegetariano, então eu espero que isso faça sentido. Vamos aplicar isso ao nosso próprio blawg. Então o que eu vou fazer é voltar para o meu painel e você vai ver que eu adicionei mais um par postagem desde a última palestra. Só para termos algo com que trabalhar. Vou ao meu painel e depois desço às postagens, e quando eu passar o mouse sobre as ripostes, você notará que temos categorias e tags. Então vamos começar com categorias. Como designer, eu poderia adicionar algo como tutoriais. Vamos em frente e adicionar isso. E quando eu faço isso, lembre-se, ele adiciona automaticamente um slug, assim como fez na palestra anterior, onde falamos sobre adicionar categorias para o nosso portfólio. E quando você faz isso, eu gostaria de ter um tempo para adicionar uma descrição. Por agora, eu não estou simplesmente para tipo de mover através deste tutorial mais rapidamente, mas novamente para a otimização do motor de busca. E como uma boa prática, eu teria um tempo para definir sua descrição. Deixe-me adicionar mais algumas categorias bem rápido. Vamos adicionar freelancing, talvez negócios, e vamos chamar isso de bom por enquanto. E eu vou saltar de volta para a minha área principal de postagens e nós temos aqueles quatro posts que eu acabei adicionar, e agora todos eles têm a categoria sem tampa levantada atrás. Deixe-me ir em frente e editá-los agora só porque nesse artigo ele mencionou que devemos mantê-lo sob uma categoria, e eu concordo que você ainda pode aplicar a quantos você quiser. Assim, o WordPress não limita fisicamente você de adicionar Mauritz. Apenas um bom treino. Então vamos em frente e adicionar apenas uma categoria aqui vai chamá-lo de tutoriais. E então o que eu posso fazer é em uma etiqueta. Então aqui, vamos apenas adicionar outra tag chamada Web design. Então, talvez este seja um post tutorial Web design eu vou clicar em adicionar. E isso adicionará isso a este e a este design de impressão. Um já foi adicionado de outra coisa que eu estava fazendo enquanto eu estava me preparando para esta palestra . Então é por isso que isso já está lá. Eu vou ir em frente e clique em atualizar aqui e agora quando eu ver meu post, dependendo do seu tema, você pode não ver nada diferente. E isso é algo que podemos explorar mais em suas configurações, mas às vezes você verá abaixo pode ser o nome do autor que você verá neste caso eu tenho a data, mas às vezes ele vai adicionar as categorias reais e tags também. Como eu rolou para baixo, você verá que temos o meu post e, em seguida, na barra lateral, e isso é apenas no tema saliente, e atualmente isso é configurado com widgets. Temos nossa categoria tutoriais e uncap grande arised porque isso é o que tem sido aplicado a este. Especificamente, Se eu saltar de volta para a minha página principal blawg e eu rolou para baixo, você vai notar que eu ainda tenho essas duas categorias. E a razão é porque esses são os únicos dois que existem no meu site agora. Mesmo que já tenhamos feito categorias, elas ainda não foram aplicadas a nenhuma Postagem. Então vamos voltar e cuidar disso rapidinho. Vou pular para os postes e você verá de novo. Nós só temos um rato categoria basicamente nossa categoria tutoriais, e então nós temos esses outros padrão em categorizados. Então, em vez de clicar todo o caminho para a página, estou explodindo para fazer a edição rápida. Vou clicar nisso. Vou desmarcar estranhamente arised e vamos adicionar negócios a esta atualização. Vamos até isso e acertar a edição rápida. É fazer este um freelancing. Vamos atualizar isso no último vamos fazer isso. Olá mundo. Vejamos, temos tutoriais, freelancing de negócios, na verdade, licious. Deixe este em Categorizado e eu vou clicar em Atualizar. Agora, quando eu voltar para ver minhas postagens e eu rolar para baixo na barra lateral, você vai ver que temos as diferentes categorias e se eu clicar em qualquer uma dessas, ele irá filtrar exatamente como faz em nosso portfólio. E então, dependendo de como você tem o seu blog configurado, você pode ter suas tags em destaque também. Então agora, por padrão, eles não estão aparecendo. Mas deixe-me mostrar-lhe uma coisa bem rápido. Enquanto estivermos aqui, vou saltar para a minha aparência e descer os widgets dos pés. Então agora, barra lateral do meu blog que estamos olhando é controlada por todos esses widgets aqui. E o que eu posso fazer é descer e eu tenho esse widget de nuvem de tags. Vou me arrastar. Vamos colocá-lo logo abaixo das categorias que ele salvar e Agora, quando eu saltar de volta para aquele blawg e eu vou para a minha barra lateral na escola para baixo, você pode ver que as etiquetas que eu usei até agora aparecem. Então, se eu clicar na tag web design, qualquer post que tenha essa categoria Web design aparecerá. Então, espero que isso ajude a esclarecer o que uma categoria e o que é uma tag e WordPress e como usá-los . E a próxima palestra. Vamos dar uma olhada em como configurar comentários no WordPress ou como desativá-los causa provavelmente, você não está pronto para comentários ainda, e dessa forma você pode evitar receber spam. 31. Comentários no WordPress: ter funcionalidade de comentário em seu blawg vai ser realmente útil para o engajamento , bem como é uma outra maneira deter s CEO em seu site. É uma maneira que o Google ou o Yahoo estão sendo, ou qualquer coisa que possa realmente ver as pessoas interagindo com seu site. Então, em muitos casos, comentários podem ser uma grande coisa. E, de fato, é assim que você pode obter muito mais inspiração para quais artigos escrever. À medida que as pessoas se envolvem com sua postagem e você pode ver o que é popular. No entanto, o lado negro da Internet, como você sabe, são todos os trolls e todos os inimigos que vão postar coisas negativas, ou todas as pessoas que iam spam e postar links para outros sites que você provavelmente não quer destaque em seu site. Então vamos dar uma olhada nos comentários rapidamente no WordPress e mostrar-lhe como controlar isso. Eu vou começar por saltar para o meu painel novamente e você vai ver que temos a guia de comentários dele na barra lateral, então eu vou clicar sobre isso, e você pode ver agora qualquer um dos comentários que temos, se temos algo pendente qualquer coisa aprovada qualquer coisa que tenha entrado em spam ou qualquer coisa que você tenha adicionado ao lixo. Portanto, esta é uma maneira de você ver rapidamente o que está acontecendo em seu site Antes de chegarmos a essa fase, entanto, você pode nem ter comentários ativados. Ou talvez você faça quando você quer que eles saiam. Então vamos dar uma olhada em como controlar isso. Primeiro, eu vou descer aqui para as configurações, e eu vou descer para a discussão e você pode ver que essas são todas nossas discussões . São configurações de comentários. Então, à medida que você lê tudo isso, há muitas configurações diferentes que você pode querer controlar, então elas são bem simples de ler o que são. Mas os que eu mudo mais são permitir que as pessoas postem comentários sobre novos artigos ou permitir notificações de link de outros blogs ou tentar notificar qualquer blawg vinculado a partir dos artigos. Então, geralmente eu tenho todos esses desativados por padrão. Se isso acontecer a qualquer momento que você fizer um novo post, ele vai permitir que as pessoas comentem sobre esse post, e geralmente o que acontece é, se eu não pretendo que isso esteja ligado, então eu vou receber um monte de comentários de spam, e isso vai começar a realmente afetar meu site. Se você vai ter isso em, eu com certeza deixar em comentário deve ser aprovado manualmente. E assim ele não vai direto para o seu site imediatamente. Pelo menos dessa forma, ele vai para esta barra lateral de comentários onde você tem que aprová-lo fisicamente antes de carregar na página da Web. Então, novamente, medida que você começar, eu recomendo desligar isso a menos que você esteja tentando criar uma comunidade envolvente em seu blawg. Agora digamos que você já tenha um monte de postagens de blog e se esqueceu de ter essa funcionalidade ativada ou vice-versa. Digamos que você tenha um monte deles e todos eles tenham comentários ativados e você queira desativá-los. Bem, é muito fácil de consertar. Você pode vir aqui para postagens, e eu posso selecionar tudo isso. Vamos para ações em massa e vamos clicar, editar, clicar , aplicar e, em seguida, o que eu posso fazer é aqui embaixo sob comentários. Posso clicar, permitir ou não permitir. Então agora eles não são permitidos no meu blawg. Mas vou clicar em Permitir e, em seguida, clicar em Atualizar. E agora, se eu pulei qualquer uma dessas postagens de blog, e eu vou clicar em ver post se eu rolar para o fundo. Dependendo do seu tema, você deverá ver a caixa de resposta de licença ou algo semelhante na parte inferior, onde as pessoas podem realmente clicar aqui e digitar um comentário e, em seguida, clicar em Enviar. Comentário. Então, novamente, é assim que você vai obter um monte de spam e um monte de outras coisas para que possamos falar sobre diferentes plugins que ajudarão a bloquear qualquer conteúdo de spam. Então, agora, se eu rolar de volta para cima, você pode ver que anexado a este post é um comentário. E se eu voltar para o meu painel e ir para baixo para comentários, eu posso ver que outro comentário foi deixado, e isso é praticamente tudo em relação aos comentários. A única outra coisa que te mostraria é se saltarmos para ligar e clicarmos. Adicionar novo. Você pode realmente procurar comentários, e você pode ver que há um monte de diferentes plugins de comentários que o ar realmente útil . Um dos mais populares que geralmente vem por padrão com WordPress é AC é atendido. Não sei se estou a dizer isso, certo? Mas se verificarmos mais detalhes, este é um que eu acho que você tem que assinar se você vai usá-lo ao máximo de seu potencial. Mas pelo que eu vi, este é um dos melhores filtros de spam que você pode obter para seus comentários em seu bloco WordPress . 32. Introdução a formas de contato: Se você está acompanhando, nós temos um portfólio. Temos um blawg com uma home page assassina. Agora o que precisamos fazer é adicionar uma página de contato, porque posso garantir que essa será uma das coisas que seus clientes vão pedir. E uma coisa que você provavelmente deve fazer, mesmo para o seu próprio site, é criar um formulário de contato. Isso faz algumas coisas para você. Um deles é que protege o seu endereço de e-mail para que eu não recomendo colocar o seu e-mail em seu site WordPress, a menos que você quer um monte de conteúdo de spam eventualmente quando você for encontrado. Então, um formulário é uma ótima maneira de ajudar a proteger isso, bem como eliminar os chutadores de pneus. E o que eu quero dizer com isso é, se você vai ser um desenvolvedor web ou designer gráfico ou qualquer coisa assim, até mesmo, eu acho que até mesmo, a pessoa de negócios em geral um formulário pode ajudar a ser uma barreira para a entrada e uma espécie de portão. Assim, qualifica seus compradores. Então, ao invés de qualquer um ser capaz de entrar em contato com você e fazer perguntas bobas que vão acontecer. Isso ajudará a orientá-los e certificar-se de que eles são um comprador que está pronto para o seu serviço. Então, por exemplo, você pode perguntar, quão grande é a sua empresa, ou o quê? Seu orçamento de marketing e talvez em um dos “drop downs”. Talvez você tenha, tipo, $1000 como sua compra mínima. Então é isso que você não está recebendo, pessoas que querem, você sabe, um logotipo de US $200 ou um site de US $200, certo? Assim, o outro bônus para este ou outro benefício é dependendo do formulário de contato. Usa-o tu. Parabéns, todos esses contatos e todas as entradas em um só lugar. Então, há alguns formulários de contato. Eu recomendaria o primeiro 1 que você provavelmente já tem se você foi seguindo junto. Se entrarmos em nossos plugins aqui, este formulário de contato sete. Então, novamente, se você está acompanhando. Se você tem tema saliente, Eu acho que talvez até mesmo o tema X provavelmente instalado isso por padrão. Se você não obtê-lo, é realmente fácil ir para adicionar novos e plugins, Pesquisar para contato Formulário sete retorno e você verá que ele puxa para cima. E uma das maneiras que sabemos que este é um grande plug in novamente este foi atualizado muito recentemente e tem mais de 1.000.000 instalações ativas. Então, entre isso e a alta classificação, você sabe que é uma solução muito boa agora. Há muitos outros formulários de contato se percorrermos aqui de diferentes opções de estilo e outros plugins. Mas o Formulário de Contato 7 é de longe o mais popular. A outra forma de contato são formas de gravidade. No entanto, este vem com um preço, então você tem que se inscrever para usá-lo. Mas recomendo este. É muito fácil de usar. Parece bonito, e uma coisa que eu gosto mais sobre formas de gravidade versus Forma de contato 7 é como ele funciona, e o que eu quero dizer especificamente com isso é Formulário de Contato 7 basicamente atua como um intermediário . Então alguém entra lá. Eles preenchem o hit enviar, e tudo o que ele faz é disparar um e-mail para o seu endereço de e-mail. Bem, algo que pode acontecer é se não estiver configurado corretamente, ou talvez seu servidor caia ou algo estranho acontecer, o que já aconteceu comigo antes. Esse e-mail não chega e porque tudo o que ele está fazendo é enviar um e-mail essencialmente Se ele não passar, ele não é salvo em nenhum lugar, então você vai perder esse contato. E então você tem pessoas dizendo: “Ei, “Ei, eu te mandei um e-mail e você nunca me respondeu. Enquanto formas de gravidade quando ele dispara para enviá-lo para você, também copia para o seu banco de dados WordPress. Então, onde isso é legal é que todos os seus contatos ao longo do tempo podem estar em um só lugar. Então, se você quiser, você pode exportar tudo isso como uma folha de valores separada por vírgulas, e você pode carregar esses contatos em algo como e-mail, chimpanzé ou contato constante ou alguma outra plataforma de e-mail marketing. Então, é super útil para no futuro. Agora eu sei que existem alguns outros plugins que você pode adicionar ao Formulário de Contato sete para fazê-lo fazer coisas semelhantes também. Mas é muito mais aros para saltar, então eu sou um grande fã de coisas que funcionam bem, que parecem boas e apenas cuidar das coisas e tornar o meu trabalho mais fácil. Então, novamente, é por isso que eu recomendo fortemente formas gravitacionais. Não só isso, mas tanto o tema X quanto o tema saliente com certeza construíram elementos. Então, o que eu quero dizer com isso? Se você se lembra, quando formos a qualquer uma das páginas aqui, deixe-me apenas pular em uma rapidinho. Não importa qual deles. Vou ao meu construtor de páginas. Ele irá adicionar um elemento. Deixe-me digitar isso bem rápido. Então o formulário de contato sete já está instalado, então ele aparece aqui. Mas se eu tiver formas de gravidade instaladas que mostrarão o bem do Oppa, e ele tem estilo personalizado, e você também pode estilizá-lo sozinho. Então o que vamos fazer na próxima palestra é olhar como realmente configurar o Formulário de Contato 7 e como configurar formas de gravidade. 33. Como instalar o formulário 7: contato Formulário sete é realmente simples de configurar, no entanto, configurá-lo pode ser um pouco complicado às vezes. Então, o que vamos fazer é instalar o Formulário de Contato 7 neste primeiro vídeo, e, em seguida, no próximo vídeo, vou falar um pouco mais sobre como controlar as configurações e torná-lo exatamente como você quer que ele seja. Certo, vamos começar instalando o Formulário de Contato 7. Então vá para os meus plugins. Página e eu posso clicar em adicionar novo aqui na barra lateral ou e clicar em Adicionar novo na parte superior direita aqui e eu vou procurar o Formulário de Contato sete. E deve ser a primeira coisa que carrega aqui no canto superior esquerdo. E se não, é isso que estamos procurando. Então, vou clicar em instalar agora e depois. Uma vez terminado, a instalação do botão irá realmente mudar. Você clica bem aqui no mesmo dedo do pé do botão, ativá-lo, e isso realmente liga aquele plug dentro do WordPress. E assim que fizermos isso no lado esquerdo, você notará que adicionou uma guia de contato. Então, clique nisso bem rápido, e ele nos deu um formulário de contato padrão logo fora do portão. Então nem temos que fazer nossa própria forma agora, o que é muito legal. E o que vamos fazer é usar este código curto aqui ao lado deste formulário. E ainda não falámos sobre códigos curtos, por isso deixa-me dar-te um resumo rápido. Basicamente, códigos curtos são uma maneira de você adicionar rápida e facilmente interatividade diferente ao seu site. Então, quando você tinha um plug in, como esta página de formulário de contato, eu posso realmente copiar o código curto colado em qualquer página ou qualquer widget ou qualquer lugar no rodapé e esse formulário inteiro realmente será exibido em seu lugar. Então deixe-me mostrar como isso funciona. Vamos saltar por cima de duas páginas bem rápido. Vou fazer uma página de teste. Você não tem que dar um nome. Qualquer coisa especial. Chamamos isso de teste. Não importa o que você chama, e eu vou clicar dentro do editor WordPress aqui e notar que eu estou na guia visual e não no peito da guia de texto. Comando V para colar o código curto que eu tinha copiado para a minha área de transferência. Eu nem tenho que publicar a página ainda. Eu só vou apertar a pré-visualização e você vai notar nesta página de teste. Esse formulário de contato vem lindamente. Ele anima que é interativo, e eu posso realmente ir em frente e preenchê-lo agora mesmo. Então vamos testá-lo bem rápido. Então coloque o meu nome. É colocado em um e-mail falso testando o formulário e fez funcionar. Certo, foi quando eu apertei Enviar e agradeço sua mensagem. Foi enviado. Tudo bem, bem, onde é que ele foi enviado? Vamos dar uma olhada nisso rapidamente porque estamos trabalhando localmente e não estamos usando um host real no momento. O formulário de contato não se comportará como você esperava. Você terá que colocar wordpress em um host riel ou instalar outro plug no reboque. Fazê-lo funcionar como você acha que seria como faras preenchendo isso e e-mails diretamente para você . Mas uma coisa que eu descobri que é realmente legal sobre o local é que eles criaram um utilitário apenas para este propósito. Então, se você acessar o site em que você está trabalhando e depois aqui, nós clicamos em utilitários. Tem um utilitário de porco masculino, então eu vou clicar nisso , abri-lo e você vai notar que eu posso ver o e-mail de teste que eu acabei de enviar. Então, se eu cozinhar nisso, você pode ver exatamente quem era de quê. endereço de e-mail deles. Waas com Assunto Waas e o corpo da mensagem. Então esta é uma ótima maneira de se certificar de que seu formulário está configurado corretamente e que tudo parece bom antes de colocá-lo em um servidor ativo. Então, vamos entrar em detalhes sobre como realmente personalizar o formulário de contato no próximo vídeo. Mais uma coisa que quero te mostrar. Vamos voltar para a nossa página principal. Então eu só te mostrei como usar um código curto para colocar o capataz. Mas se você está construindo com um tema como Salient ou X ou mesmo divvy e você tem esses construtores de página pré-construído , então eu vou ligar o meu construtor de página clicando nesse botão aqui e agora em, disse o editor WordPress. Eu tenho este compositor visual configurado e você vai notar que converteu automaticamente esse código curto para este elemento do formulário de contato sete. Então deixe-me mostrar-lhe isso bem rápido. Vamos fingir que não estava aqui, ia bater na lata de lixo para removê-lo. E vamos eles estão usando compositor visual para estilizar uma página. Eu poderia clicar no botão de adição e você vê todos esses elementos diferentes que podemos adicionar, como cabeçalhos centrados e imagens e todos os tipos de coisas. Bem, por padrão, temos o formulário de contato dele sete elementos, então eu vou clicar nisso. E em vez de ter que usar um código curto, eu poderia apenas apontar e clicar para adicionar isso. E há até um menu suspenso. Então, se eu tivesse vários formulários de contato para colocar aqui, todos eles apareceriam aqui também. Então é realmente apenas apontar e clicar. Basta adicionar formulário de contato como um elemento irá clicar no menu suspenso para selecionar o formulário que queremos usar. E atualmente só há um que eu vou acertar. Salve as alterações e, em seguida, eu vou clicar em pré-visualização e você vai notar que ele faz exatamente as mesmas coisas. Temos a mesma forma, instalado apenas um método diferente, mas conseguimos o mesmo resultado. Espero que esteja rastreando comigo. Mas eu quero lembrá-lo se você se perdeu no caminho. Primeiro, você sempre pode, obviamente, rebobinar e assistir isso porque é um vídeo. Mas, segundo, o mais importante, certifique-se de se juntar ao grupo do Facebook que criamos. É uma grande comunidade onde, se você se perder e tiver dúvidas, você pode entrar em contato com as pessoas ou se tiver ideias, ou se quiser feedback sobre o que está trabalhando, é um ótimo lugar em uma grande comunidade para ajudar uns aos outros como começamos a trabalhar e aprender mais sobre o WordPress. Então, novamente, se você ainda não verificar o grupo do Facebook e se inscrever. Deve haver um link anexado a este vídeo. E se não, deve haver um link anexado ao vídeo introdutório no início deste curso. E agora o que queremos fazer é ir em frente e dar uma olhada no próximo vídeo é partes como estilizar olhos Formulário de Contato sete e adicionar diferentes campos de formulário e controlá-lo configurações para onde ele e e-mails e todo esse tipo de coisas boas. Então fique atento para a segunda parte da instalação do Formulário de Contato 7 34. Configure suas novas novas configurações de formulário de contato: Então, agora que temos o formulário de contato sete configurado e funcionando e tudo está bom lá, vamos em frente e olhar para algumas dessas configurações e como configurar seu formulário e fazer com que seja exatamente o que você deseja. Então, as primeiras coisas primeiro. Este é um ótimo lugar para eu apontar que se você já está sobrecarregado olhando o que está acontecendo aqui na barra lateral você pode querer considerar, basta ir em frente e comprar formas de gravidade. Em vez disso. É muito mais simples trabalhar com a sua gota de dragão, e é muito mais bonito para trabalhar. Dito isto, se quiser ficar com a versão gratuita, vamos arregaçar as mangas e mergulhar. Então eu tenho minha tela aberta aqui em tela dividida, então nós tipo de ver o que está acontecendo sob a guia de contato dentro do WordPress. Então, vamos clicar nisso. Então, você vê, eu acabei de pousar bem aqui nesta página de contato. Clique neste formulário de contato um. E agora temos quatro guias diferentes com as quais podemos trabalhar. Nós temos nossa forma principal, então isso controla o que são forma realmente parece, vê-lo aqui ao lado. Ele controla o que as caixas de entrada reais são. Temos a nossa guia masculina que controla como enviou para quem enviou. Temos as nossas mensagens. Então, por exemplo, se eu tentasse enviar este formulário agora, você pode ver que ele diz que este campo é obrigatório e um ou mais campos têm ar. Todo esse tipo de coisa pode ser configurado na guia de mensagens aqui, e temos configurações adicionais. E para ser totalmente honesto, eu nunca usei esta aba. Então, se você gostaria de saber mais sobre o que esta guia faz ou como estilizar este formulário ainda mais, eu só devo salientar rapidamente que você tem essas docas em um Q e guias de suporte aqui ao lado. Então sinta-se livre para mergulhar e aprender ainda mais sobre isso. Mas o que eu quero fazer agora é apenas mostrar a vocês basicamente o que eu mudo sempre que eu entro em contato Formulário 7 e o que eu configurei para meus sites. Então vamos voltar à forma e vamos tentar desconstruir o que está acontecendo aqui. Então este é o formulário padrão e aqueles na verdade provavelmente não estavam lá. Era eu brincando com as coisas mais cedo. Então vamos dar uma olhada nisso. Temos o nosso rótulo, que é o que aparece acima do contato ou do campo de entrada. Então, neste caso, seu nome e é obrigatório aparece aqui, e então temos uma caixa de texto e uma caixa de entrada. Este pequeno Asterix significa que é um campo obrigatório, e então este é o nome do campo. Então, como isso funcionaria? Vamos ir em frente e ir até o fundo é se eu quisesse adicionar qualquer um desses tipos de elementos, eu apenas clique nele, e eu posso usar esta caixa para dar um nome a ele. Então talvez isso seja como, um, um, celular ou algo assim, e então clique no campo obrigatório e você notará aqui em baixo que está construindo o código curto para mim. Então, como eu clique no campo obrigatório que adicionou que Asterix lá para mim por padrão, eu poderia dar-lhe um valor padrão. Então, digamos que você queria ser preenchido com algo bem fora do portão assim. Eu posso usar este Texas, um lugar detentor no campo e você vai notar que ele adicionou isso no meu código curto. Ah, aperte a etiqueta de inserção. É salvar. E agora, quando eu atualizar esta página, você verá que ela tem este campo de formulário aqui em baixo, e ele tem o número como um texto de espaço reservado. Então, Suze, eu clico nele que vai embora, e eu poderia começar a digitar meu próprio número. Mas você notará que quando eu atualizar esta página, ela não tinha nenhum rótulo acima dela. Eu não sabia o que estava aqui em cima. Então o que podemos fazer é copiar este rótulo não importa. Qual deles foi? Comando C Comando V para Colar. Ah, pegue essa etiqueta de fechamento. E agora eu salvo. E eu nem me importo que isso diga assunto. Neste momento, só quero mostrar-te como isto funciona. Vamos atualizar esta página. E agora eu tenho o assunto acima e você vai notar que um texto de espaço reservado foi embora. Então há pequenos insetos como este que eu não tenho certeza se você vai encontrar esses ou se é apenas do meu lado. Mas descobri que faz coisas assim de vez em quando. Mais uma vez, outra razão pela qual eu provavelmente sugeriria saltar para formas gravitacionais. Então, de qualquer forma, vamos continuar. Eu só vou excluir este texto de espaço reservado, principalmente para mostrar que você pode trabalhar dinamicamente aqui dentro. E esta é apenas uma área geral de entrada de texto, essa coisa toda para que você possa misturar em todos esses códigos curtos. Mas eu também posso misturar em HTML também. Então, se eu salvar isso, se você sabe como usar qualquer tipo de tags HTML, CSS ou qualquer coisa assim que funciona aqui também. OK, então agora o que precisamos fazer é configurar como isso é enviado. Então, se eu clicar na aba masculina agora, ela foi preenchida com o padrão do local. Mas o que você vai querer fazer é colocar em seu endereço de e-mail pessoal ou onde quer que isso esteja sendo enviado no campo para. O campo de origem é gerado dinamicamente. Então essa variável de nome era código curto ou como você quiser chamá-la. Se voltar aqui para se formar, verá que temos o nome do seu nome aqui. Também temos o seu e-mail. Temos o seu assunto, a sua mensagem, e pode chamá-los do que quiser. O que você quiser. Isso é exatamente o que o formulário de contato 7 colocou aqui. Então, quando eu voltar aqui para o correio sempre que ele enviado sempre que ele enviou isto será o que foi colocado nesta caixa de entrada aqui. Por enquanto, sempre deixe isso em paz, então deixe-o como WordPress em qualquer que seja o seu nome de domínio é dot com. Assim funciona corretamente. Seu assunto provavelmente será qualquer que seja o nome do seu site, além de entre aspas, seja qual for o assunto que foi colocado na caixa de texto aqui ou na caixa de entrada para que você possa mudar para o que quiser. Normalmente o que eu faço é colocar contato do meu site ou contato de, você sabe, qualquer que seja o seu site é ponto com Dessa forma, é um lembrete rápido de por que isso estava vindo até você. Isso eu costumo deixar sozinho e, em seguida, o corpo da mensagem é novamente. O que você quiser, você pode colocar o que quiser aqui. Então, se pudéssemos puxar o porco macho crescer rápido, você pode ver que todo este corpo de mensagem foi o que foi enviado através do formulário de contato para que eu possa voltar aqui e configurar isso. E se eu fosse para ADM ou, hum, campos de formulário Mawr, eu quero ter certeza de que eu adicionei esses dois. Este correio também enviou. Por isso não te esqueças do Adam Teoh quando fizeres isso. Então vamos em frente e ver como isso funciona. Vou voltar à forma e vou destacar tudo. Ele manda C Jim voltar para o correio. Eu só não posso comandar V para trazê-lo aqui só para que eu possa meio que desconstruir o que está acontecendo. Então vamos eu quero adicionar esta caixa de telefone celular. O que eu faria é só dizer, celular. E então, em vez de ter essa caixa de texto, eu só queria ser o código curto do celular. Então você está rastreando comigo? Espero que isso faça sentido. Sei que é um pouco confuso. É assim que eu trabalho. Só estou a tentar mostrar-te o que faço. Então, se você tiver dúvidas se não fizer sentido, por favor, comente neste vídeo ou no F A Q. Então, eu posso atualizar este vídeo se você estiver acompanhando e ele está funcionando muito bem e incrível. Tudo bem, então agora que temos que ir? Como queremos. Eu só vou bater, salvar. E agora, se eu preencher este formulário e enviá-lo, ele teria aquele conteúdo adicional de celular lá também. Tudo bem, então é basicamente isso para o formulário de contato sete. Espero que isso faça sentido novamente. Se você se perdeu, por favor, certifique-se de se juntar ao grupo do Facebook para que você possa entrar em contato com qualquer pessoa lá e fazer perguntas. Você também tem suas docas e F A Q e guias de suporte que podem fazer um trabalho melhor de explicar seu próprio produto que eu estou fazendo atualmente. E por último, mas não menos importante, no próximo vídeo, vamos mergulhar em formas de gravidade para que você possa ver como isso funciona e talvez seguir essa rota em vez disso. Tudo bem, obrigado por assistir 35. Uma alternativa de avança Forms: neste vídeo, vamos dar uma olhada no que as formas de gravidade podem fazer por você. Então primeiro eu vou fazer é ir para meus plugins e eu vou desativar o formulário de contato sete e você pode deixá-lo funcionando. Você poderia realmente ter ambos o formulário de contato sete e formas de gravidade funcionando ao mesmo tempo . Não vai afetar nada. Mas como se eu fosse usar formas de gravidade, não precisaria do formulário de contato 7. Então, eu só vou a uma limpeza e apago isso. Agora eu vou pular para formulários de gravidade, e eu já tenho uma conta, e eu já fiz login, e quando você entrar, você pode ver quais são suas licenças. E eu tenho uma licença comercial aqui com um número de licença, e eu também posso ir para downloads para ver exatamente o que eu tenho que baixar. Então eles têm alguns lançamentos beta diferentes. Você tem as principais formas de gravidade, e então há alguns também adições básicas que estão disponíveis também. Então agora tudo o que vou fazer é fazer o download das principais formas de gravidade Plug in. Eu vou voltar para a minha guia de licenças, e eu vou clicar duas vezes e copiar essa licença para a minha área de transferência. E então vamos saltar de volta para a nossa área de plug INS e eu vou clicar em Adicionar Novo. E desta vez, em vez de procurar o meu plug in como fizemos com o Formulário de Contacto 7, vou clicar , carregar , ligar, e posso escolher o ficheiro ou sei que está aqui em baixo. Minha pilha de downloads. Eu só vou arrastar e soltar e colocar bem em cima disso. Vamos clicar, instalar agora e, em seguida, instalado com sucesso. Então vamos ativar esse plugue. E lá vai você. Isso é praticamente tudo. Agora, se novamente, ele vai dizer, Registrar sua cópia de formas de gravidade para receber acesso a atualizações automáticas e suporte. Então este é o lugar onde se você, se você tiver os arquivos de download primeiro, você não tem o registro da chave de licença ainda. Você receberá essa mensagem para que você possa clicar em Comprar um agora, ou podemos entrar em configurações para formulários de gravidade, e podemos simplesmente colar essa chave de licença aqui diretamente. Em seguida, manteremos as atualizações em segundo plano habilitadas. Tudo bem, eu vou clicar em seguida, e eu não vou usar nenhuma moeda. Mas eu posso selecionar isso para dólar americano já que estamos nos Estados Unidos aqui e tudo o resto por agora está bem. E podemos voltar e alterar qualquer uma dessas configurações a qualquer momento. Mas agora, todas as abelhas sozinhas e isso é praticamente tudo. Assim como você fez com o formulário de contato sete, ele criou uma aba de formulários nos lados. Veja, temos mais algumas opções. Podemos voltar às configurações a qualquer momento. Se precisar mudar isso, podemos ver todos os formulários. Ou agora você apenas clica. Crie um formulário. Então, isso nos levará para a nova guia de formulário. Basta chamar este contato conosco apenas um formulário de contato simples e eu criar formulário. E assim, temos o nosso construtor de formulários bem aqui. Então isso é muito mais simples do que o Formulário de Contato 7. Eu posso clicar aqui sobre o que eu quero dos campos padrão. Clique aqui e dê um nome a ele. Então este rótulo de campo pode ser Talvez este seja o primeiro nome e você pode dar-lhe uma descrição que você poderia torná-lo obrigatório, para que você possa ver como isso é muito diferente do Formulário de Contato 7. É muito apontar e clicar. Você pode alterar a aparência, e há até algumas guias avançadas que você pode trabalhar aqui também. Então ah, muita flexibilidade e super fácil de usar. Vamos dar uma olhada nesses campos avançados aqui em baixo, então eu fiz uma guia de nomes. Mas já há uma guia de nome aqui que podemos adicionar. Eu vou clicar nisso, e ele lhe dá um nome e sobrenome já sem ter que configurar isso. Talvez você queira um endereço lá e veja que acrescenta tudo isso. Talvez você queira um número de telefone, endereço de e-mail ou upload de arquivo, e você pode ver como isso é super fácil de trabalhar. Então eu vou seguir em frente e atualizar, e então, a partir daí, o que eu posso fazer é ir para a minha configuração. Então, sobre essas quatro guias na parte superior, temos nossas configurações que controlam como o formulário se comporta. Então, por exemplo, aqui está o básico do formulário. Como é que se chama? O que A descrição que você pode alterar algumas das opções de layout. Você pode fazer muito mais aqui em baixo. O que é realmente importante é a guia de confirmações. Assim que alguém apresentar isso bem, como ele se comporta? Então, se eu clicar nele agora, ele vai enviar esta mensagem e ele vai realmente configurar um pago Desculpe, um texto bem no meio de onde o formulário costumava estar. Então só vai aparecer isso, mas você tem a opção de redirecionar para uma página totalmente diferente. Então, talvez depois que eles enviá-lo, você enviá-los para uma página de agradecimento inteira que você criou em seu site, ou você pode redirecionar aqui para um u R L. real Então talvez seja um site completamente. Então é muito bom que isso seja tão flexível. Ele permite que você realmente disque exatamente como você quer se comportar. Depois, há notificações. Assim, a forma como as notificações funcionam é quando o formulário é enviado, você quer saber que alguém realmente preencheu o formulário. Então agora, por padrão, ele vai enviar um aviso para quem o administrador está no site. Você pode verificar isso, descendo aqui para a sua configuração. Então, vou aguentar. Olha, chave de homem e clique bem rápido. E assim, fazendo isso, abri uma nova guia, e aqui podemos ver que atualmente, o administrador padrão aborda esse espaço reservado de e-mail Dev Desh que o volante colocou aqui. Então você quer se certificar de que você tem seu endereço de e-mail real aqui. Então, o que quer que esteja aqui é o que vai ser enviado para esta notificação de administração do Almirante. Certo, então há algumas configurações diferentes que podemos discar aqui. Estes são todos muito simples. Então, há simples para você olhar através e ver o que você quer fazer. E depois temos entradas. Então o que é realmente legal sobre isso é que toda vez que alguém envia uma entrada em seu formulário, essas entradas são capturadas no back-end do seu site aqui. Então a razão pela qual isso é tão bom é digamos que seu anfitrião tem problemas ou algo estranho está acontecendo. Ou talvez sua conta de e-mail esteja bloqueando, você sabe, mas cite spam. E talvez não seja spam. Certo? Então, sempre que você tiver uma pergunta sobre falta na entrada. Você pode vir aqui para formulários e descer as entradas e você verá cada lesão que já aconteceu naquele formulário. Isso é incrível. É uma grande ajuda, especialmente quando as coisas dão errado. E eu tive que acontecer muito onde isso tem sido realmente um dedo do pé salva-vidas ter essa informação de contato tão útil para ter. E então, é claro, temos um botão de pré-visualização. Você clica sobre isso e você pode ver como o formulário pode ser parecido. E então, dependendo do tema que você tem, quero dizer, pode parecer muito diferente. Parecerá muito diferente, mas pelo menos você pode ver como isso é definido. No que diz respeito ao formulário. Agora eu não quero fazer é dar uma olhada em como incorporar um formulário, então vamos em frente e saltar sobre duas páginas e eu vou saltar para nossas páginas de contato atuais ao vivo no site clique editar. Então, se apertarmos a pré-visualização bem rápido apenas para nos lembrar o que isso parece, este é o formulário de contato que ele tem atualmente no site e porque é um host local . Não temos o mapa dele aparecendo no momento, mas quando migrarmos isso aparecerá. Então o que eu quero fazer é tentar e colocar esse formulário bem aqui neste espaço aberto. Então, vou fechar esta pré-estréia. Bem, Jim, volta para a página principal e eu vou clicar neste pequeno sinal de mais aqui. E desta vez eu vou digitar formas de gravidade e você vai notar que quando eu fiz esta demonstração com o formulário de contrato, sete formas de gravidade não apareceram porque eu não tinha instalado ainda. Mas agora que está instalado, ele aparece como um elemento dentro do compositor visual. Então agora o que eu posso fazer é clicar neste menu suspenso e apenas escolher o formulário de contato que eu escolhi. Posso escolher se quero ou não mostrar o título. Eu poderia exibir a descrição do formulário neste caso em ambos. Vou deixar isso como não permitir que o Ajax seja totalmente honesto. Deixo isto em paz e deixo que seja como é seguro e vou pré-visualizar as mudanças. E há meu formulário de contato com todos os campos de entrada que selecionamos. Então você pode ver como as formas de gravidade são muito, muito fáceis de trabalhar. Agora, se você quisesse adicionar formas de gravidade e você tivesse um eles não tinham um construtor de páginas como compositor visual estavam usando um tema diferente. E você não está vendo todo esse layout de compositor visual. É muito fácil fazer com códigos curtos, assim como fizemos com o Formulário de Contato 7. Então o que eu vou fazer é ir às páginas. Vou abrir uma nova página. Eu só segurei na tecla de comando para clicar. Abra isso em uma nova guia. Eu não queria deixar aquele lugar aqui e vamos fazer uma nova página. E quando você tem formulários de gravidade instalados e você está usando a janela de construtor de página regular aqui que WordPress tem, você deve ver este botão de formulário de anúncio para que eu possa clicar sobre isso. E então, a partir daí eu posso selecionar o que anterior quer adicionar, e isso me dá algumas opções aqui também. Eu posso até adicionar algumas opções avançadas, que eu realmente nunca uso. Mas vou clicar em inserir formulário, e agora vemos um código curto, assim como o que vimos com o Formulário de Contato 7. Então você pode usar isso em qualquer página e em qualquer lugar, seja no rodapé ou uma área de widget de barra lateral ou o que seja. E se você não vê isso, apenas Google, vamos abrir uma nova página neste Google para formas de gravidade código curto para que você sempre possa ir por esse caminho e abrir a documentação deles que rolam aqui para baixo. E aqui está o mesmo código que eles deram para que eu pudesse copiar e colar isso. Então, apenas tente dar maneiras de descobrir rapidamente como incorporar este formulário de contato . Então, espero que tenha sido útil. E novamente, a gravidade forma um super fácil de trabalhar. Claro, a desvantagem é que não é de graça. Mas a longo prazo, descobri que tem ótimas opções e coisas que funcionaram muito bem. E é basicamente isso pessoal. Formas de gravidade é realmente simples, e eu recomendo altamente 36. Meus de hospedagem: WordPress. Hospedagem é um grande tópico em algo que muitas pessoas são realmente apaixonadas. Muita gente que vai jurar por um anfitrião e dizer que o outro é o pior que já viu e você pode ter alguém que diga exatamente o contrário. Então, na minha experiência, eu tive muita sorte com Go Daddy. O suporte ao cliente deles é muito bom. Eles estão hospedando plataforma Sua hospedagem compartilhada pode ser um pouco lenta. E o que isso significa é que você tem um host ou computador que está compartilhando seu recurso é com muitos sites. Portanto, dependendo de com quem você está compartilhando, você pode experimentar tempos de carregamento lentos e coisas assim. Assim, a hospedagem WordPress gerenciada que eles oferecem é um passo acima do plano de hospedagem compartilhada. E então você tem outros hosts como Blue Host e WP motor e site Ground e Dream host, e eu poderia continuar e novamente, todos eles têm ótimas opções também. Então é muito difícil para mim dizer exatamente o que você deve fazer. Eu acho que você vai precisar fazer alguma pesquisa por conta própria. Descobrir o que o seu orçamento permite, talvez, até tentar. Ligue para o suporte técnico e veja com quem gosta de trabalhar. Foi o que fizemos. Então, atualmente. Como eu disse, temos muitos de nossos olhos no Go Daddy. Nós também usamos Theme Co. O tema X eles têm hospedagem, e nós usamos a sua hospedagem bem e teve tido uma boa experiência com eles Atualmente, eles não têm um call center, embora, Então, quando você quando você precisa de ajuda, você tem que enviá-los por e-mail. E às vezes isso pode ser difícil, especialmente se você é novo nisso, saber o que perguntar. Se as coisas não estão funcionando, você nem sabe como pedir ajuda. Então é aí que eu provavelmente dirigiria você em direção a Blue Host ou Go Daddy ou algo assim e, em seguida, também local pelo volante. Então este aplicativo local que temos usado para tudo é de propriedade do volante. É uma empresa de hospedagem e no próximo vídeo eu vou configurar uma mosca, vou contar e então vamos usar o aplicativo local para empurrar o site em que estamos trabalhando . Estou muito entusiasmada com isto. Funciona muito, muito escorregadio. É que é realmente tão fácil eo preço base para a sua hospedagem para um site é de cerca de US $15 por mês, que é é É um negócio realmente bom. Agora. Você poderia obter um site hospedado pelo papai por cerca de US $5 por mês. Então, sim, é mais barato. Mas a dor de cabeça em transferir arquivos e atualizar bancos de dados e coisas assim, que eu vou mostrar em vídeos posteriores, é tudo que você tem que se preocupar com isso com essas coisas do volante. Então é por isso que eu quero mostrar isso primeiro, porque é uma ótima maneira de começar e correr sem ter que enlouquecer no processo. Então, de qualquer forma, é isso que eu tenho a dizer sobre hospedagem. Vou adicionar mais um pouco. Recurso é para este vídeo que você pode conferir e novamente se juntar ao grupo do Facebook se você tiver perguntas ou comentários, ou se você gostaria de compartilhar quem você está usando ou com quem você teve sucesso e apenas manter essa comunicação aberta porque Eu sei que este vídeo e todo este tópico vai ser algo que vai ser datado rapidamente neste curso, porque vai mudar rapidamente. Então faça sua pesquisa, faça sua lição de casa e confira os links abaixo 37. Eu sou o seu! Como configurar uma conta de hospedagem com with: É fácil se configurar para hospedagem com volante, e isso vai funcionar ótimo. Se você seguir usando o volante, o local por mosca vai aplicativo que vai fazer suas integrações perfeitas. E vai poupá-lo de muita dor de cabeça no caminho. Então, esta é uma ótima opção, e é gratuito para se inscrever e conferir. Então o que nós vamos fazer é ir para o volante ponto com e na página inicial do seu grande botão de inscrição de graça. Então, vamos clicar lá e ir em frente e criar suas novas contas. E depois que você se inscrever, você terá sua própria conta aqui e nós temos este grande botão verde criar novo site. Então eu vou clicar nisso, e então você pode configurar os detalhes do seu site WordPress e podemos dar-lhe um nome de domínio temporário . Dessa forma, você não teria que comprar um nome de domínio ainda para começar a usar seu serviço. Então, neste caso, eu ia conseguir. Derek Mitchell 0.5 todos os lados ponto com. E agora o que precisamos fazer é criar um novo usuário WordPress. Então este seria um nome de usuário. Você pode fazer o que quiser. Eu preciso cortar o vídeo muito rápido e falar com você rapidinho sobre sites de demonstração. Então eu estou prestes a passar e mostrar a vocês como comprar a hospedagem e tudo isso, que é ótimo, porque é algo que você vai precisar fazer de qualquer maneira se quiser manter seu site on-line. Mas se você quiser apenas conferir este serviço e fazer o teste gratuito que tinha falado sobre a página inicial, você pode criar o que é chamado de site de demonstração. Então aqui está o link. Para conferir esta documentação, é obter o volante ponto com a frente barra de apoio wordpress traço barra O que é um site de demonstração? Tudo bem, então basicamente, o que você pode fazer é criar um novo site. Você pode fazer upload do site para seus clientes. Então aquele site que acabamos de fazer no local você poderia realmente empurrá-lo para um site de demonstração e eles podem vê-lo, e ele estará no ambiente de produção real. E então, se o cliente estiver pronto para ir, você pode realmente transferir o faturamento para ele para que ele seja responsável por todos os pagamentos. Agora, se você é seu próprio cliente e este lado é para você enquanto você está no gancho para os pagamentos lá. Mas de qualquer forma, é tão simples, e então eu tenho que fazer é fazer o site ao vivo. Então, para demonstrar que aqui está o vídeo do volante. Se você gosta de muitos designers, você usou um servidor de demonstração em algum momento para mostrar um ótimo novo site projetado para um cliente com mosca. Bem, isso é coisa do passado. Demonstrações. Sites on Fly permitirá que você encenar decidir mostrar ao cliente quatro. Dor. O legal é que o site já está em local de produção. É uma vida em curso, fácil mudar DNS. Sem migração. O que é ainda mais legal é quando você está pronto para ir ao vivo. Você pode optar por pavimentar o site sozinho ou transferir o faturamento. Um cliente ainda confuso. Veja como funcionam os lados das demonstrações. Quando você cria um site e compra petróleo, você tem a opção de pagar agora ou pagar mais tarde. Se você optar por pagar mais tarde, seu site ainda estará disponível para você ver um site de demonstração, mas não estará mentindo. Todos os lados de demonstração têm datas de validade antes que seu filho expire irá enviar-lhe alguns avisos. Até lá, você pode fazer o que for necessário para ter certeza de que seu site parece perfeito antes de você. Quando você estiver pronto para o seu enviado para entrar ao vivo, você precisará concluir a construção, optando por pagar o site você mesmo ou transferir para Depois de ter feito isso, seu site não é mais uma demonstração. Tudo o que você precisa fazer é desativar a proteção por senha e estará na Internet para o mundo ver. Bastante incrível, certo? Della Sites são apenas mais uma maneira de reimaginar hospedagem para designers. Muito bem, muito simples. Então, com isso, vou devolvê-lo a mim mesmo para continuar a mostrar-lhe como realmente pagar pela hospedagem e configurar isso. Se é o certo, você quer ir e então nós vamos colocar essa senha e de novo, e então você pode pagar. Agora eu tenho um cliente pagar mais tarde, foram adicionados a um plano em massa. Tudo bem, vamos rolar para baixo e escolher um plano. Então aqui você pode ver que temos algumas opções de plano diferentes e para ser totalmente honesto para o que você vai conseguir com volante $15 por mês é realmente um bom negócio. Agora você pode encontrar soluções de hospedagem mais baratas de lugares como Blue Host ou Dream Host ou Go Daddy ou Site Ground. Todos eles vão ter algumas opções diferentes disponíveis. Mas a única coisa que é legal sobre volante é que ele foi projetado especificamente para WordPress e especificamente com este aplicativo local que temos usado. Então, ele vai lhe dar uma grande flexibilidade, bem como uma integração perfeita que vai tornar sua vida realmente fácil, especialmente se você não é um desenvolvedor e você não quer ter que tentar se preocupar com todos os aspectos técnicos Dele. Além disso, eles vão dar suporte a você com a migração gratuita. Então, se você tentar trazer um site de um local para outro e tiver problemas com ele, eles farão isso de graça. Então esse é um grande bônus. Então, vou escolher o plano de 15 meses dele, e então posso escolher pagar anualmente ou posso escolher mensalmente agora mesmo. Vamos deixá-lo como mensalmente, e então temos alguns adições de site diferentes, Então um cdn é uma rede de entrega de conteúdo, então o que isso faz é quando sempre que seu site é carregado, ele está puxando esses arquivos daquele servidor. Lembre-se, falamos sobre isso, mas digamos que seu cliente está tentando carregar seu site e todos os seus arquivos em um servidor em algum lugar. E digamos que a Califórnia e que eles moram em Nova York. Bem, esses arquivos vão ter que passar por toda a rede diferente. E isso acontece em segundos divididos, mas cada segundo importa quando seu site está sendo carregado. Então, um cdn basicamente clonará seu site para servidores de todo o mundo que quando alguém tentar solicitar seu site, ele vai carregar de qualquer servidor que esteja mais próximo a eles, então ele carrega muito rápido. É muito útil. É um ótimo serviço, embora quando você está começando. Você não precisa disso porque seu site provavelmente não é tão grande e provavelmente não tem muito tráfego chegando a ele. Então, honestamente, um segundo ou dois provavelmente não vão importar agora. Então isso é algo que você poderia saber que existe, e você pode adicionar a ele mais tarde. Se você descobrir o seu site, parece que ele está lento ou você assistindo seu tráfego e você descobrir que você tem um monte de pessoas saltando fora do seu site, então isso é o que um cdn é. E mais uma vez, eu nem uso um atualmente. E é algo para o qual eu poderia atualizar no futuro. Mas, por enquanto, não precisamos disso. Um certificado SSL para que os sockets seguros Layer ou SSL mantenham as informações dos seus sites seguras, criptografando a comunicação. Então o que isso significa é que, como seu site ou como um usuário está solicitando os frascos espirais para trás e para frente do servidor, ele criptografa e protege para que as pessoas não possam roubar informações. Eu vou ir em frente e clicar sobre isso e selecionar o SSL simples. Como é gratuito, ele é totalmente gerenciado pelo volante, e assim eu não tenho que me preocupar com a segurança no meu site. Uma vez feito isso, vou rolar para baixo e selecionar meu método de pagamento. Clique em Adicionar método de pagamento. Por uma questão de simplicidade, vou em frente e usar minha conta PayPal. Clique aqui. Assim que você adicionar seu método de pagamento neste caso, eu adicionei papal. Vou clicar aqui para ter certeza que foi selecionado. E então com esse pagamento selecionado, eu vou rolar para baixo e clicar em pagar agora e quando tudo estiver feito, ele vai nos redirecionar para o diretório de sites aqui dentro do volante. Posso clicar no botão do painel na parte superior. E se você tiver mais de um site, você verá todos eles listados aqui. Mas por enquanto, só temos um site. Então, quando eu clicar sobre isso, podemos ver a visão geral e as estatísticas do site. Desde a sua nova marca, obviamente, não vai haver muito aqui para olhar. Podemos ver estatísticas para quando temos tráfego, enfraquecer, ver adições diferentes. Então isso foi que SSL que vai precisar para acompanhar com o Cdn e multi site que estão todos além do escopo desta palestra. Neste momento, temos os nossos backups. Então, uma vez que há novo em folha, obviamente não há backups ainda. Mas isso vai ser realmente útil para ter backups automáticos de seu site. Então, se algo acontecer, como um plug in quebra ou é hackeado ou, você sabe que algo acontece que você não estava esperando, você sempre pode voltar para um backup. Nós também temos algumas opções avançadas diferentes que você provavelmente não vai precisar agora, mas é bom saber que eles estão aqui. Você pode liberar dinheiro, que às vezes, se você fizer alterações, seu site e eles não aparecem imediatamente. Pode ser porque você está hospedando Plataforma está sacando ou salvando a versão antiga para que você possa liberar o dinheiro para ver a versão atual do seu site. Você pode fazer o modo de desenvolvimento, o que ajudará a desativar o descontar. Dessa forma, você pode ver essas mudanças instantaneamente enquanto está desenvolvendo. Então, se você estiver adicionando CSS ou arquivos de imagem diferentes ou coisas diferentes como essa, você pode ativar o modo de desenvolvimento. Assim, à medida que você estiver fazendo essas alterações, seu site, você as verá imediatamente. Isso foi muito frio por aqui. Temos este ícone de engrenagem. Você pode alterar o nome do seu site, mas você pode criar um tipo de blueprint, como o que aprendemos no início disso, onde talvez você carregue sites on-line em vez de passar pelo desenvolvimento local. Basta fazê-lo imediatamente através do ambiente de hospedagem, para que você possa fazer isso aqui também, e você clonar seu site também. Então, digamos que você está criando vários sites para clientes diferentes. Este é realmente um grande economia de tempo, e então podemos clicar em WP admin, que nos levará direto para o backend do nosso novo site em um esforço para tentar manter este curso nesta palestra o mais atual possível. Vou anexar os arquivos de documentação a esta palestra, que você possa ver quais são os processos de transferência e migração mais atuais do volante. Se você tiver alguma dúvida, definitivamente sinta-se à vontade para entrar em contato comigo diretamente sobre este vídeo ou novamente, junte-se a esse grupo do Facebook e nós adoraríamos ajudá-lo. 38. SAVER de tempo de SANE! Como acionar o de um tranço local e volante: Agora que temos nossa conta volante configurada para hospedagem, vamos conectar isso ao aplicativo local. O que eu vou fazer é abrir o local e o que temos no lado esquerdo. Eu tenho este pequeno conecte um ícone do volante. Então eu vou clicar nisso e eu vou entrar no volante. E como eu já estou conectado no site, ele se vê. E então eu vou seguir em frente e clicar em conectar com Derek Mitchell. Essa conta que acabamos de criar permite que ela abra local pelo volante, e lá está. Temos nosso primeiro site conectado para voar roda para que eu possa puxar isso para baixo do dedo local. Se eu quisesse Teoh, vamos ver, criar um backup e criar o site. Assim eu posso fazer modificações no meu próprio computador para que eu possa conectar e puxar para baixo o site. Ou como isso é apenas uma base de instalação e não há nada lá com que me preocupar. Eu posso voltar a todos esses sites que temos trabalhado, e eu posso realmente empurrar isso para cima para voar roda. Então clique empurrado um volante e eu vou selecionar um site no volante ou eu posso criar um novo site. Então, se eu não quiser substituir o que eu já fiz, eu posso criar um novo. Mas eu vou em frente e empurrar está em cima disso. Vou empurrar para o volante. E agora ele se conecta automaticamente ao site que fizemos no servidor. E atualmente está empurrando esses arquivos locais que fizeram as pazes para o servidor, e eu não posso deixar de mencionar que isso é 100 vezes mais fácil do que qualquer outra migração que eu já fiz na minha vida. Então vamos aprender como fazer isso, como fazer isso da maneira manual em outros vídeos na estrada. Mas eu só queria salientar que isso é insanamente simples e vale cada centavo. Agora, dependendo do tamanho do seu site, isso pode demorar um pouco. E porque estamos usando o tema saliente e temos um monte de gráficos diferentes para ele empurrar para cima, bem como, isso pode demorar um pouco. Então vamos em frente, deixar a rotação, e eu vou pausar o vídeo. Tudo bem? Então, quando os sites terminarem de ser enviados para o servidor, você vai ter este site de mensagem empurrado, então basicamente todos esses arquivos foram enviados para cima. Agora é rádio. Ele ainda está fazendo algum processamento no back-end. E quando tudo estiver pronto, eu vou receber um e-mail dizendo que está tudo feito, então eu vou em frente e clique, OK, E eu estou atualmente no aplicativo do volante local e aqui abaixo. Agora que eu tenho esse site conectado, você pode ver que nós temos o empurrão e a pesquisa dos botões do volante aqui em baixo. Então, se eu fizer alterações no site ao vivo, posso voltar aqui e pegar todos os arquivos. Então, qualquer alteração de uma corrente e, em seguida, também mostra que eu estou conectado bem aqui. Então, se eu clicar neste link, ele vai abrir isso diretamente, e eu posso ver o painel no volante. E então a partir daqui eu posso clicar no link real em si e ver o novo site que acabamos colocar e eu estou recebendo um erro porque ele ainda está processando. Assim que tudo isso for dito e feito, poderemos clicar em nosso site e tudo deve estar funcionando. Ótima. Então eu vou ir em frente e cortar este vídeo agora, e se você tiver alguma dúvida novamente junte-se ao grupo do Facebook ou comente abaixo. Vou parecer um disco quebrado, mas quero ter certeza de que estou ajudando vocês o máximo possível. E eu não posso fazer isso se você não se juntar ao grupo. E também, eu vou anexar alguns documentos porque, como eu disse, eu sei que vou fazer o meu melhor para mostrar tudo neste vídeo. Mas dada a natureza do Web design e desenvolvimento Web, as coisas mudam tão rápido. Então é algo que ouvi parecer diferente ou não está funcionando para você. Certifique-se de verificar a documentação do volante nas informações abaixo. Muito bem, pessoal, obrigado por assistirem. 39. Cliente real: introdução de estudo de caso: Ei, eu espero que você esteja aprendendo um monte de informações valiosas até agora neste curso, e na próxima seção quando eu quero fazer é mostrar-lhe um estudo de caso Riel World. Agora, o que estou prestes a mostrar é um dos meus clientes atuais. É um campo de golfe, e originalmente eu projetei seu site WORDPRESS usando o tema X WordPress com o pensamento inicial de que eu estava indo para projetar isso e, em seguida, entregar as chaves, todas as informações do usuário, o nome de usuário e senha para que eles possam fazer atualizações e mantê-las atualizadas. Agora, no entanto, continuamos a negociar. Então eu atualizo o site e então eu posso ir jogar golfe em seu site estão em seu curso. Então tem sido um projeto muito divertido, um ótimo cliente, mas por causa disso, eu realmente quero mudar de tema. Agora eu realmente gosto do tema WordPress saliente. Você pode até usar o tema Devi WordPress. Há um monte de grandes temas lá fora, mas eu estou muito confortável, um saliente, e eu gosto da aparência moderna. Faz um par de anos desde que eu publico o site pela primeira vez e agora o que eu quero fazer é voltar e adicionar algumas galerias realmente bonitas, alguma caixa de sombra de vídeo, coisas olhando, alguns cabeçalhos animados e apenas no geral, Quero limpar o local. E então, além disso este ano, eles querem ser capazes de criar na loja online, onde as pessoas podem realmente ir e comprar seus passes de temporada antes do tempo no site sem ter que fazer cada um manualmente. Atualmente, o que acontece é, se você quiser comprar um campo de golfe ou um passado de golfe, você tem que ligar para o clube e fazer tudo manualmente pelo telefone ou enviar um e-mail para que não seja muito automatizado, e isso é vai ser outra coisa que vamos adicionar também. Vamos adicionar o plug de comércio Wu para que possamos fazer comércio através do site deles . Então nós temos um monte de coisas divertidas nesta próxima seção. Fique atento, e se você tiver alguma dúvida, sinta-se livre para comentar abaixo. Mas basicamente o que eu quero mostrar mais do que qualquer coisa é apenas como pegar um site que tem alguns anos de idade e cair em um novo tema e criar algumas atualizações com segurança e segurança, sem o risco de substituir seu site atual ou quebrar coisas. Então vamos usar o local pelo volante. O aplicativo com hospedagem flable para ser capaz de fazer um backup on-line, vai puxar todos os arquivos para baixo, vai fazer nossas mudanças e eles vão empurrá-lo de volta para cima ou nós estamos feitos. Agora. Você pode fazer isso com muitas plataformas de hospedagem diferentes. Tenho sido muito feliz com o volante. Confira os links abaixo e você pode aprender mais sobre sua hospedagem também. Eu também uso Go Daddy. Eu usei Blue Host e um punhado de outros também, como motor DBP. Atualmente, meu favorito é volante, então você vai me ver empurrando muito isso. Eu não ganho dinheiro por dizer isso, mas é algo que eu realmente gostei, e tem sido o meu favorito. Eles carregam muito rápido agora. Se você não está usando volante, que você provavelmente não está, você provavelmente está usando algo ir papai ou hospedeiro azul. Ou talvez você nem tenha um anfitrião ainda. Vou mostrar-lhe outras maneiras que você pode criar esses backups e enviar seu site ao vivo também. Tudo bem, pessoal, vamos em frente e vamos ver no próximo vídeo 40. Cliente real: faça o backup do seu site: Portanto, antes de começarmos a atualizar o tema deste site ou fazer quaisquer alterações, é sempre uma boa ideia fazer backups. Então, tem algo a fazer. Tenho certeza que vocês duas maneiras diferentes de eu fazer isso agora. Na verdade, estou no local no aplicativo. Então eu estou no site do Clube de Golfe Northern Pines que está sincronizado com meu computador e com o servidor on-line para que possamos clicar neste link aqui em baixo, que está conectado ao Clube de Golfe Northern Pines. Vou clicar nisso, e ele vai realmente abrir o painel da minha conta de hospedagem. Então, quando eu fizer isso, a primeira coisa que eu quero fazer. Você também pode simplesmente ir para o site get volante ponto com e fazer login e chegar aqui também. Mas isso leva você diretamente para o site específico com o qual você está tentando trabalhar. Eu quero fazer agora. A primeira coisa que eu faço é apenas vir para esta guia de backups, e eu vou clicar sobre isso e então você pode ver que já está fazendo backup de coisas para mim, então eu posso não precisar fazer isso, Mas o que eu gosto de fazer é clicar neste pouco ícone azul mais aqui e eu vou criar um novo backup. Vou chamar essa atualização do tema pré, e assim eu sei exatamente onde esse Timestamp está na história para saber que se eu estragar alguma coisa, eu sempre posso voltar para o backup mais recente antes de fazer todas as mudanças. Então agora que isso está começando, tem um backup em andamento aqui. Você vê que está funcionando. Não deve demorar muito. Eu posso ir em frente e fechar esta janela e vamos voltar para o local por aplicativo volante no meu desktop. Então, de volta ao local por aplicativo volante, o que eu quero fazer é ir em frente e começar este site. Então ele vai iniciar este servidor virtual aqui e uma vez que ele está em execução, eu posso vir e puxar do volante. Agora é muito importante que você esteja prestando atenção em qual ícone eu não posso enfatizar isso o suficiente . Se eu fosse empurrar para voar roda, levaria todos os meus arquivos locais que não são a versão mais atual, e ele iria substituir tudo o que está em seu site ao vivo agora. Não queremos fazer isso agora. O que queremos fazer é puxar do volante. Assim que qualquer uma das atualizações, você sabe onde eles adicionaram novos usuários ou em uma novas páginas ou temas atualizados e plugins no site ao vivo. Quero que todas essas atualizações atuais estejam em minhas máquinas locais. Eu vou clicar puxar do volante e eu quero puxá-lo para um ambiente de produção, vai clicar em pesquisa e dependendo do tamanho do seu site, isso pode levar um bom tempo. Então vamos em frente e avançar com isso. Eu vou ir em frente e deixar este trabalho e quando estiver terminado, vai voltar no próximo vídeo e dar uma olhada em nossos próximos passos para começar a atualizar o tema neste site. 41. Cliente real: instale o novo tema: Agora que temos o nosso site feito backup tanto no host real como localmente, eu tenho um arquivo local puxado para baixo, usando o aplicativo local pelo volante do motor. Agora posso prosseguir com total confiança sabendo que não só posso fazer mudanças sem as pessoas vejam ao vivo até que eu esteja pronto para que elas vejam. Mas também se eu cometer um erro ou se houver algum conflito entre plugins ou algo estranho acontecer, posso certificar-me de que conserto isso. E se eu quebrar alguma coisa, tenho uma rede de segurança para voltar. O Teoh. Então, agora que temos isso de volta, uma coisa que quero apontar é outra vez. Eu estou usando o local por aplicativo volante e o site em que estamos trabalhando hoje tem S s l configurar que é camada de soquetes seguros. Então, se eu for ao site principal aqui, este é o que vamos atualizar. E o que vamos fazer nesta lição é mudar o tema do X WordPress tema. Vamos instalar o tema WordPress saliente e fazer algumas modificações. O site está em funcionamento há quase três anos, então é apenas para uma atualização. Eu tenho melhores fotos que eu quero colocar em e algumas características diferentes que o tema saliente tem que eu gosto mais. Então é isso que estamos fazendo nesta lição. Vamos instalar o tema e depois a outra coisa. Quero apontar aqui antes de mergulharmos. Então, como isso tem uma camada de soquetes seguros, você notará que temos http s neste endereço aqui, o que significa que é seguro. Posso clicar nesta fechadura. Ele vai me dizer que a conexão é segura e isso é algo que você faz no lado anfitrião das coisas. E isso está fora do escopo desta lição em particular. Mas o que eu quero salientar é que porque nós temos isso ligado quando eu vou para a minha versão local aqui, você vê, é ponto local. É o local de desenvolvimento. Ele não vive online. Você não pode ver, exceto no meu computador agora. Então, quando você fizer isso pela primeira vez, este pequeno ícone de cadeado, ele vai dizer que a conexão não é segura. O que você precisa fazer é vir aqui para o testamento local. Venha aqui para SSL e você terá um certificado aqui. Isso vai dizer confiança? Você quer clicar nesse botão de confiança e vai dizer confiável? E agora, quando você clicar sobre isso e ele abrir a janela do navegador, você terá este pequeno ícone de cadeado agradável. Parece que você pode usá-lo em vez de obter a grande página com a letra vermelha dizendo, Você sabe, não é seguro, não proceda do cromo ou safari ou o que quer que você esteja usando. Então, espero que isso faça sentido novamente. É um pouco fora do escopo deste vídeo, mas uma coisa é estar ciente de alguns dos problemas que você pode encontrar se você está tentando fazer isso, então agora nós vamos fazer é realmente pegar os frascos temáticos. E eu comprei este tema do tema Forest Dot Net. É um tema importante aqui. Eu realmente gosto altamente recomendado, e eu usá-lo para um monte de sites, especialmente até mesmo meu próprio site em Derek Mitchell dot com. É alimentado por salient. Então o que vamos fazer é eu comprei uma licença nova e foi cerca de 60 dólares através da floresta temática , e eu vou clicar no botão de download. E em vez de apenas dizer a licença ou apenas carregar, baixar os arquivos de tema. Quer pegar todos os arquivos e documentação e o motivo? E eu vou te mostrar em um segundo. Aqui está, minha pilha de downloads. Vamos abrir isso porque ele vai lhe dar todas as informações de licenciamento. Ele vai lhe dar o guia do usuário, que é realmente útil. Nós abrimos isso bem rápido, você pode ver isso. Um, bem, você pode ver que na verdade é apenas uma página com um link, mas de qualquer maneira dá um link para como fazer todas as mudanças que você quer fazer e ajustar o tema. Mas, além disso, se eu fosse apenas baixar o arquivo WordPress não comercializável só ele só me daria o arquivo zip ponto saliente, que é suficiente para instalar o tema. Mas queremos que a criança considere, e vamos em frente e mostrar-lhe o porquê aqui. Então eu vou fazer é saltar para a minha versão local. Vamos voltar para a mosca vai acontecer. Eu vou clicar direito no botão de administração que vai abrir isso e me levar para a página de login . Então, agora que estou logado, posso ver que você tem algumas atualizações a fazer. Mas o que eu quero fazer é ir em frente e instalar esse tema. Então nós vamos descer para a aparição e depois vir aqui para os temas e, em seguida, clicar sobre isso e você pode ver que eu já fiz isso antes, então eu vou e fazer alguma manutenção rápida da casa. Vamos apagar isto e vamos apagar isto. E agora eu estou apenas à esquerda com o tema padrão 2019, bem como o tema ex e o tema ex-filho . Agora, deixe-me explicar como isso funciona bem rápido. Assim como uma atualização, instalamos um tema. Temos o tema principal que tem todo o estilo para cada elemento do site. Agora, aqui está o problema. Digamos que estávamos mergulhando no ex-demônio. Fizemos quaisquer modificações, especialmente com CSS ou estilo diferente quando o tema é atualizado e ele será atualizado. Se fôssemos atualizar esse tema, ele vai sobrescrever todo o trabalho que fizemos. E então, usando um tema filho, o que vai acontecer é que ele usará o tema pai como base e, em seguida, qualquer alteração que você fizer no tema filho, não importa o que isso seja, vai substituir. Então vamos atualizar o tema infantil. Dessa forma, é a versão mais atual do site que substitui todos os outros estilos. E assim você ainda pode ficar com o motor. Basicamente, são a base do seu site atual aqui com o tema pai. Mas o tema do seu filho é o que estilos tudo. Espero que isso faça sentido. Vamos em frente e apenas adicionar este novo tema de saliente que temos. Então, vamos clicar aqui em cima no botão adicionar novo. Vamos fazer o upload do tema, e você pode clicar para escolher um tema ou o que eu gosto de dio. Normalmente, eu vou ter uma janela aberta em algum lugar, e eu vou apenas soltar dragão. Então eu faço. Os pais parecem ser os primeiros, e aqui está o porquê. Então, vamos clicar e arrastar zip ponto saliente e clicar em instalar agora, e aqui está o porquê. Eu faço isso primeiro porque eu não quero ativá-lo ainda. Eu só quero os arquivos no banco de dados aqui. Então, em vez de clicar, ativar, vou clicar em Retornar à página de temas. Eles vão clicar. Adicionar novo. Vamos clicar em enviar tema. E então desta vez vamos pegar nosso tema infantil em uma gota de dragão. Jogue-o lá, clique em Instalar. Agora e desta vez vamos clicar. Ativar Agora, fazendo isso vai quebrar quase tudo em seu site. Então é por isso que estamos trabalhando fora da linha primeiro. Se você tem um site que não tem muito tráfego, talvez você queira apenas mergulhar e ir para ele. Eu fiz isso no passado em meus sites pessoais, você sabe, quando eu não tenho, tipo, tipo,tráfego. Mas se vai ser um grande site que tem tráfego, você quer ter certeza de que eles não estão vendo isso. Por exemplo, quando eu clico sobre isso, você pode ver o estilo é em torno de cor. Agora o logotipo não aparece. Um monte de coisas ainda funciona. E a razão é porque estamos usando Cornerstone para nossos construtores de página são layout de página parece o mesmo porque isso veio do X, mas assume que voltamos e começamos a alterar essas configurações. Vamos voltar para o painel aqui. Vamos para os nossos, uh, plugins Valleys que precisamos trazer vai voltar a isso em um segundo. Vamos mergulhar na nossa página de plugins. Então, a razão pela qual isso ainda parece meio decente, como eu disse, é que eu quero descer meus plugins. A pedra angular é o construtor de páginas do Theme Kill para a Equipe X. Agora vou ter que desativar isso porque vai entrar em conflito com o Salient. Então vamos desativar isso. E agora um de vocês, minha página, vai parecer lixo. Tudo bem, então você pode ver, cara, nós temos muito trabalho a fazer agora que isso está desligado. Tudo bem, então vamos em frente e mergulhar de volta no nosso painel mais uma vez. Cada tema lida com as coisas de forma diferente. Então, neste caso, salient tem um monte de plugins que você pode usar. Alguns deles são necessários. Alguns deles são opcionais. Então, por exemplo, eu posso adicionar o importador de demonstração saliente, que então me permitirá puxar as páginas de demonstração quando eu estiver construindo o site. Então, se agora eles são necessários é o construtor de páginas de padaria WP saliente. Agora esta é basicamente a versão saliência de um construtor de páginas, que é como Cornerstone, que acabamos de desligar. Então, vamos clicar nisso. Vamos em frente e clique nesta caixa de seleção aqui e aqui sob os dois que são definitivamente necessários virá com as ações em massa e clique em Ativar realmente sabia Clique em Instalar Meu ruim. Temos que instalá-los primeiro. Agora vamos clicar. Aplicar e vamos voltar ao instalador plugins necessários e, em seguida, você verá que estes plugins necessários. Se eu rolar para baixo, você pode ver que eles têm um monte de plugins que podemos usar para salient. Então, uh, eu estou realmente indo para instalar todos estes porque eu provavelmente vou usar todos estes neste tema. Então, o que eu poderia ter feito desde o início Você apenas clicar nesta caixa aqui em cima e ele vai abrir todos esses explodidos Verifique aqueles dois. Vamos clicar em Instalar, Clique em aplicar, e agora ele irá instalar o resto desses plugins também. Tudo bem, então todos eles foram instalados. Ótima. Vamos voltar ao instalador dos plugins. E desta vez, vamos ativá-los. Além disso, clique nesta alternância na parte superior, Tudo selecionado. Vamos clicar nas ações em massa descer para ativar e clicar em aplicar. Tudo bem, então agora vamos olhar para trás em uma página. Ainda vai parecer lixo, porque todo esse código curto está se referindo ao plugue da pedra angular em si mesmo. Infelizmente, Infelizmente, basicamente reconstruímos o site inteiro porque todas as páginas usavam o layout da pedra angular. Então está tudo quebrado. E o que é legal sobre isso, entretanto, é que agora o que eu posso fazer é tirar essa conta aqui. Vamos para o site principal que está online. Ainda apelar para este. Vou clicar e segurar meu pequeno botão verde de tela cheia, e vamos contar a este do lado esquerdo, e então vamos jogar nossa nova versão aqui do lado direito. Então, o que é agora? Posso fazer isso para fazer o certo. Eu estraguei tudo. Que eu estraguei tudo. Não, estamos fazendo. Temos todo tipo de estilo estranho e coisas acontecendo aqui do meu navegador Google Chrome também. Então, Então, vamos tentar voltar para a página inicial aqui. Tudo bem, então queremos fazer a página inicial parecer bonita. E atualmente esta é a informação que está nela, mas vamos começar de novo completamente do zero. Então, no próximo vídeo que vamos fazer é começar a mergulhar em cada página e usar os modelos salientes para nos começar muito rapidamente e começar a fazer páginas realmente bonitas com esforço mínimo. Tudo bem, vamos em frente e mergulhar nisso a seguir. 42. Cliente real: configurações de tema: Tudo bem, então temos um site de backup, temos nosso tema instalado, começamos a quebrar coisas, e agora é hora de começar a reconstruir as coisas. Então eu quero fazer é que estamos de volta na página inicial é aqui. Temos o da esquerda que ainda está ao vivo no da direita que estamos construindo localmente. Tudo está quebrado e bagunçado, então comece a consertar e do jeito que eu faço isso. Normalmente, é uma das duas maneiras tipicamente, o que eu vou fazer é começar de cima para baixo, esquerda para a direita então a primeira coisa e começar a trabalhar neste logotipo de fixação, corrigindo a navegação de cores e o estilo. Normalmente, eu iria deixar o construtor de página em se eu estou trabalhando ao vivo no site. Então, mesmo que estejamos usando o construtor de páginas salientes, eu deixaria o plugue da pedra angular ligado apenas para a página. Ainda assim, parece que estou construindo coisas, mas desde a linha RAV, não importa. Por off-line, quero dizer, nós temos o site principal ao vivo ainda, e isso está off-line. Tudo bem, então vamos em frente e saltar de volta para o painel e eu quero mostrar a vocês basicamente onde seus estilos principais para salient serão e para tudo, eles vão ser diferentes. Só estou a mostrar-te por onde começar a bisbilhotar se estiveres a usar isto. Então, do lado esquerdo. Agora temos um novo item de menu chamado Salient. Se eu pulasse de volta para o painel do site atual ao vivo, você notará que ele tem o tema X. Vamos expandir isto aqui. Eu tenho o tema X aqui, e nós temos todas as suas configurações aqui e deixe-me apenas fazer isso um pouco maior. Então você vê isso lá? Você está bem? Então, documentação ex demônio, você vai notar que a opção saliente não está aqui. Isso é algo que foi adicionado assim que instalamos o tema. Então vamos saltar para aqui, e temos todos os tipos de configurações para trabalhar. Então, eventualmente, você vai querer passar por cada uma dessas configurações e certificar-se que tudo está discado da maneira que você quer. Mas vamos começar com os dois primeiros aqui. Nós temos as configurações gerais, vamos clicar sobre isso, e então com isso eu vou ir em frente e esfregar isso para que você veja tudo. Nós temos, os temas. Pele. Isso é um pouco além do escopo desta lição, mas basicamente, é apenas como este desenvolvedor tema específico fez alguns estilos baseados em como os botões olhar e coisas assim. Então brinque com isso, veja do que gosta. Mas no estilo, podemos jogar algumas opções diferentes, todos os tipos de coisas. Vamos deixar isso em paz por enquanto. Outras coisas enfraquecem cair aqui também, de apenas diferentes maneiras que este tema em particular funciona. Então, basta percorrer, ficar meio intrometido, apenas brincar com as coisas. Você está em um site de backup, então não importa se você quebrá-lo, basta clicar em botões. Ele salva. Ele iria acontecer. Então eu me aproximei é como construir um Você sabe, um quebra-cabeça de colocar um quebra-cabeça juntos ou, hum, apenas a resolução de problemas de como, bem, vamos ver o que este botão faz não explodi-lo ou você sabe que corrigi-lo. Então essa é a minha abordagem é eu apenas passar por tudo e eu apenas alterno tudo e apenas, hum, apenas discar com base no que eu acho que parece bom. Aperte, salve e, em seguida, volte para o seu site e veja se você gosta ou se vê se você tem que continuar. Então a próxima coisa a fazer é saltar para as cores de acento. Então, atualmente, as cores de acento que vieram com este tema não se parecem com o nosso site. Então o que eu vou fazer é voltar para o nosso site principal no “Isso está vendo”. Meus menus estão todos triturados aqui em baixo. Aereo, uh, então você pode ver as cores que eles têm por padrão esta cor verde aqui e eu poderia fazer algumas. Eu poderia redefinir algumas coisas e eu poderia fazer isso no Photoshopped, então eu tenho um mapa para ir em direção. Mas por enquanto, o que eu vou fazer é usar um aplicativo chamado Sip s I p. Eu realmente tenho um vídeo do YouTube sobre como eu gosto de cores. Você pode verificar isso. Vou colocar um link abaixo, mas basicamente eu quero fazer isso é querer pegar este valor hexadecimal para esta cor verde, copia para a minha área de transferência. Agora eu posso saltar para a cor do sotaque aqui, e nós vamos apenas acelerar isso em que salvar mudanças, e eu vou segurar o comando aguçado coletar aqui apenas para tipo de vomitar em uma nova guia bem rápido e ver. Então o botão do meu carrinho agora parece verde. Abra isso ainda que pareça verde em vez daquela cor azul que não combinava em tudo. Então nós vamos começar, você sabe, você sabe, refinar as coisas, cair em nossas cores e torná-lo estilizado. Então essa é a minha abordagem. Preciso definir um pouco disso. Eu vou fazer isso. Voltaremos e eu mostro-te o que fiz, e depois continuaremos a revelar o nosso novo design. 43. Cliente real: configuração de logotipo: Tudo bem, então neste vídeo que vamos fazer é terminar nossas cores aqui e então deixar nosso logotipo cair dentro. Então eu ainda estou nas principais opções aqui. Eu tenho o aroma da cor do sotaque, e eu só queria mostrar a vocês rapidinho como eu faria isso bem rápido, porque eu não tenho certeza de como eu quero fazer isso ainda. Eu provavelmente vou acabar mudando isso, mas só para anunciar não, você sabe, rosa dentro e Scion, Nós somos magenta e ciano. Vou clicar em selecionar cor. Vou em frente e colar esse valor hexadecimal à frente aqui em cima. E então o que fazemos é clicar e arrastar um pouco mais para baixo. Então eu recebo apenas um pouco de um tom mais escuro em comparação com a cor de acento original, assim como uma colisão extra para qualquer um dos outros botões que vêm e a cor extra para Vamos fazer a mesma coisa. Bem, acelere isso aí. E então poderíamos até iluminar um toque. E vamos ver onde isso toca onde isso entra no tema. Você pode querer mudar isso na estrada e então nossa cor extra três está bem com a cor cinza dele . Isso é totalmente bom. Então, com Grady insiste, faça a mesma coisa. Vou clicar nesta cor. Bem, passeado nessa pasta em que tornaria um pouco mais escuro. Então agora todos os botões que têm Grady responder qualquer Grady e fundos no modelo e, em seguida, a mesma coisa aqui. Mas desta vez, vamos torná-lo um pouco mais leve. Tudo bem, então novamente, tudo isso pode mudar na estrada. Mas pelo menos tenho algo para trabalhar. Um clique para salvar as alterações. E agora eu não quero fazer é pular e começar a ter esse logotipo discado. Então eu vou passar para a navegação de cabeçalho. Vamos clicar nisso. E, em seguida, a primeira opção aqui é o logotipo no estilo geral. Então, o que eu clicar aqui vai ser atualizado. Temos todas essas opções à direita. Então queremos usar um Nimitz para o logotipo porque atualmente, se abrirmos isso em uma nova aba, é apenas texto. Então vamos entrar e consertar isso. Então o que eu vou fazer é ligar esse botão, e agora eu preciso fazer o upload do logotipo. Bem, para ser honesto, eu não tenho certeza de que tamanho eso vamos sair e brincar com isso um pouco. O jeito que eu vou fazer isso é ouvir, não iria até o site original e apenas tipo de ver que tamanho este waas. Vou apertar o turno de comando no número quatro. Estou num Mac num PC. Você não vai ser capaz de fazer isso. Pode haver uma tomada, mas não sei o que é. Mas o que eu faço é pegar uma tela ou uma captura de tela. E então, um navio de comando para começar. Agora eu posso clicar e arrastar para fora, e eu meio que vejo que este logotipo é atualmente existem dimensões de pixel na parte inferior. Certo? Então tem cerca de 180 pixels por cerca de 70 ou 60 pixels de altura. Então 1880 por 60 é um bom lugar para começar. Então vamos fazer esse logotipo que é desse tamanho. Então eu vou voltar para a janela do meu localizador, e eu quero pegar o logotipo do cliente, e de alguma forma eu não tenho o logotipo original creditável. Não sei como isso aconteceu. Mas eu tenho isso. Pdf Eles me enviaram uma vez, e às vezes você tem sorte com o arquivo pdf. Clique e arraste e passe o mouse sobre o ícone do meu ilustrador e solte-o lá. E neste caso, tive sorte. Este é um formato vetorial que eu posso ler. Então o que eu posso fazer é destacar isso e parece que eles têm alguns traços estranhos e outras coisas acontecendo. Então isto vai meter-me em sarilhos ao longo da estrada. Preciso ter cuidado para pegar o arquivo exato do logotipo. Mas, por enquanto, isto vai ajudar-me a fazer isto e, sim, e veja, eu trabalho. Então o que vou fazer é desligar o derrame aqui embaixo. Vou clicar nesta barra pequena ou apertar a tecla de barra invertida. Então agora não há derrame. Eu tenho minha imagem aqui, e nós vamos querer exportar isso e algumas cores diferentes. Então queremos que esse logotipo seja de 1880 por 60. Então vamos fazer isso. Vamos fazer uma nova nossa prancha. Então, mude. Oh, para obter a minha ferramenta de tabuleiro, ele vai clicar e arrastar e vamos mudar a largura e altura disto aqui em cima com 280 pixels selecionados e estava na altura do que dizemos que ele tinha 60 pixels. Tudo bem, agora eu sei que vai ter o tamanho certo que eu quero que isso seja e o que nós vamos fazer depois de começarmos isso nas groupies juntos comandar Geo, agrupar. Mantenha pressionada a tecla Option para arrastar uma cópia aqui e, em seguida, vamos apenas dimensioná-la no lugar. Tudo bem. Então, imediatamente, notei que isso não foi escalado, certo, porque nós temos a árvore no topo aqui, mas nesta versão, está fora para a direita. Então eu vou ter que fazer um retrabalho aqui para fazer isso funcionar. Mas vamos passar por isso de qualquer maneira. E, hum, na verdade ia construí-lo assim novamente. Estou trabalhando rápido e solto. Esperemos que os caras em C. Pelo menos um processo de como você pode trabalhar. Então eu tirei uma captura de tela disso. Vou deixá-la aqui e ver o que mais é diferente. Certo, então isso é, tipo, nem perto é tipo, espaçamento de faras e coisas assim. Então, Então, novo, porque vou substituir isto no futuro. Eu não estou muito preocupado com isso agora, então vamos chegar tão perto, e, ah, vamos a partir daí. Tudo bem? Então eu sei que este não é um curso de ilustrador. Mas pensei que gostasses do meu fluxo de trabalho. Então, vamos chegar perto de novo. Vou deixar um logotipo novo de qualquer maneira. Mas espero que isto te ajude a ver como eu abordaria isto e a discar isto ou discar aqui? Tudo bem. Não. Experimente essa cor, velhote. Temos todo o tipo de bagunça acontecendo aqui. Ok, então isso parece perto o suficiente por agora para deixá-lo cair de novo. Ainda é um logotipo diferente, mas isso me ajuda a terminar é parte desta lição aqui. Tudo bem, vamos escalar isso. Muito bem, agora temos o nosso conjunto de ficheiros de logótipos, e eu vou apertar Shift. Oh, para obter a minha ferramenta de bordo novamente, mantenha pressionada a tecla de opção e clique direito no nome do nosso álbum e arrastado para os direitos. E eu tenho outra versão disso com mais uma vez, e nós vamos mudar de cor. Então vamos fazer uma versão branca. Você será capaz de vê-lo, mas ele estará lá. E nós vamos fazer uma versão preta ou talvez cinza que combina com um costume aqui bem rápido. Voltar para as configurações gerais. Rx. Eu sinto muito. As cores da conta, cores do acento. Muito bem, cor extra. Vamos pegar isso. Então são apenas três ok e colado lá dentro. Ok, então agora temos uma versão branca, uma versão verde, e esta versão cinza agora quer fazer é excluir este quadro de arte aqui e se livrar dessas coisas. Não preciso dele por agora, e vou salvar esse arquivo agora. Salve como vamos chamá-lo de revisões de logotipo apenas por agora. E, ah, salvando um arquivo do ilustrador. Salvar. Ok. E agora o que eu quero fazer é exportar cada um desses quadros de arte. Então estou agora. Estou no essencial. Espaço de trabalho clássico. Só vou redefinir isso para ter certeza que você e eu vimos a mesma coisa. E eu vou clicar nesta pequena caixa com a seta. Essa é a exportação de ativos que vamos pegar este arquivo ia jogá-lo bem aqui. Este grupo que comanda o grupo GT, vamos jogar isso ali. Vamos fazer a mesma coisa. Aqui estava um grupo este grupo de comando GT ele, jogá-lo lá dentro, Manji para agrupá-lo, e nós vamos jogá-lo lá dentro. Vamos dar-te o nome Green. Certo, vamos dar o nome completo do Clube de Golfe Northern Pines. Destaque tudo isso e copie-o assim e copie isso. Tenho que digitar de novo. E nós o chamamos de Logo Verde. Vir aqui vai colar. Eu vou dizer logotipo, pasta branca e tipo em logotipo cinza. Perfeito. Agora o que queremos fazer é exportar todos esses na escala de um X, então ele vai ser o tamanho, e então nós queremos fazer um em um tamanho de escala de dois X. Então o que isso vai fazer quando saltarmos para nossas costas em nosso saliente dentro do WordPress. Vamos descer para a navegação de cabeçalho e podemos carregar o logotipo regular aqui, e então podemos carregar um tamanho de dois x de logotipo. Dessa forma, ele ficará super nítido e limpo em telas de alta definição. Tudo bem, então vamos voltar para o Illustrator e vamos em frente e exportar tudo isso. Então, vamos clicar e segurar no turno e clicar em todos esses ícones para clicar aqui em Exportar . Vamos dizer onde ir para uma pasta do Northern Pines. Vamos fazer uma nova pasta. Vamos chamá-lo 2020 atualizações da Web podem criar e clicar em uma nova pasta e chamá-lo exportações. Então todas as coisas que exportei vão ser despejadas aqui. O que escolher? Vai cuspir todos os arquivos de logotipo. Vamos dar uma olhada e ver o que nos deu. Então nós entramos lá, 20 atualizações da Web, exportações e então temos uma versão de 180 pixels de largura e uma versão de dois X. Vamos apenas olhar para um pixel dimensões aqui. Então, quando olhamos para isso, temos dois tamanhos diferentes aqui que temos. Se olharmos para baixo e vermos a informação, temos 180x56 a 72 dp. I. E se saltarmos aqui para peopie, eu sei lá o que temos nossas dimensões que são duas vezes maiores e são de maior resolução. Tão perfeito. Agora podemos começar a preencher nosso site, então vamos pular para o cabeçalho. Aqui estamos carregando nosso logotipo, clique em upload e para o logotipo padrão. Vamos fazer a versão verde. Vamos entrar na pasta dela, vamos encontrar nossas exportações de atualizações da Web 2020 e queríamos o logotipo verde. Mas clique em abrir e vamos em frente e dar-lhe uma legenda e um título. Já está lá porque puxou do nome. Então nós somos bons lá, mas apenas uma espécie de ajuda com algum mecanismo de busca otimização. Isso é sempre uma coisa boa. Agora ele vai carregar a versão retina, então clique em upload e estamos procurando o mesmo logotipo, mas com os dois x no nome do arquivo. Então vamos dar uma olhada neste verde em dois x clique aberto. É rápido, selecione, e eu tenho uma versão retina e nossa versão padrão e nossa altura do logotipo. Então nós queremos que este seja o tamanho do logotipo padrão e honestamente, lembre-se o que ele realmente exportou como Vamos dar uma olhada, vamos voltar para sua versão única, hum, hum, pequena, Então a altura é 56 pixels de altura. Então, vamos voltar para cá. Seu tipo de pele em 56 altura do logotipo móvel. Vamos explorar que alguém deixe isso em paz por enquanto. E vamos em frente e ver o que acontece. CPAs. Alguma outra configuração que eu queira inserir agora? Não. Vamos clicar. Salve as alterações. E isso é apenas um comando. Clique aqui para abrir um novo cabeçalho. Tudo bem, então o que temos acontecendo aqui? Vamos refrescar isso. Agora que isso salvou. Se eu fosse pré-visualizar o site, esse logotipo deveria aparecer. No entanto, eu tenho algum código no back-end do meu site, e eu ainda estou vendo esse cabeçalho personalizado que eu projetei e codifiquei em outro lugar. Então eu tenho que entrar e fazer um pouco mais de trabalho nas pernas. Vou encurtar o vídeo e consertar isso. Mas basicamente outra área em que o logotipo caiu. Normalmente ele apareceria aqui, e você estaria em boa forma. Tudo bem. Muito rápido. Queria mostrar-te o que fiz para resolver o problema do logótipo. Então outra coisa, você sabe, especialmente eu estou gravando esses tutoriais, e há muita coisa acontecendo no meu cérebro tentando descobrir o que dizer a vocês e também o que realmente está acontecendo no site no back-end . Então, no último vídeo, tínhamos o menu ainda parecido com este aqui à esquerda, com o verde no logotipo antigo e a atualização que acabamos de fazer. Ele deve olhar assim agora com o logotipo e verde em vez de em branco e no canto superior esquerdo em vez de centrado. Então eu fiz uma curva de escavação. Lembra o que eu fiz aqui? Porque tem sido um longo tempo passos no local originalmente. Mas o que pode te colocar em apuros às vezes me deixa voltar aos plugins aqui. E se eu rolar para baixo, Eu ainda tenho um monte de outro plug in ainda ativado e dois dos quais eu esqueci novamente. Mesmo colocado aqui foi turno valete e menu Uber. Então eu não me lembro qual deles eu ativei que estava causando o problema que eu construí. Mas eu desativei os dois, e agora estes ar já não sobrescrevem o meu tema. E agora o meu tema parece que eu esperava por isso apenas uma nota rápida. Para aqueles que estão mergulhando, há tantas variáveis, que nem consigo começar a tentar dizer-lhes os problemas exatos que podem encontrar. Então você realmente precisa estar bem apenas apertando botões e experimentando as coisas. Mas essa é outra área onde isso pode te colocar em apuros. É ter plugins instalados que esse é o primeiro lugar que você deve olhar, se as coisas não estão se comportando muito bem, vá verificar seus plugins. Tudo bem, pessoal, eu vou ir em frente e fechar este aqui, e no próximo ano, nós vamos começar a estilizar essa home page. 44. Cliente real: configuração de páginas super rápidas com modelos: Ok, então esta é a minha parte favorita, e esta lição nós vamos começar a estilizar a página inicial e realmente fazê-la parecer afiada. Então é assim que eu mergulho. Temos essa bagunça quente de coisas no novo site que estamos chegando e temos o site antigo. Então vamos em frente. Porque já estou logado. Esta é a página inicial. Eu poderia clicar aqui na página de edição. Então eu vou ir em frente e clicar sobre isso e porque eu tenho a página antiga para se referir a Aiken trabalhar desta forma. Você também pode apenas fazer uma nova página completamente. E dessa forma você sempre pode se referir ao texto e, em seguida, apenas trocar quais páginas vivem no final. Mas porque eu tenho esse trabalho com, eu vou mergulhar bem aqui. E agora eu tenho a opção de usar o construtor de páginas de padaria WP, e eu posso usar o editor de front-end ou o editor de back-end. Então deixe-me mostrar o que isso significa. Era um amigo e editor. Vai parecer muito mais com o tema “Divvy”. Se você está familiarizado com isso. Então, se eu clicar nisso, ele vai abrir esta página, e vai parecer quase exatamente como o que você está construindo. Então é muito bom poder trabalhar em linha e ver todas as colunas e ver exatamente o que está acontecendo. Então você pode adicionar linhas e colunas, adicionar diferentes modelos e coisas assim. É uma ótima maneira de trabalhar. Não estou tão familiarizado com isso. Provavelmente é mais fácil se eu mergulhar. E assim você não deletou todo esse bloco de texto. Então minhas páginas totalmente limpo dedo do pé trabalhar com aqui, e ah, ou eu posso clicar no editor back-end e isso é eu vou deixar a página aqui então não vou dizer isso, Mas isso é o que eu estou acostumado a ver é o construtor na parte de trás fim. Então, Então, é assim que eu normalmente trabalho. O mesmo tipo de acordo. Eu vou excluir todo esse conteúdo, todo esse recipiente para que eu possa adicionar um elemento. Eu posso adicionar um anúncio de órgão de bloco de texto de um modelo, e este anúncio de Template é o meu favorito, o meu recurso favorito de todo este tema. Então, se eu clicar nisso. Agora o que eu posso fazer é eu posso. No lado esquerdo, posso ver algumas opções diferentes que temos ou podemos percorrer. E você pode ver que eles têm um Thanh de elementos já assados neste tema. Então eu vou ir em frente e começar por limpar a seção de heróis, vou clicar sobre isso, e você pode ver que estreita minhas opções para algumas seções de herói realmente elegante olhar. Então, por exemplo, eu não quero esta versão só quero mostrar como isso é legal. Eu estou indo apenas para clicar neste hitter criativo, clique pré-visualização mudanças e de repente, apenas assim, eu tenho um gráfico realmente legal olhando Agora, obviamente, obviamente, ele não combina com o campo de golfe em tudo, mas eu tenho que fazer é mudar a cor, mudar a imagem, e então este é um layout de página muito legal. Tudo bem, então eu vou voltar para esta página de edição aqui. Vou deletar essa seção e isso, na verdade, tentar encontrar algo um pouco melhor. Então clique em modelos de vela vai voltar seções Teoh herói e eles apenas Olhe, há tantas grandes opções. Agora este campo de golfe em particular, eu tenho algumas imagens realmente ótimas de drones, então eu provavelmente quero colocar um vídeo lá dentro. Então vamos apenas digitar vídeo e ver quais opções temos aqui. Então nós temos o herói de vídeo dispositivo temos aqui O Grady em sobreposição com luz de vídeo Nós temos Vamos ver eu quero que eu quero é um fundo de vídeo. Vamos ver aqui vamos voltar para você, todos eles, e digitar vídeo. Isso deve nos dar mais algumas opções. Então, vamos clicar nesta linha lightbox de vídeo paralaxe e isso é clique em pré-visualizar alterações. Vai abrir uma janela de pré-visualização, e por isso não tem um fundo em movimento. Simplesmente tem. Então eu provavelmente vou passar uma tonelada de tempo bisbilhotando por aqui, então vamos apenas acelerar isso um pouco. O que eu posso fazer agora é apenas continuar clicando de volta nesses modelos e apenas adicionando coisas para que eu pudesse adicionar, Vamos para como uma seção sobre aqui. Basta rolar para baixo e encontrar algum olhar legal e blocos coloridos. Clique em que vamos clicar para trás, e que o solta bem aqui, vamos clicar de volta em modelos salientes novamente. Vamos voltar para ... Que tal serviços ou algo louco? Vamos clicar nisso. Vai aplicá-lo. Abra outro, talvez alguns depoimentos. Largue isso aqui e agora o que posso fazer é clicar em pré-visualização, e vou apagar tudo isso e trabalhar fora da linha. Não estamos olhando para mim, mas você pode ver quão rápido esta home page parece tão boa. Tipo, obviamente precisa de um pouco de refinamento, mas nós temos animações embutidas. Temos imagens de fundo impressionantes que estão cheias com seu totalmente responsivo. À medida que nos escalei, vai haver um tema muito fixe para nós. Então, o que quer que faça agora é que eu vou até você realmente fecha a janela de visualização se eu gostar disso. E tudo foi feito alto queria, então eu iria bater atualização causa agora, quando você clica, mudanças muito. Nada realmente atualizado ainda. Mas parece que eles batem atualização agora a nova home page é exatamente assim. Então, em vez de clicar em pré-visualização se eu clicar em exibir página, ele vai me levar para o site de vida para a página Vida. E ao vivo, quero dizer, ainda estou no local de desenvolvimento, mas, hum, hum, mas agora todas essas mudanças entraram em vigor. Então, tenho muito trabalho a fazer. Eu pareço cair em imagens do curso. Ainda preciso atualizar o texto para refletir isso, mas estou muito animado com isso e House como vai parecer. Então o que eu vou fazer agora é voltar para editar a página, e eu vou apagar todas essas coisas porque eu estou realmente gastar algum tempo pensando exatamente sobre o que eu quero deixar cair dentro. E então eu vou te mostrar como eu fiz isso aqui em um segundo. Então é apenas apagar todo esse lixo, e, e, hum, vamos começar de novo e eu vou te mostrar o que eu fiz no próximo vídeo. Tudo bem, obrigado, pessoal. 45. Considerações finais: Espero que você tenha aprendido muito nos últimos vídeos com este estudo de caso real, e isso é dado a você algumas idéias que você pode colocar em movimento imediatamente. E eu só quero fazer um acompanhamento rápido desses últimos vídeos. Se você tiver alguma dúvida, por favor me avise. Quero ajudar-te o melhor que puder. E eu também quero apontar algumas coisas que você deve ter notado ao longo do caminho. E uma é se você está trabalhando com um cliente, Ah, muitas vezes você não vai ter a liberdade e flexibilidade que eu tinha aqui, e eu acho que essa parte disso é porque para este projeto em particular foi uma troca parcial. Então eles me pagaram algum dinheiro para começar. Mas também é uma situação de comércio residual onde eu posso ir jogar golfe e quando eles têm uma atualização rápida como adicionar um novo membro da equipe ou modificar algumas fotos ou mudar algumas datas e coisas, eles apenas me ligar e eu apenas fazer as mudanças por causa disso para que eles não se importem. Mas eles não são tão exigentes quanto um cliente que, você sabe, talvez este seja seu primeiro site, e é todo o dinheiro que eles economizaram para começar esse novo negócio. Então, quando você trabalha com um cliente assim, normalmente haverá muito mais exigente e muito mais mãos em cima, então você vai precisar navegar por isso. Em cada caso, você sabe, cada cenário ao vivo. É seu próprio site, você sabe, obviamente você pode fazer o que quiser. Então, com este estudo de caso em particular, é basicamente como era. Eu só passei e fiz mudanças que eu gosto estilisticamente, e eu meio que enlouqueci com isso. Então, apenas algo que também, eu acho que quando você se aproxima de trabalhar com clientes da Riel é que você vai querer definir o que chamamos de seu escopo de trabalho. E isso é basicamente, você sabe, para cada fase do projeto, o que exatamente você está trabalhando e quanto você promete para eles por um determinado custo? Então só algo é o dedo do pé. Considere, quando você mergulhar nisso e novamente, se você tiver perguntas, por favor sinta-se livre para me ligar. Você nos confira no grupo do Facebook, bem como nos comentários abaixo. Farei o meu melhor para responder onde puder e também ficar atento. Isto é obviamente ainda um trabalho em andamento para mim também, porque ah, estamos quites agora enquanto estou gravando este vídeo, fazendo mais atualizações para o site. Então, como eu posso gravar mais alguns desses e publicá-los aqui para que você possa tipo de ver a progressão deste site e como nós conseguimos mantê-lo atualizado. Muito bem, pessoal, obrigado por assistirem.