Voce que visita ou segue já deve ter visto a tv sobrenatural para coloca-lo no seu blog a série sobrenatural é facil é só copiar este link e colar no widget html do seu blog!
Paginas
Nickelodeon tv
Meus outros blogues
Visitante número
Mostrando postagens com marcador Dicas para blog. Mostrar todas as postagens
Mostrando postagens com marcador Dicas para blog. Mostrar todas as postagens
terça-feira, 15 de junho de 2010
Como criar uma caixinha de link-me?
Hoje vamos aprender a criar uma caixinha "Link-me". Já falamos por aqui sobre o que é um banner, mas antes de mais nada, para ser sincero eu nem me lembro mais onde aprendi a fazer essa caixinha, uma vez que comecei a ver isso com HTML e JavaScript antes mesmo de pensar em criar o meu primeiro blog. Mas de qualquer forma, dei uma pesquisada e não encontrei em nenhum blog uma explicação muito detalhada, então vamos lá!
Para começar, vamos entender que a caixinha Link-me nada mais é que um elemento textarea com um código dentro. O código por sua vez serve para fazer aparecer a imagem do banner ao mesmo tempo em que linka essa imagem ao blog.
Para quem não entende nada de html é importante saber que a tag <textarea> precisa ser fechada para evitar erros. Na prática é algo assim:
Criando Seu Banner
Antes de criar a sua caixinha você vai precisar de um banner pronto. Existem serviços on-line que oferecem a criação de banners grátis. Em uma pesquisa rápida encontrei pela rede:
Crie seu Banner online
Uma lista com serviços on-line escrita pelo Celso Lemes do Criar Sites.
Uma outra opção é fazer um banner com o logotipo do blog. Bastando utilizar um programa de edição de imagens para acertar o seu tamanho.
Um programa que recomendo e já escrevi um tutorial de como usá-lo para fazer montagens com fotos dos seus amigos aqui é o PhotoFiltre.
Enfim, como fazer o banner é você quem decide, o que vamos ver aqui é como criar a caixinha Link-me.
Hospede o banner em algum lugar, basta que você tenha cuidado porque a ideia é que essa imagem seja mostrada em vários e vários blogs (que vão linkar o seu blog né?). Então você não pode se dar ao luxo de hospedar essa imagem em um lugar qualquer.
Criando Sua Caixinha Link-me
Com a imagem hospedada e a url (endereço) dela em mãos, vamos ao código da caixinha Link-me:
Copie o código abaixo e cole na sua sidebar: (Codigo de terceiro a seu blog html diponivel adicionar um widget)
<br/><br/><textarea rows="3" cols="21" onfocus="this.select()" onmouseover="this.focus()"><a href="URLDOBLOG" target="_blank"><img border="0" src="URLDAIMAGEM"/></a></textarea>
<a href="URLDOBLOG" target="_blank" title="NOMEDOBLOG"><img border="0" alt="Banner" src="URLDAIMAGEM"/></a>
Faça as alterações necessárias:
URLDOBLOG – Substitua pela url (endereço) da página inicial do seu blog.
Exemplo: http://www.novonarede.com.br/blog
URLDAIMAGEM – Substitua pela url (endereço) da imagem que você hospedou.
NOMEDOBLOG – Substitua pelo nome do seu blog!
Exemplo: Novo na Rede
Onde está escrito Copie o código abaixo e cole na sua sidebar: você pode escrever o que quiser para a "chamada" da sua caixinha Link-me.
Dica: se você quiser centralizar a caixinha e o banner, basta adicionar o <center></center> ao código, assim:
<center>
Código da caixinha
</center>
Instalação
Blogger
Crie um campo HTML/JavaScript na sua sidebar (barra lateral) e adicione o código da sua caixinha Link-me!
WordPress.org ou WordPress.com
Vá em Appearance –> Widgets e adicione um campo Text a sua sidebar. Aí é só colar o código lá e salvar.
Entendendo o código
Tanto o onfocus="this.select()" e onmouseover="this.focus()" eu aprendi com JavaScript básico e eles são responsáveis pela seleção do código quando o mouse do leitor passa por cima do código e sai dele.
O rows="3" cols="21" se refere a altura e a largura da textarea, que é a área onde está o código aparente para o leitor (a caixinha propriamente dita). Se você quiser uma caixinha mais alta, mude o rows para 4, 5, 6… você que sabe. Se quiser mais larga mude o cols para 22, 23, 24… ou 20, 19, 18… se quiser mais estreita.
Dica: Lembre-se sempre de tomar muito cuidado na hora de alterar o código para não apagar nenhuma aspa, caso contrário o código não vai funcionar!
Boa sorte e aproveite a sua caixinha Link-me!
Faça bom uso!
Imagem: Konstantin Schneider
PS: Este é mais um tutorial do antigo Novo na Rede que foi atualizado e republicado.
Tags: Banner
Para começar, vamos entender que a caixinha Link-me nada mais é que um elemento textarea com um código dentro. O código por sua vez serve para fazer aparecer a imagem do banner ao mesmo tempo em que linka essa imagem ao blog.
Para quem não entende nada de html é importante saber que a tag <textarea> precisa ser fechada para evitar erros. Na prática é algo assim:
Criando Seu Banner
Antes de criar a sua caixinha você vai precisar de um banner pronto. Existem serviços on-line que oferecem a criação de banners grátis. Em uma pesquisa rápida encontrei pela rede:
Crie seu Banner online
Uma lista com serviços on-line escrita pelo Celso Lemes do Criar Sites.
Uma outra opção é fazer um banner com o logotipo do blog. Bastando utilizar um programa de edição de imagens para acertar o seu tamanho.
Um programa que recomendo e já escrevi um tutorial de como usá-lo para fazer montagens com fotos dos seus amigos aqui é o PhotoFiltre.
Enfim, como fazer o banner é você quem decide, o que vamos ver aqui é como criar a caixinha Link-me.
Hospede o banner em algum lugar, basta que você tenha cuidado porque a ideia é que essa imagem seja mostrada em vários e vários blogs (que vão linkar o seu blog né?). Então você não pode se dar ao luxo de hospedar essa imagem em um lugar qualquer.
Criando Sua Caixinha Link-me
Com a imagem hospedada e a url (endereço) dela em mãos, vamos ao código da caixinha Link-me:
Copie o código abaixo e cole na sua sidebar: (Codigo de terceiro a seu blog html diponivel adicionar um widget)
<br/><br/><textarea rows="3" cols="21" onfocus="this.select()" onmouseover="this.focus()"><a href="URLDOBLOG" target="_blank"><img border="0" src="URLDAIMAGEM"/></a></textarea>
<a href="URLDOBLOG" target="_blank" title="NOMEDOBLOG"><img border="0" alt="Banner" src="URLDAIMAGEM"/></a>
Faça as alterações necessárias:
URLDOBLOG – Substitua pela url (endereço) da página inicial do seu blog.
Exemplo: http://www.novonarede.com.br/blog
URLDAIMAGEM – Substitua pela url (endereço) da imagem que você hospedou.
NOMEDOBLOG – Substitua pelo nome do seu blog!
Exemplo: Novo na Rede
Onde está escrito Copie o código abaixo e cole na sua sidebar: você pode escrever o que quiser para a "chamada" da sua caixinha Link-me.
Dica: se você quiser centralizar a caixinha e o banner, basta adicionar o <center></center> ao código, assim:
<center>
Código da caixinha
</center>
Instalação
Blogger
Crie um campo HTML/JavaScript na sua sidebar (barra lateral) e adicione o código da sua caixinha Link-me!
WordPress.org ou WordPress.com
Vá em Appearance –> Widgets e adicione um campo Text a sua sidebar. Aí é só colar o código lá e salvar.
Entendendo o código
Tanto o onfocus="this.select()" e onmouseover="this.focus()" eu aprendi com JavaScript básico e eles são responsáveis pela seleção do código quando o mouse do leitor passa por cima do código e sai dele.
O rows="3" cols="21" se refere a altura e a largura da textarea, que é a área onde está o código aparente para o leitor (a caixinha propriamente dita). Se você quiser uma caixinha mais alta, mude o rows para 4, 5, 6… você que sabe. Se quiser mais larga mude o cols para 22, 23, 24… ou 20, 19, 18… se quiser mais estreita.
Dica: Lembre-se sempre de tomar muito cuidado na hora de alterar o código para não apagar nenhuma aspa, caso contrário o código não vai funcionar!
Boa sorte e aproveite a sua caixinha Link-me!
Faça bom uso!
Imagem: Konstantin Schneider
PS: Este é mais um tutorial do antigo Novo na Rede que foi atualizado e republicado.
Tags: Banner
Postado por
(b2)
Assinar:
Postagens (Atom)
Equipe Tkb.Net
Postadores:
1°b2
2°pf
3°**new**Chuck
Diretores: B2 e Pf
E-mail **new**: b2.com@hotmail.com (Favor ñ clicar)
Twitter **new**: @b2com www.twitter.com/b2com
Youtube**new** www.youtube.com/b2comn
Sites secundarios: http://www.lucassobretudo.blogspot.com/
Segurança: VSCyber 2.9
1°b2
2°pf
3°**new**Chuck
Diretores: B2 e Pf
E-mail **new**: b2.com@hotmail.com (Favor ñ clicar)
Twitter **new**: @b2com www.twitter.com/b2com
Youtube**new** www.youtube.com/b2comn
Sites secundarios: http://www.lucassobretudo.blogspot.com/
Segurança: VSCyber 2.9