Primeiras aulas do curso Wordpress: sites com Elementor

Wordpress: sites com Elementor

Primeiros passos com o Wordpress - Introdução

Boas vindas a oo curso de Wordpress. Sou Rafael Nercessian, e serei seu instrutor.

Nosso aprendizado será dividido em duas partes: discutiremos os principais pontos do Wordpress, o que é um post, página, categoria e outros elementos.

Depois, seremos contratados pela Alura Viagens, uma empresa de turismo que deseja aproveitar as Olimpíadas de Verão de Tokyo 2020 para montar roteiros de viagem para o Japão. Nossa tarefa será montar o site dessa empresa.

Aprenderemos a incluir um videobackground, criar animações, inserir imagens com efeito paralax, slider.

Não é necessário nenhum requisito para este curso, não utilizaremos códigos, apenas plug-ins do Wordpress, mais especificamente o Elementor.

Vamos começar?

Primeiros passos com o Wordpress - Instalando o Wordpress

O Wordpress é a principal plataforma de gerenciamento de sites que temos hoje no mercado. Teremos um painel administrativo, em que o administrador irá criar e manipular todo o conteúdo exibido na parte frontal da aplicação.

Nosso site terá uma série de recursos como imagens e animações que serão desenvolvidos ao longo do projeto, e todos esses conteúdos serão gerenciados em único painel administrativo.

painel

O Wordpress está no mercado acerca de 16 anos, e foi desenvolvido originalmente com a ideia de ser uma plataforma de gerenciamento de blogs. Contudo, muitos contribuidores ajudaram para que esse projeto tenha recursos disponíveis para construir outras plataformas, como sites e lojas virtuais.

Um dos principais pontos que fizeram com o o Wordpress se tornar-se tão popular é que é possível construir sites sem um conhecimento avançado de programação, o que reduz o tempo de desenvolvimento.

No projeto da Alura viagens, não utilizaremos nenhum código!

Existem muitos sites que foram construídos via Wordpress,inclusive de pessoas muito famosas, como o site pessoal de Kate Parry, Usain Bolt e da banda britânica Rolling Stones.

O Wordpress é uma ferramenta gratuita, mas precisaremos de alguns programas: servidor web e bando de dados do mySQL.

O programa Xampp poussi um servidor web da Apache e também o banco de dados do mySQL. Para fazermos a sua instalação neste site.

Uma vez que o download for concluído, iniciaremos o processo de instalação. Basta pressionarmos o botão "Next" nas caixas de diálogo e a instalação será concluída depois de alguns minutos.

Teremos acesso a um painel de configurações do Xampp, e primeiramente iniciaremos o servidor Apache e do MySQL ao clicarmos no botão "Start".

start

Resta agora instalarmos o Wordpress em nosso ambiente local de desenvolvimento, para tanto, acessaremos este site.

Uma vez que download estiver concluído, levaremos a pasta "wordpress" para o local de instalação do Xampp: "disco local C: > xampp > htdocs". Dessa maneira todos os arquivos necessários estão prontos. Para tornar a organização dos arquivos mais descritiva, mudaremos o nome da pasta "wordpress" para "alura-viagens".

Para acessarmos esse arquivo, no browser escrevermos o caminho localhost/alura-viagens. Será exibido na página os passos de instalação que deverão ser realizados.

Em um formulário, precisaremos especificar o banco de dados que iremos usar. Nosso banco ainda não existe, então o criaremos.

De volta ao painel do Xamp, clicaremos sobre a aba "Admin" na linha do "MySQL".

admin

Será aberta uma nova tela sobre o gerenciamento de banco de dados. Paa criarmos um novo banco, selecionaremos a opção "novo", no painel à esquerda, então escreveremos o nome do novo banco que criaremos: "alura", e então clicaremos sobre "criar", assim já teremos o banco de dados pronto para ser usado.

Voltaremos ao formulário do Wordpress no browser, e no campo "nome do banco dedos" inseriremos "alura". Para o campo "nome do usuário" manteremos o nome padrão que é "root". Não inseriremos qualquer senha. Em "prefixo da tabela" estará como default a opção "wp". Agora é só clicar em "Enviar".

O próximo passo é inserir informações referentes ao site, como título do site, que será "Alura Viagens", nome de usuário, alguma senha e o e-mail. Por fim clicaremos em "instalar wordpress".

Concluída esta etapa, podemos acessar o painel administrativo, exibido no começo da aula.

Primeiros passos com o Wordpress - Criando o primeiro post

Fizemos a instalação do Xampp e do Wordpress em nossa máquina local de desenvolvimento. Antes de começarmos a montar o projeto do Alura Viagens, iremos discutir alguns pontos do painel administrativo.

