Criar About Me Widget da barra lateral com o editor de postagem [tutorial do WordPress]
Grandes blogs fazem excelente uso das páginas "Sobre mim". Para levar os usuários até lá, 99% do tempo eles incluem uma breve e intrigante "Seção Sobre mim" na barra lateral do seu blog. Neste post eu vou te mostrar como criar essa seção. É tão fácil quanto escrever um novo post. Na verdade, usaremos o novo editor de postagem no WordPress para criar esse.
O editor de posts é uma das ferramentas mais versáteis do WordPress, e quase ninguém sabe disso. O que estou prestes a mostrar a vocês é um pequeno hack de design inteligente, um truque tão esquecido que nem foi abordado na lista de 40 WordPress Hacks do Hongkiat.com..
Esse truque também é ótimo para aprender HTML e CSS básicos, se você está apenas começando.
Crie sua mensagem
Tudo o que você precisa para este tutorial é sua página "Sobre mim", uma foto sua e de algum texto. Sua página "Sobre mim" deve se concentrar em suas realizações em blogs, envolver o leitor com algumas perguntas e incluir fotos de seu blog. Já tem esta página feita? Perfeito.
Agora, vamos levar tudo isso para o WordPress novo post editor. Abra e envie sua imagem. Nós estaremos fazendo muito disso a partir do Guia HTML. Quando você faz o upload de uma imagem, o WordPress gera automaticamente o código HTML para ela. Vá para a guia HTML e crie um espaço (pressione enter) acima da sua imagem. Então, escreva uma pequena mensagem aqui, algo como "Quem está por trás deste site?" ou apenas "Sobre mim". Seja criativo.
Adicione uma descrição curta de 3-4 frases para intrigar o leitor. No final deste bloco de texto, escreva uma frase como "Saiba mais aqui" e crie um link para sua página Sobre.
Estilize sua mensagem
Agora vá o Guia Visual. Centralize seu texto. Quando você voltar ao HTML, você notará que o WordPress escreveu algum código para você, na forma de um "estilo p". Essa é a beleza de criar widgets no novo editor de postagem; Códigos de autowrite WordPress para você! Você apenas adiciona alguns CSS básicos!
Crie algo assim:
SUA MENSAGEM
Certifique-se de fechar o estilo p com um
E adicione qualquer outro CSS que você possa pensar ou precisar. Não sabe CSS? Basta pesquisar no Google "código CSS para ____" e no espaço em branco colocar o que você está tentando fazer. Em seguida, copie e cole o estilo p. Coloque-o em volta da sua mensagem de bloco de texto abaixo da imagem. Estilize o que quiser e feche-o. Se você esquecer de fechar um estilo p, não é grande coisa. O estilo será aplicado a mais texto que você quiser, mas todos cometem esse erro pelo menos uma vez.
Use códigos para colocar em itálico e para negrito seu texto, e lembre-se de fechar aqueles também.
Acabamos de criar, por enquanto, e é hora de começar a diversão.
Coloque seu trabalho na barra lateral
Na guia HTML, copie e cole tudo que você criou. Vou ao Aparência, guia Widgets, e arraste um Widget de texto em branco na sua barra lateral. Cole o seu código. Em seguida, pressione Salvar e clique na página inicial do seu blog. Como se parece?
Você quase certamente vai querer fazer algumas modificações aqui. A imagem pode estar fora de tamanho ou as fontes podem não aparecer como você imaginou, mas não se preocupe, você pode editar tudo isso diretamente no widget Texto ou, melhor ainda, no novo editor de postagem, onde é possível visualizar as alterações mais facilmente.
Fun Styling Features e outras adições
CSS é realmente um jogo divertido. Aqui estão algumas maneiras de fazer essa seção Sobre mim realmente pop.
- Use cores exóticas.
- Use uma borda pontilhada ou colorida.
- Coloque um formulário "Opt In" logo abaixo do seu texto. Eu uso Aweber para estes.
- Adicione links para lugares em que seu trabalho foi destacado.
- Jogue uma piada ou seja misterioso.
Vídeo tutorial
Você também pode assistir ao tutorial em vídeo desta postagem abaixo ou no YouTube.
Qual é o próximo?
Agora que você tem uma seção básica Sobre mim e Sobre mim, vá até outros blogs para ver quais estratégias e designs funcionam para eles. Tome algumas notas. Então, faça mais pesquisas sobre seus próprios leitores.
Adapte seu About Me exatamente ao que seus leitores querem, e você eventualmente começará a ver mais leitores, comentadores e assinantes fiéis. Coloque-se na barra lateral e vale a pena no final.
Nota do editor: Este post foi escrito por Greg Narayan para Hongkiat.com. Greg é um cara de 25 anos de Nova York que responde a cerca de 150 perguntas de blogs antes do café da manhã.
