Carregando...
Tutoriais

Como criar um POST no WordPress com Elementor

O Elementor é uma poderosa ferramenta de edição dentro do WordPress. Mesmo em sua versão gratuita, a ferramenta oferece uma série de opções de componentes que podem deixar seu site cada vez mais atrativos. Neste tutorial iremos mostrar como criar um post do zero utilizando elementor.

Neste post, utilizaremos um texto fictício (Lorem Ipsum) e faremos a utilização de três componentes do wordpress: Imagem (com opção de clique para abrir um outro site), um vídeo hospedado no youtube e uma galeria de imagens.

Na utilização do EZSYS, recomendamos seriamente que seus vídeos públicos sejam hospedados no Youtube afim de preservar e reduzir o consumo dos seus recursos de hardware. Assim você evita a necessidade de um Upgrade de Plano.

Inicialmente faça acesse o seu painel de administração do WordPress. Não se preocupe com a instalação do Elementor pois em todas as publicações do EZSYS, o Elementor é componente padrão.

A partir da área administrativa do seu portal WordPress, acesse a opção Blog de Posts, conforme grifado na imagem acima. Em seguida clique no botão Adicionar Novo, para criarmos um novo Post.

Na tela seguinte faremos a inclusão de alguns dados essenciais. Esses dados são importantíssimos para destacarmos nosso Post, principalmente para os mecanismos de busca.

Agora Informaremos o título do Post.

Em seguida nós realizaremos as seguintes etapas para configuração do nosso Post. Todas as configurações serão realizadas no menu a direita, conforme a imagem acima:

  • Vamos Selecionar uma categoria para o Post. Uma categoria é uma forma de organizar os seus posts por temas e assim agrupa-los. Você pode selecionar uma categoria existente na lista de categorias;
    • Para criar uma categoria, basta clicar na opção categoria a Esquerda e preencher o Nome da Nova Categoria. É possível selecionar uma categoria ascendente (categoria pai) para a nova categoria. Essa é uma forma de aninhar seus temas e sub-temas.
  • Vamos informar uma imagem de destaque para o nosso post. Essa imagem de destaque é muito importante pois ela será exibida em nossa página principal, representando o nosso Post. O mesmo vale para o compartilhamento dos conteúdos em redes sociais, WhatsApp, Telegram, LinkedIn, dentre outros.
  • Vamos informar se o nosso post permite ou não a utilização de comentários nos Posts. Nós da EZSYS recomendamos que essa opção esteja sempre desmarcada, ou seja, que você não permita comentários em seus posts, uma vez que essa opção pode sobrecarregar o seu post com conteúdo inadequado. Caso queira disponibilizar comentários em seus posts, tenha certeza de possuir uma pessoa responsável por controlar o conteúdo que é publicado nos comentários.
  • Vamos informar um resumo do Post. Esse resumo ajuda principalmente os motores de busca a encontrar os seus posts. Portanto a utilização de palavras chaves na composição deste resumo é muito importante.
  • Marcaremos a Visibilidade como privada, uma vez que ainda estamos criando nosso Post e não queremos que ele seja visualizado por nossos leitores enquanto não for finalizado. Caso seja perguntado se deseja publicar imediatamente o post como privado, clique em OK.

No final, seu Post deve ficar conforma a imagem abaixo:

ATENÇÃO! Em alguns dos temas do EZSYS é possível, além de adicionar a imagem de destaque adicionar um vídeo de resumo e/ou destaque do Post, informar se o Post será exibido na barra de Últimas Notícias, entre outros. Caso tenha interesse nesses recursos e não esteja disponível em seu tema atual, entre em contato conosco.

Por fim, clique em atualizar para salvar as alterações realizadas.

Agora que finalizamos a configuração do nosso post, vamos iniciar a criação dele com o Elementor. Para isso vamos clicar no botão Azul na parte superior da nossa tela, Editar com Elementor. Em seguida teremos uma tela como a exibida abaixo.

