Como editar páginas no WordPress - domine o editor do WordPress

Para editar páginas no WordPress, você não precisa ser muito técnico - se você tiver alguma experiência com um editor de texto, vai achar que é bastante simples. Use o editor do WordPress para postagens e páginas.

Veja também: Como editar o nome de uma página>

Os exemplos que usei aqui estão no sistema WordPress.org , mas o WordPress.com é muito comparável na forma como as páginas são alteradas. A postagem será útil para os dois.

ATUALIZAR. Esta postagem se refere ao Editor WordPress Classic, não aos Blocos do WordPress, também conhecido como Glutenberg WordPress Editor, usados ​​desde 2018. No entanto, esta postagem ainda será útil para alguns.

Vejamos o que você aprenderá.

Ao final desta postagem, você deve entender como formatar e editar páginas no WordPress por:

• Editando e salvando na área administrativa,
• visualizar as alterações no front end,
• e usando ferramentas de formatação no editor do WordPress.

Antes de atualizar qualquer postagem ou página, faça backup do banco de dados do WordPress. Eu uso o DB Migrate, um plugin de backup e migração que está disponível gratuitamente.

O que você precisa para editar páginas no WordPress

• Um nome de usuário e senha WordPress de seu desenvolvedor web.
• O URL da área de administração (também conhecido como endereço da web ou, possivelmente, link).

Depois de obtê-los, navegue até o seu URL, digitando-o no navegador ou clicando no link.

Digite o nome de usuário e a senha e clique em Login . Você chegará ao painel do WordPress.

Visualize o site do WordPress em uma nova guia

A primeira coisa que faço é abrir a parte voltada ao público do site em uma nova guia do navegador. Em seguida, tenho a área de administração (back end) visível em uma guia e o espaço público (front end) visível na outra. Assim, posso alternar entre os dois.

A maneira mais fácil de abrir o front end do seu site WordPress em uma nova guia é;

• Na área de administração - passe o mouse sobre o ícone da casa, no canto superior esquerdo da tela.
• No menu suspenso, CLIQUE COM O DIREITO em 'Visitar Site'.
• Clique em “Abrir link em nova guia”. Eu sublinhei isso em vermelho abaixo.

NB. Pode haver uma variação de palavras dependendo do navegador que você está usando.

Duas guias do navegador agora estão abertas, o que significa que você pode alternar entre as duas.

Continue a editar a página do WordPress em uma guia, usando a área de administração.

Por outro lado, você visualizará o front-end do seu site para verificar cada alteração feita.

Ao fazer edições e salvá-las, você pode usar a tecla Tab para acessar o front end do site. Pressione a tecla F5 para atualizar a página - isso faz com que o navegador mostre a versão atualizada.

Editando o conteúdo da página no WordPress

Agora que você configurou sua área de trabalho, vamos começar na área administrativa. Aqui você encontrará o editor WordPress.

Clique em PÁGINAS no menu à esquerda. As páginas do seu site são listadas.

Outras opções aparecem quando você passa o mouse sobre o nome de uma página.

EDIT o levará para a tela de edição completa.

A EDIÇÃO RÁPIDA permitirá que você altere o título, slug, data, privacidade, pai, pedido, modelo e status nesta tela.

BIN irá enviar a página para a lixeira. A página não estará mais visível no site.

VIEW permitirá que você veja esta página em particular - a parte frontal (ou pública).

Para editar uma página, clique na primeira opção, EDITAR. Ou clique no nome da página.

Você chegará à tela de 'edição de página' do WordPress.

Editando páginas no tutorial do WordPress

Devo primeiro chamar sua atenção para os temas e plug-ins do WordPress que às vezes personalizam a tela de 'edição de página'.

Por exemplo, DIVI usa uma interface chamada DIVI Builder; O Avada's é chamado Fusion Builder.

Qual versão você está usando?

O mais recente editor do WordPress é o Gutenberg Block Editor. Se sua página se parece com a imagem abaixo, você está usando blocos - visite meu post no editor de blocos.

Se o editor WordPress for semelhante à imagem abaixo, você está usando o editor WordPress Clássico.

Se você não estiver usando um construtor personalizado, podemos começar.

Ícones de botão do editor WordPress explicados

No editor clássico, o primeiro ícone do botão é o ícone TOOLBAR TOGGLE, antes chamado de 'pia da cozinha'. Na imagem acima, você pode ver que ele está ativado porque está invertido.

O ícone de alternância da barra de ferramentas é parecido com este:

Este ícone de botão mostra ou oculta opções extras de formatação. Mantenha-o ativado.

Formatando texto em WordPress

Como a maioria dos editores do WordPress, você pode destacar o texto e formatá-lo.

Da esquerda para a direita na barra de edição principal estão:

