Na blogosfera é bem comum a troca de banners entre blogs, principalmente entre blogs que estão começando ou blogs de humor. A troca de banners foi um meio que os autores encontraram para conseguir mais visitas para seus blogs, e é isso o que eu vou mostrar no artigo de hoje, como adicionar uma caixinha com o seu banner - também conhecida como: “caixinha link-me” - na sidebar (barra lateral) do blog, para que as pessoas que tenham interesse possam divulgar seu blog!
Antes de mais nada você precisa ter o seu banner - óbvio. Que eu saiba, o tamanho padrão de um banner de parceria é 120x60 pixels, mas o tamanho pode variar caso o blog que vá divulgar o seu banner, tenha um layout personalizado ou preferência por um tamanho específico. Agora vamos ao tutorial.
1. Faça login no Blogger e acesse o painel de controle do seu blog, depois vá no menu Layout > Adicionar um Gadget > HTML/JavaScript.
2. Adicione o código mostrado abaixo dentro do campo de conteúdo do gadget.
Antes de mais nada você precisa ter o seu banner - óbvio. Que eu saiba, o tamanho padrão de um banner de parceria é 120x60 pixels, mas o tamanho pode variar caso o blog que vá divulgar o seu banner, tenha um layout personalizado ou preferência por um tamanho específico. Agora vamos ao tutorial.
1. Faça login no Blogger e acesse o painel de controle do seu blog, depois vá no menu Layout > Adicionar um Gadget > HTML/JavaScript.
 |
| Gadget HTML/JavaScript |
2. Adicione o código mostrado abaixo dentro do campo de conteúdo do gadget.
<div align="center">
<img src="link-da-imagem" border="0" alt=""/>
<br />(120x60)<br/>
<textarea cols="20" rows="3" onfocus="this.select()" onmouseover="this.focus()">
<a href="link-do-seu-blog" target="_blank" title="nome-do-seu-blog"><img src="link-da-imagem" border="0" alt="nome-do-seu-blog"/></a>
</textarea>
</div>3. Altere somente as partes que foram destacas, de acordo com o que é pedido. Veja as explicações abaixo:
4. Clique no botão Salvar e vá no seu blog para ver se o banner está aparecendo corretamente.
Informação: você pode adicionar o código em qualquer lugar que aceite HTML, como por exemplo, artigos, páginas estáticas e até mesmo direto no template, não precisa ser necessariamente dentro do gadget HTML/JavaScript.
Abaixo, você pode conferir um exemplo de como ficará o banner após instalado no blog.
Repare que ao passar o mouse por cima da caixa do código, o texto é selecionado automaticamente, isso serve para facilitar a cópia do mesmo, evitando que a pessoa que irá divulgar seu banner, precise selecionar o código. Então, ela só terá que clicar com o botão direito do mouse sobre o código e escolher a opção “Copiar”.
- link-da-imagem: link da imagem do seu banner;
- link-do-seu-blog: endereço (URL) do seu blog;
- nome-do-seu-blog: nome do blog, não o endereço.
 |
| Ilustração das tags “cols” e “rows” |
4. Clique no botão Salvar e vá no seu blog para ver se o banner está aparecendo corretamente.
Abaixo, você pode conferir um exemplo de como ficará o banner após instalado no blog.
Repare que ao passar o mouse por cima da caixa do código, o texto é selecionado automaticamente, isso serve para facilitar a cópia do mesmo, evitando que a pessoa que irá divulgar seu banner, precise selecionar o código. Então, ela só terá que clicar com o botão direito do mouse sobre o código e escolher a opção “Copiar”.
Nenhum comentário:
Postar um comentário