Conforme vemos na imagem acima, o Elementor exibe o post como ele será apresentado para os nossos leitores, respeitando sempre o tema e as configurações aplicadas. Observe que a imagem de destaque que selecionamos é exibida logo acima no Post. Observe também que o título do Post aparece com o termo Privado: antes do título. Isso é apenas um lembrete para que não nos esqueçamos de que nosso post ainda não está disponível para os usuários. Abaixo do título temos o usuário que fez a publicação, a data do Post, os comentários, o botão de compartilhamento do Post e o tempo médio estimado de leitura do post. Esses dados podem ser removidos e ajustados conforme a sua preferência. Basta nos solicitar através do suporte ou contato via nosso WhatsApp.

Bom agora vamos ao que interessa. Como nosso post já possui título, imagem de destaque e demais ferramentas, nos cabe agora inserir o seu conteúdo, que conforme combinamos no inicio do artigo, será composto de textos, imagens e vídeos.

Vamos iniciar inserindo em nosso Post um texto introdutório, que conforme mencionamos anteriormente será um texto fictício. Para isso vamos clicar e arrastar o componente Texto (item verde) até a área disponível do Elementor (item vermelho)

O resultado será conforme a tela abaixo.


Observe a caixa de texto que surgiu no menu. Nela iremos inserir todo o nosso texto, podemos formatar trechos do texto, adicionar links, mídias, etc. Observe também que o Elementor já disponibilizou uma nova caixa para que possamos anexar um novo componente. Algo que iremos fazer nas próximas etapas.

Agora, vamos substituir o texto do Elementor pelo nosso texto.

Observe que nosso texto começa com a primeira letra do paragrafo em destaque. Isso é possível ligando a opção Inicial em maiúscula, disponível logo abaixo da caixa de texto do menu.

Uma vez realizadas essas alterações vamos clicar no botão Atualizar (Botão verde) para salvar nossas alterações. Quando o Elementor tiver finalizado o salvamento, o botão ficará na cor cinza.

PS: Para retornar a lista de componentes, basta clicar no botão de componentes (item verde) da imagem acima.


Desta vez, vamos clicar no botão + conforme o item vermelho e na janela seguinte (imagem abaixo) vamos selecionar a estrutura com 3 colunas.


O Resultado deve ser conforme a imagem acima. Observe com o Elementor adicionou uma nova área com 3 colunas, cada coluna com um sinal de mais (+). Isso significa que podemos inserir conteúdo dentro dessa coluna. E neste nosso caso, faremos a inclusão de 2 imagens (uma a direita e outra e esquerda) e um vídeo no centro. Vale lembrar que dentro dessas colunas é possível inserir qualquer componente do Elementor e realmente recomendamos que vocês façam testes com cada um desses componentes.

Vá para a lista de componentes (acima explicamos como retornar a lista de componentes do Elementor, clicando no botão de lista de componentes) e clique no componente de imagem e arraste até a primeira coluna ( da esquerda para direita ) e depois repita o processo arrastando uma imagem para a coluna da direita.

O resultado deve ser como a imagem abaixo.

No menu clique em Escolher imagem (item vermelho) para selecionar a imagem que deseja exibir. Repita o processo para a imagem da direita, selecionando qualquer imagem da sua preferência.

Na caixa de Link, selecione a opção URL personalizado. Uma caixa de texto irá se abrir. Clique nessa opção e informe o link para onde deseja que o usuário seja direcionado. Observe que existe na frente da caixa de texto do link uma engrenagem. Clique nela para que outras configurações relacionadas ao link, como pode exemplo, abrir em outra janela seja configurada.

A segunda imagem, não queremos que vá para nenhum outro site. Então vamos deixa-la como está.

Agora vamos adicionar o video em nossa coluna central. Para isso vamos clicar e arrastar o componente vídeo do Elementor.

