Como colocar imagens com links no blog

Recebi outro dia um comentário perguntando como colocar uma imagem como a que tenho divulgando minha conta no Twitter na sidebar do blog. Na verdade todo o trabalho é feito por um código html, basta copiar o código abaixo e substituir onde está seu link aqui pelo endereço que quer que seja aberto quando for clicado na imagem e endereço da imagem aqui pelo endereço da imagem que deseja que apareça.

<a href=”seu link aqui” target=”_blank”><img src=”endereço da imagem aqui”/></a>

Após substituir o texto pelo seus links basta copiar o código e acessar a área de administração de seu blog na plataforma Blogger / Blogspot, em Layout selecione adicionar um Gadget, escolha html/javascript e cole o código. Salve e visualize como ficou.

Atualização

A Dreamer Girl sugeriu um outra maneira de colocar as imagens nos blogs desenvolvidos na plataforma Blogger / Blogspot, veja como:
Há um jeito mais fácil, pelo menos eu acho.
Selecionar: adicionar gadget, e então, clicar numa das opções que esteja escrito “imagem”. Tem título, legenda e, debaixo, link direcionado. Em vez de ficar copiando códigos, eu faço isso. Mas não sei se a pergunta foi isso, e nem sei de era esse o resultado.

Rate this post

Quer aprender a ganhar dinheiro com Google Adsense em blogs?

Gustavo Freitas

Problogger e empreendedor digital. Criador do Método Start, que ele utiliza para criar blogs de sucesso e ganhar dinheiro na internet.

Website: http://querocriarumblog.com.br/

25 Comentários

  1. simeia

    Caraca, procurei pra caramba como fazer isso e só achei no seu blog essa forma simples, nos outros sempre eram um bicho de sete cabeças. Valeu demais pelas dicas, essa da imagem no próprio blogger eu não sabia, valeu mesmo.

  2. Marcos

    Gustavo, tenho um blog onde o meu template mostra cinco imagens em modo slides na página inicial a minha dúvida é, como fazer para que o leitor ao clicar em cima de uma das imagens fosse direcionado exatamente para o assunto a que diz respeito para esta mesma imagem, como nos portais de noticias quando clicamos em alguma imagem e nos remete ao assunto em questão, se puder dar uma olhada no blog é www,tecnohardwareinfo.blogspot.com

    • Você precisará procurar no código html de seu tema o local para colocar as urls corretas.

  3. Web Rádio

    só que meu blog aceitava esses CÒdigos HTML
    mais depois de um tempo não estou conseguindo colocar-lo mais no meu blog,ja tentei outras imagens e nada…quem poder me ajudar agradeço.
    msn-helton_dantass@hotmail.com
    blog-webradioangra.blogspot.com

  4. Gustavo Freitas

    Nino,
    não sei se entendi bem, mas o que você quer está descrito nesse artigo,
    abraço.

  5. NINO SOLEY

    tenho um site de capas e labels para colecionadores, quero saber como faço para colocar imagens na internet que qdo alguem clicar nela va direto para o meu blog, aguardo resposta
    obrigado
    nao sei si pode inserir email aqui
    mas o meu é heberrodrigosuave@hotmail.com
    si nao puder mi perdoem, e me chamem a atençaõ para que isto nao venha a ocorrer de novo
    ate mais

  6. Gustavo Freitas

    Marcos,
    obrigado pelo comentário,
    abraço.

  7. Marcos

    Obrigado pelo código para colocar imagens com links!
    Um abraço!

  8. Gustavo Freitas

    Você pode fazer de duas maneiras, a primeira é utilizar um editor de imagens para diminuir o tamanho da imagem para que ela fique dentro do espaço reservado na sidebar, recomendo essa.
    a segunda é você colocar logo após o código src="endereço da imagem aqui" duas variáveis para controlar o tamanho da imagem width (largura) e height (altura.
    abraços.

  9. Coletiva-mente

    gostaria de saber como inserir uma imagem num gadget da barra lateral com link para uma página com a imagem ampliada. Eu usei os códigos, mas a imagem passa do tamanho do widget e fica entrando na coluna central do meu blog. Não tem como fazer a imagem encaixar direitinho no widget?

    valew Abraço

  10. Gustavo Freitas

    Gilson,
    obrigado pelo comentário, é sempre muito bom ter o feedback de nossos leitores,
    abraço.

  11. Gilson de Jesus

    Gustavo!
    Primeiro quero dizer que raramente eu comento blog, apesar de sempre recorrer para dar um help..^^

    Fiz questão aqui, pois uma coisa tão simples (eu até tinha idéia pois mexo um pouquinho em html) que eh mandar imagem por e-mail com link e eu estava apanhando para usar no hotmail… Depois achei o botãozinho..kk. Achei um monte de asneiras na net…aff
    Você foi claro e objetivo!
    Parabéns e obrigado.
    Já não vou mais ter problema com newsletter.

  12. edilene - amor

    gostei de saber!
    PARABENS!

  13. Gustavo Freitas

    Klessa,
    que bom que foi útil. quanto a partilhar o conhecimento, é dessa maneira que crescemos,
    um grande abraço.

  14. klessa

    Olá,
    Estava a muito á procura de um artigo"Como inserir link numa imagem" e já estava sem esperanças, pois todas as respostas que achava não era bem o que procurava, mas finalmente encontrei seu blog"salvador da pátria". Gostei muito dos posts, acho muito bom encontrar alguém tão cheio de conhecimentos disposto á ajudar quem não entende muito do assunto.
    klessa's Brechó & Cia

  15. Laurentino Mello

    @Liana Variedades: Ficamos muito contentes em saber que estamos ajudando.

    Grande abraço, boa sorte e sucesso com seu projeto!

  16. Liana Variedades

    Gostei muito dos posts.Achei-os mais simples pra quem está começando,assim como eu.Já adicionei seu Blog aos favoritos e é claro serei seguidora.Dá uma espiadinha lá no meu Blog.tem muita coisa pra organizar ainda,mas aos poucos eu chego lá.Obrigada pelas dicas.

  17. Laurentino Mello

    @juliana: Aonde precisamente você deseja inserir essas imagens no blog e qual o link dele?

  18. Jenny

    Então, essa parte aí eu entendi, mas e na hora de colocar aquela caixinha onde a pessoa pode copiar o endereco do banner pra postar no blog dele, no caso o "link us" eu não sei como fazer 🙁

  19. Ondulação

    me ajudem no meu blog

  20. Gustavo Freitas

    @Dreamer Girl,
    obrigado por acrescentar ao artigo, com certeza as duas maneiras são válidas e de agora em diante o leitor pode escolher a que melhor se encaixe em seu blog,
    um grande abraço.

  21. Dreamer Girl

    Há um jeito mais fácil, pelo o menos eu acho.
    Selecionar: adicionar gadget, e então, clicar numa das opções que esteja escrito “imagem”. Tem título, legenda e, debaixo, link direcionado. Em vez de ficar copiando códigos, eu faço isso. Mas não sei se a pergunta foi isso, e nem sei de era esse o resultado.
    De qualquer forma,
    esse blog que nos ajuda a criar os nossos próprios
    É DEMAIS!! Gostei muito, mas foi só essa informação que eu gostaria de ver se estou certa.
    Obrigada pela atenção!!
    Scarlet 9Dreamer Girl é só apelido -óbvio!)

    • Deh

      O seu jeito é bem mais fácil pra mim, ajudou muito .. Obrigada 😀

Deixe uma resposta