Neste momento, apenas instalamos o Wordpress e não realizamos mais nada. O que um usuário neste momento visualizaria se acessasse nossa "página"?

Abriremos no browser uma nova janela por meio do atalho "Ctrl + Shift + N" e inseriremos localhost/alura-viagens.

Encontraremos uma postagem "Olá mundo", um breve texto, e ao rolarmos a página encontraremos abas de comentário e outros elementos.

projeto sem nada

Nós não criamos nada disso! São elementos automáticos que o próprio Wordpress insere. Notaremos, ainda, que a estrutura é parecida com a de um blog.

É de se esperar que, ao acessarmos o painel administrativo, encontremos um post chamado "Olá mundo!",correto? No painel de ferramentas à esquerda, clicaremos sobre "Posts", e então encontraremos o texto "Olá Mundo".

Vamos criar um post para entender como esse processo funciona. Para tanto, basta clicar em "Adicionar novo", na parte superior da página.

novo post

Como mostraremos um projeto de agência de viagem, colocaremos no nome da cidade de São Paulo como tema do primeiro post. Adicionaremos o lorem ipsum para simular conteúdo. E então clicaremos em "Visualizar" no tanto superior direito da tela.

Para adicionarmos uma imagem de destaque que ilustre o post. Na página em que escrevemos o post, teremos uma barra lateral à direita, então selecionaremos a opção "Imagem destacada > definir imagem destacada". Então, selecionaremos um arquivo do computador para compor o post.

Ao visualizarmos novamente o post, teremos uma imagem destacada que ocupa uma grande área da página, em seguida o conteúdo textual.

Por enquanto, apenas o administrador pode visualizar este conteúdo, afinal ele ainda não foi publicado, apenas visualizamos como ele ficaria. Para realizar a publicação, basta clicar no botão "Publicar", no canto superior direito da tela.

Quando acionamos essa ação, teremos algumas opções: público, privado e protegido por senha. Acionaremos a opção público. Poderemos, ainda, agendar um post para uma data específica e adicionar tags. As tags funcionam para que o usuário encontre o conteúdo de maneira mais fácil e para que os mecanismos de busca saibam que conteúdo estamos oferecendo.

Finalizado esse processo o post estará disponível para visualização pública, a ordem de exibição é sempre do mais recente ao mais antigo.

Sobre o curso Wordpress: sites com Elementor

O curso Wordpress: sites com Elementor possui 164 minutos de vídeos, em um total de 54 atividades. Gostou? Conheça nossos outros cursos de WordPress em Front-end, ou leia nossos artigos de Front-end.

Matricule-se e comece a estudar com a gente hoje! Conheça outros tópicos abordados durante o curso:

Aprenda WordPress acessando integralmente esse e outros cursos, comece hoje!

Plus

  • Acesso a TODOS os cursos da plataforma

    Mais de 1200 cursos completamente atualizados, com novos lançamentos todas as semanas, em Programação, Front-end, UX & Design, Data Science, Mobile, DevOps e Inovação & Gestão.

  • Alura Challenges

    Desafios temáticos para você turbinar seu portfólio. Você aprende na prática, com exercícios e projetos que simulam o dia a dia profissional.

  • Alura Cases

    Webséries exclusivas com discussões avançadas sobre arquitetura de sistemas com profissionais de grandes corporações e startups.

  • Certificado

    Emitimos certificados para atestar que você finalizou nossos cursos e formações.

  • Alura Língua (incluindo curso Inglês para Devs)

    Estude a língua inglesa com um curso 100% focado em tecnologia e expanda seus horizontes profissionais.

12X
R$85
à vista R$1.020
Matricule-se

Pro

  • Acesso a TODOS os cursos da plataforma

    Mais de 1200 cursos completamente atualizados, com novos lançamentos todas as semanas, em Programação, Front-end, UX & Design, Data Science, Mobile, DevOps e Inovação & Gestão.

  • Alura Challenges

    Desafios temáticos para você turbinar seu portfólio. Você aprende na prática, com exercícios e projetos que simulam o dia a dia profissional.

  • Alura Cases

    Webséries exclusivas com discussões avançadas sobre arquitetura de sistemas com profissionais de grandes corporações e startups.

  • Certificado

    Emitimos certificados para atestar que você finalizou nossos cursos e formações.

  • Alura Língua (incluindo curso Inglês para Devs)

    Estude a língua inglesa com um curso 100% focado em tecnologia e expanda seus horizontes profissionais.

12X
R$120
à vista R$1.440
Matricule-se
Conheça os Planos para Empresas

Acesso completo
durante 1 ano

Estude 24h/dia
onde e quando quiser

Novos cursos
todas as semanas