B - torna o texto em negrito ou forte.
I - colocar o texto destacado em itálico.
abc - isso adicionará um tachado ao seu texto, como se fosse riscá-lo. Prático para itens vendidos.

O ícone de botão para uma lista não ordenada no web talk, mas o WordPress o chama de lista com marcadores. Use isso para criar listas. Por exemplo:

• Este é o primeiro ponto.
• Este é o segundo ponto de ordem.

No final de cada linha, clique em voltar (ou inserir) sempre que desejar um novo marcador.

Uma dica rápida: clicar em SHIFT-ENTER cria uma quebra de linha, o que é útil em listas de marcadores, pois você pode descer uma linha sem fazer um novo marcador.

• Este é o título do meu primeiro ponto.
  Eu falo um pouco sobre isso pressionando SHIFT-ENTER.
• Agora eu tenho meu segundo ponto.
  Um pouco sobre isso.

Para interromper uma lista, basta clicar em return duas vezes após a última linha. Ou aperte o ícone pela segunda vez. O WordPress retornará aos parágrafos normais.

O designer do seu site, ou tema, pode ter usado CSS para estilizar as listas. Você nem sempre pode alterar o estilo na tela de edição do WordPress.

Este ícone é a lista de números, chamada lista ordenada no idioma da Internet. Use-o da mesma forma que a lista de marcadores acima, exceto que a lista será numerada.

Blockquotes recua uma linha de texto. Novamente, o tema ou os desenvolvedores da web podem ter estilizado isso, então você pode não ser capaz de estilizá-los.

A seguir vem a linha horizontal. Use a linha horizontal para criar quebras em pedaços de texto. O tema controla os estilos. O estilo acima é o estilo padrão - uma linha cinza com 1 pixel.

Alinhando parágrafos no WordPress

O layout de parágrafos e títulos geralmente é definido em uma folha de estilo, fazendo com que esses botões de alinhamento funcionem um pouco erraticamente.

Eu tendo a deixar a folha de estilo governar meus parágrafos, mas se eu adicionar uma imagem, eu a alinho no editor do WordPress.

Clique em uma linha de texto e, a seguir, clique em uma ferramenta de alinhamento - o alinhamento se aplica a um parágrafo inteiro.

Freqüentemente, o parágrafo seguinte seguirá o alinhamento do anterior. Normalmente, isso acontece quando uma quebra de linha é usada em vez das tags de 'parágrafo'. Existe uma solução simples.

• Coloque o cursor no final do primeiro parágrafo.
• Agora pressione DELETE (backspace) para puxar o segundo parágrafo para cima.
• Pressione ENTER para terminar um parágrafo e começar um novo.
• Dois podem ser alinhados separadamente.

Criação e edição de links no WordPress

O ícone do link - texto e imagens podem ser vinculados a páginas, postagens ou um site externo.

Para vincular texto no WordPress, certifique-se de destacar o texto primeiro.

Uma dica rápida: clique duas vezes em uma palavra para destacar a palavra inteira. Mantenha a tecla shift pressionada e clique na segunda palavra para destacá-la também.

Agora clique no ícone do seu link.

Se você estiver criando um link para uma página / postagem em seu site, comece a digitar o título.
NB. digite o TÍTULO da página, não o slug.

Editar um título de página do WordPress

Depois de encontrar a página na lista, clique na seta azul 'voltar' no final do campo para aplicá-la.

Para personalizar mais o link, clique no ícone de engrenagem no final do campo antes de clicar em aplicar.

O ícone de engrenagem abre uma caixa contendo OPÇÕES DE LINK - escolha a página que deseja vincular.

Não recomendado, mas os links podem abrir uma nova janela (ou guia). Basta marcar “Abrir link em uma nova guia” na tela de opções de link. O Google penaliza links que abram uma janela diferente - os usuários devem ser capazes de tomar essa decisão.

Uma dica rápida: na versão mais recente do WordPress, você nem precisa pressionar o ícone do link ao vincular o texto. Copie o link para a área de transferência, realce o texto e pressione control-v para colar o link.

Vincular uma imagem no WordPress é um processo semelhante.

Selecione a imagem e clique no ícone do link. Siga as etapas acima.

Como editar um link no WordPress

Para EDITAR links, siga etapas semelhantes.

Destaque o texto ou selecione a imagem. Use o mesmo ícone e altere o link para o novo. Ou clique no ícone de lápis que aparece.

Como remover um link no WordPress

Este ícone completo remove o link. Basta clicar em qualquer lugar no link de texto ou selecionar uma imagem e, em seguida, clicar neste botão.

O ícone de ler mais é um que eu nunca uso. O WordPress permite colocar texto dentro de uma tag LEIA MAIS, ocultando-o na página até que o usuário clique para ler mais. O texto ainda estará disponível para rastreamento dos mecanismos de pesquisa, mas o Google não aprecia conteúdo oculto.

