01/05/2012

Tutorial: Imagem ao lado dos títulos das postagens

||

Ohayoo bunnie's, hoje venho postar um dos tutoriais mais usados em sites, porém alem de conhecido é um dos mais queridos e fáceis de se fazer. Vou ensinar como colocar imagem ou gifs, ao lado (antes) do titulo das postagens. Realmente é muito fácil de se fazer, esse tutorial foi pedido por Flavinha Santos, espero que gostem. 
Aplicando no HTML

Vá em seu HTML e procure por:
<a expr:href='data:post.link'><data:post.title/></a><b:else/>

Assim que achar, ao lado de <b:else/> cole o código abaixo:
<img src='URL DA IMAGEM' style='vertical-align: middle;'/>


Aplicando Manualmente

Esse modo é legal pois em cada postagem você pode colocar uma imagem, porém se você é perfeccionista pode não se agradar ao trocar o layout e o modelo não combinar com as imagens, então eu indico o modo a cima. Nesse  modo é possível aplicar a imagem dentro da própria postagem, para isso copie o código abaixo e cole na área onde fica o titulo da postagem, seguindo do titulo desejado. 
<img src="LINK DA IMAGEM" alt="LEGENDA" height="ALTURA DA IMAGEM" width="LARGURA DA IMAGEM">

Um exemplo mais completo!

Texto do titulo <img style="vertical-align: middle;" height="25"  src="IMAGEM DO INICIO" /> - escrito por  (<img style='vertical-align: middle;'  height="25"  src="IMAGEM DO POSTADOR" />)

Agora é só colocar a url da imagem nos  lugares indicados, salvar e visualizar.  Gostou? Espero que sim! Qualquer dúvida deixe um comentário, ate a próxima!

Nenhum comentário:

Postar um comentário

Hi guys!!!!
Hey aqui é Wendy, blogueira desde 2010! Viciada em animes, amante de livros e adora ver séries! Criei esse cantinho na intenção de ajudar na criação e personalização de blogs e sites.
Wattpad Facebook Tumblr Instagram