Alguns blogueiros permitem que outras pessoas façam postagens e assim tem um blog compartilhado, mas além de mostrar o nome de quem fez a postagem também é possível mostrar uma imagem diferente para cada pessoa (perfil) que faz postagens no seu blog.

Mas antes de continuar queremos lembrar mais uma vez que não é necessário dar direitos de administrador para alguém poder postar no seu blog, somente um convite para participar do blog já é o suficiente.
Voltando ao assunto de hoje: colocar uma imagem junto com o nome do autor de cada postagem. O procedimento é relativamente simples: o primeiro passo é ter a imagem que vai mostrar, caso precise de ajuda para fazer e hospedar a imagem veja esses links:

Quando já tiver a imagem pronta e hospedada entre na pagina editar HTML do seu blog e clique para expandir o modelo. Nós recomendamos salvar uma cópia do seu template antes de fazer qualquer alteração, assim se tiver problemas poderá restaurar seu blog facilmente

Procure por: <div class='post-footer'>, talvez no seu template não seja exatamente igual, mas deve ser bem parecido com isso e logo depois dele coloque esse código:

<b:if cond='data:post.author == &quot;AUTOR1&quot;'>
<img src='ENDEREÇO-DA-IMAGEM-AUTOR1' style='float:left;border:0px;'/>
</b:if>
<b:if cond='data:post.author == &quot;AUTOR2&quot;'>
<img src='ENDEREÇO-DA-IMAGEM-AUTOR2' style='float:left;border:0px;'/>
</b:if>

Usamos como exemplo 2 autores para o blog, mas você repetirá esse código para quantos autores seu blog tiver.

Muito cuidado na hora de alterar o nome do autor, onde colocamos autor1, autor2, pois deve ser exatamente igual está no perfil da pessoa. Quando testamos o código para fazer este tutorial o código não funcionou se usamos letras minúsculas, pois meu perfil está com a inicial maiúscula, ou seja, quando usei no código Fabiano Roberto, deu tudo certo, mas se colocar fabiano roberto o código não funcionou (imagem não apareceu).

No código você pode alterar o lado que a imagem aparece trocando a palavra left por right.

Se quiser usar a imagem com link, então no lugar de: <img src='ENDEREÇO-DA-IMAGEM-AUTOR2' style='float:left;border:0px;'/>

Use o código desta forma:
<a href="link da pagina"><img src='ENDEREÇO-DA-IMAGEM-AUTOR2' style='float:left;border:0px;'/></a>

Esperamos que gostem e seja útil para quem divide o blog com outras pessoas.
Se der certo comenta! 

0 Comentários