Parágrafos e títulos em WordPress

Na barra de ferramentas, você verá um menu suspenso.

Para formatar uma linha, clique no texto na linha ou no parágrafo e use o menu suspenso para selecionar um parágrafo, um título 1 ou um título 2.

O tema define o estilo dos títulos e parágrafos, o que mantém o design do site consistente.

Use as tags corretas para os títulos e o design continuará no site.

O que está escrevendo SEO?

Mais ferramentas de formatação no WordPress

Use este ícone para sublinhar o texto em seu conteúdo WordPress, fazendo-o se destacar ou fazer uma declaração.

Basta destacar o texto e clicar no ícone de sublinhado.

Uma ferramenta de alinhamento de texto e criará um parágrafo justificado. O espaçamento é ajustado entre letras e palavras para que o texto fique alinhado com as margens direita e esquerda. Também conhecido como justificado totalmente ou justificação completa e ótimo para texto dentro de colunas.

Como um web designer WordPress, aconselho você a usar este ícone com cuidado. O botão muda a cor do texto. Já vi clientes criarem frases brilhantes e coloridas com a intenção de chamar a atenção. Não parece bom. Mantenha o texto uniforme.

Por que ter o ícone 'colar como texto' no WordPress? O texto copiado de um site ou documento do Word também possui o formato. Cole-o em uma página do WordPress e cole a formatação. A página acaba ficando com uma aparência horrível devido ao código estar em posições inúteis.

Portanto, da próxima vez que você copiar e colar, copie; em seguida, coloque o cursor no lugar e clique na ferramenta 'colar como texto' para adicionar texto sem formatação. Em seguida, formate-o no WordPress.

Se você encontrar seu texto por toda parte em uma página, geralmente ele está sendo formatado. Se você sabe o que está fazendo e tem um backup, use a ferramenta 'limpar formatação' para remover toda a formatação, removendo o texto para que você possa formatá-lo sozinho.

O próximo ícone, o ômega grego, abre o mapa de caracteres abaixo, permitindo que você adicione caracteres especiais, como agudo, grave e circunflexo. Útil se você estiver criando uma página multilíngue.

Estes são os ícones de recuo. Usando-os, você pode aumentar ou diminuir o recuo de um parágrafo ou título.

E, finalmente, os ícones desfazer / refazer. O da esquerda é para desfazer e é muito útil. É um cinza mais escuro nesta imagem porque há um movimento de desfazer que posso fazer. O botão de refazer está desabilitado - não há nada que eu possa 'refazer' no momento. Para refazer, você deve desfazer algo primeiro.

Salvar uma página do WordPress

Quando você fizer alterações substanciais em sua página ou postagem do WordPress, clique no botão ATUALIZAR para salvar a página. Isso atualiza a página voltada para o público. Sempre atualize sua página ao visualizar as alterações no front end para verificar seu trabalho.

Auto-salva e revisões em WordPress

O WordPress freqüentemente salva automaticamente rascunhos da página.

As revisões da sua página podem ser recuperadas, usando o link revisões. Ele é encontrado nas configurações do POST. Se as configurações de postagem estiverem fechadas, acerte a engrenagem, canto superior direito para abri-las. Em seguida, acesse a guia Página (ou Publicação, dependendo do que você está editando) na parte superior.

• Clique no link 'Revisões' para ver rascunhos e revisões que foram armazenados durante a vida útil do documento.
• Você chegará à tela 'Comparar revisões'.
• Há uma barra de linha do tempo no topo desta tela, representando a vida da página. Quanto mais à esquerda você leva o controle deslizante, mais antigas são as revisões da página.
• O WordPress destaca as mudanças que foram feitas, comparando a postagem mais recente a uma postagem que você escolheu na linha do tempo.
• Para recuperar a versão mais recente, mova o controle deslizante totalmente para a direita.

Editando permalinks no WordPress

Permalinks - também conhecidos como slugs - criam a URL da página da web no WordPress. Os links para a página podem ser corrompidos quando você edita um link permanente, portanto , edite com cuidado .

Se você for alterar e editar permalinks, recomendo usar um plugin de redirecionamento como o Redirection.

Uma dica rápida: se você cometeu um erro e alterou um link permanente, mas não consegue se lembrar do URL original - pesquise a página usando a pesquisa do Google. Adicione o nome da empresa à pesquisa e provavelmente encontrará o URL original listado. Altere o permalink de volta ao nome original.

Palavra final

Espero que tenham gostado do post. O WordPress pode ser frustrante se você não entender com o que está trabalhando. Tenho certeza de que essas instruções irão ajudá-lo com o restante dos tutoriais do WordPress em meu blog.