Tutorial: Como criar um Banner.

  Muita gente que começou com o Blogger a pouco tempo, não sabe como criar um banner sozinho, sem nenhum criador online como FlashVortex, MyBannerMaker etc. Nesse Tutorial não vou ensinar como criar um Banner literalmente, e sim como hospedá-lo, e adicionar link e outras coisas à ele. Será bem simples.

1º Passo.

Crie um imagem jpg, png, ou gif (animada) pelo seu editor de imagens (recomendo o Photoshop e outros do tipo). Aqui usarei uma bem feia, só para demontar como seria.

2º Passo.

Agora temos que hospedar essa imagem em algum site da net.

Recomendo :

Imgur

ImageShack

TinyPic

Entre Outros.

  Depois de ter hospedado sua imagem copie tal codigo(usarei o Imgur, pois é o que eu mais gosto):




O codigo que deve ser copiado é o que está grifado na imagem. clique.

 

3º Passo:  Abra o bloco de notas e nele cole este código :

<a href="Link a ser direcionado, no caso seu blog.">Código que você copiou do site de hospedagem </a>



 Depois de colar, substitua o Link a ser direcionado, no caso seu blog. pelo o link do seu blog (incluindo http:// e a barra final)(deixe entre aspas(" "))

E tambem substitua o Código que você copiou do site de hospedagem  pelo codigo que você copiou daonde você hospedou a imagem.

No meu caso ficou assim :

<a href="http://kakerukonoe.blogspot.com/"><img src="http://i.imgur.com/QvNBe.jpg" alt="" title="Hosted by imgur.com" /></a>

Ficou assim (<--)

Ta, agora copie e cole o codigo html que você produziu no bloco de notas.Agora vamos aprender a criar o caixa de texto para outras pessoas poderem copiar.É bem simples. Copie esse código e cole em baixo de onde ficará seu banner (No gadjet Html/JavaScript do blogger )

Código : <textarea rows="5" cols="50" style="background-color: #ffffff">Cole aqui o cod. HTML de seu banner.</textarea>

Beleza, agora é só trocar o Cole aqui o cod. HTML de seu banner pelo codigo html de seu banner que eu havia pedido para vocês colarem no bloco de notas.O tamanho pode ser alterado direto no gadjet do blogger (Html/JavaScript) clicando em Formato Rich Text no topo direto.La você pode clicar na sua imagem que aparecerá aquelas bolinhas nas extremidades para regular o tamanho.

Bom o meu ficou assim:

<a href="http://i.imgur.com/QvNBe.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img alt="" border="0" src="http://i.imgur.com/QvNBe.jpg" title="Hosted by imgur.com" /></a>

Então é isso espero que tenham curtido e desculpe a demora pra postar =D. Quem quiser divulgar dilvuga ai, mas poem o link do post em baixo. Falo " pru ses" espero ter ajudado, comentem ai!