O Elementor por padrão trás o vídeo de demonstração do próprio Elementor publicado no Youtube. Mas podemos alterar o vídeo facilmente trocando o link e inserindo o link do video do Youtube que queremos exibir. Podemos escolher outras fontes de vídeo como Vimeo, DayliMotion ou Auto-Hospeado, que são videos armazenados dentro do próprio WordPress e que não recomendamos a não ser em casos de videos que não podem ser publicados no youtube ou outras fontes publicas (videos pagos).

Conforme podemos ver na imagem acima, temos varias opções de configurações para o nosso video. Como reproduzir automaticamente ou definir a partir de qual minuto/segundo o video vai iniciar e/ou finalizar.

Finalmente vamos incluir a nossa galeria de imagens. A galeria de imagens do Elementor, como o próprio nome sugere, permite que exibamos um conjunto de imagens previamente dispostas. Essas imagens podem ser clicadas para que seus usuários as visualizem em um tamanho maior, mas não é possível clicar nessas imagens para abrir outros links, como nas imagens anteriores.

Para incluir a galeria de imagens repetiremos os passos anteriores para a inclusão de um novo componente, ou seja, vamos clicar no botão (+) porem agora a estrutura que iremos escolher será a de uma única coluna. Agora vamos clicar e arrastar o componente Galeria básica para a coluna recém criada.

Teremos algo como a tela cima. Observe na barra lateral que temos uma caixa indicando que nenhuma imagem foi selecionada e logo abaixo um sinal de (+). Vamos clicar nesse sinal para adicionarmos as imagens que fazem parte da nossa galeria. Uma tela com todas as imagens que temos em nosso WordPress será exibida. Caso você queira adicionar outras imagens, basta arrastar as imagens para a galeria que o WordPress fará Upload Automaticamente. Para saber mais sobre a galeria de mídia do worpress consulte veja esse tutorial sobre Galeria de Mídia do WordPress.

Selecione as imagens que deseja que façam parte da sua galeria de imagens e em seguida clique em Criar uma nova galeria. Em seguida serão exibidos as imagens que você selecionou na etapa anterior. Confirme clicando em Inserir Galeria e o resultado deve ser como a página abaixo.

Como você pode observar, algumas imagens possuem legendas e outras não. Essas legendas são textos que são adicionados as imagens dentro da galeria de imagens e que você pode editar a qualquer momento, a partir da Biblioteca de Mídias ou dentro da própria galeria.

Clique em Atualizar. Em seguida Clique no menu Hamburguer conforme (item vermelho) da imagem abaixo e selecione a opção Sair para o Painel. Você será redirecionado para a página de criação do post, onde faremos os ajustes finais do nosso post.

De volta a página de criação do nosso Post, vamos remover a opção de permitir comentários. Para isso vamos navegar, no menu lateral direito até a opção discussão, conforme a imagem abaixo.

Conforme vemos na imagem acima, as opções Permitir Comentários e Permitir pingbacks e trackbacks estão marcadas. Vamos desmarcar ambas as opções.

Agora, voltar até o início do menu e altera a visibilidade da nossa página de Privado para Público para que nossos usuários possam ter acesso ao nosso Post.

Em seguida vamos clicar no botão atualizar (item vermelho). Para conferirmos como ficou nosso post, clicamos no botão visualizar (item verde).

CONCLUSÃO

Conforme vimos o Elementor é uma ferramenta extremamente poderosa e que nos oferece muitos recursos dentro do WordPress. Com ele é possível expor nossos posts de várias maneiras e vários modelos sempre oferecendo o que cada post tem de melhor sobre aquele assunto. Nós recomendamos que vocês se aprofundem nas capacidades do Elementor, mesmo na sua versão gratuita pois é possível criarmos posts muito ricos, com animações e interatividade. Escreveremos outros posts sobre trabalhos com Elementor e como podemos adicionar animações aos nossos textos e imagens, como formatar as fontes, trocar as cores.