Imagem não aparece no Blog ou Site

Existem muitos códigos para utilizar no blog que necessitam colocar a url(endereço) de uma imagem nele, como por exemplo, imagem de fundo, scripts, ou mesmo uma foto que deseja colocar no seu blog. E ai começa o problema muita gente diz o código não funciona, ou deu algum erro porque a imagem não apareceu, mas na verdade o defeito não está no código, mas muita gente pega a url errada da imagem, pois a maioria dos sites de hospedagem fornece vários códigos.

Sugerimos que use o ImageShack, normalmente a url que deve usar está em direct link ou algo parecido com isso.

Agora veja como testar se está usando o endereço correto de uma imagem dentro do código no seu blog, copie o endereço da imagem e coloque no navegador depois clique enter, deve aparecer somente a imagem, sem mais nada. Se quiser clique na imagem acima e veja como ela aparece sozinha numa pagina em branco.

Se por acaso aparecerem mais coisas na página então você precisa voltar no site onde hospedou a imagem e encontrar o endereço correto. Pois a imagem somente irá funcionar como fundo do blog se for o link direto para a imagem e não uma página que mostra a mesma. Fazer esse teste simple pode poupar muito trabalho procurando o erro no lugar errado na hora de fazer alterações do layout do seu blog.

Veja também:

Fazer fundo degrade
Imagem de fundo parada
Ocultar a barra padrão do blogspot
Apagar comentários
Números para loterias no seu blog

Postagens mais Comentadas Receba Dicas por E-mail Recomendações dos Leitores

Link desta Pagina

56Comentários:

Paulo Fernando disse...: Otima dica Fabiano .

Um bom exemplo tambem é usar o

http://picasaweb.google.com/

Site sem spam e funcional

Mais deve configurar e deixar os albuns puplicos ai todo mundo pode ver as imagens no Blog .

Abraço e Sucesso Sempre :); 3 de julho de 2009 09:33
Dê Lima disse...: ótima dica!

eu tive alguns problemas com isso no começo, mas logo percebi o porquê! (:; 3 de julho de 2009 10:30
»» El N!Ño «« [o_0] || Manuel Veloso disse...: oi... olha como é que você conseguiu fazer o menu com comunidades, fique por dentro, utilidades para blogs, perfil e fale conosco...

E como fez essa imagem como titulo, por favor peço-lhe que me responda...

Obrigado; 4 de julho de 2009 09:02
Fabiano Roberto disse...: o menu que abre mais opções tem aqui a explicação
http://www.dicasparablogs.com.br/2009/05/criar-um-menu-expansivel-no-blog.html

sobre o título deste blog, ele é feito num programa chamado flash, não tem como explicar melhor, só mesmo conhecendo o programa.; 4 de julho de 2009 09:36
planetadobem disse...: Fabiano
eu tive problemas com algumas imagens do meu blog que hospedei no imagshack (banner,imagem do feed e twitter entre outras), aparecia só um fundo preto com um texto que não tenho idéia do que dizia (tava tudo em inglês e eu não sei uma palavra), você sabe o que pode ter ocorrido pois outras imagens continuam aparecendo normalmente.
Obrigado
Cleisson; 12 de julho de 2009 03:44
Fabiano Roberto disse...: não me lembro do imageshack sumir com imagens, mas esses dias todos tiveram algum tipo de problema com as imagens hospedadas lá.

o jeito é hospedar a imagem novamente se ainda tiver a original no seu computador; 12 de julho de 2009 08:36
sheil.ap23 disse...: Oi, fiz o teste da imagem hospedada (imagemshack) ela aparece certinho só que no meu blog ela não aparece de jeito nenhum, estou tentando fazer colocar um link em uma imagem, eu vi varios tutoriais,mas nenhum que a imagem apareça, porque voces não fazem um tutorial desse, estou montando 2 blogs e coloquei em cadaum esses relogios link daqui e é isso que quero fazer me ajuda?; 1 de agosto de 2009 14:47
Fabiano Roberto disse...: sheil.ap23
veja aqui sobre hospedagem

http://www.dicasparablogs.com.br/2008/12/hospedagem-de-imagens.html

qual o endereço de imagem que você está usando?; 1 de agosto de 2009 15:05
Nossos olhares disse...: Olá amigo fiz como vc disse testei a imagem e na pagina so apareceu ela ate esse ponto deu certo mas quando coloquei no blog a caixinha link-me apareceu com o codigo mas a imagem não no lugar da imagem apareceu um quadrado com um X no meio, como faço para aparecer a caixinha link-me com o codigo e meu banner ao lado< será q é pq digitei o endereço com HTTP:// ?
Vou deixar ela no meu blog msm com erro para depois arrumar se quiser passa la e veja como é o erro, aguardo resposta, abraço; 18 de outubro de 2009 04:42
Nossos olhares disse...: Amigo mais uma coisa quando peguei a imagem pra clicar sem a caixinha link-me deu certo com a caixinha a imagem não apareceu.; 18 de outubro de 2009 04:43
Fabiano Roberto disse...: Nossos olhares
precisa usar o http, mas deve ter algo errado no código, use nosso gerador de códigos
http://www.dicasparablogs.com.br/2007/04/gerador-de-cdigo.html; 18 de outubro de 2009 17:37
Nossos olhares disse...: Valeu amigo obrigado pela dica faltou so uma letra msm q não copiei junto agora deu certo; 19 de outubro de 2009 00:45
rafinhachapaquente@hotmail.com disse...: eu estou tentando colocar um album no blog com link para image shark por exemplo clicar sobre uma imagem no blog que abre um album correspondente me ajudem por favor enviar e=mail para rafinhachapaquente@hotmail.com; 3 de dezembro de 2009 14:29
Fabiano Roberto disse...: precisa criar o album no imageshack e depois copiar o link para colocar na imagem no seu blog; 3 de dezembro de 2009 14:37
Rabay Downloads disse...: Fala aê Fabiano blz

to com um problemão.
A imagem que uso para download no meu blog simplesmente sumiu! Não consigo encontra-la no html ela ainda aparece quando coloco o endereço de onde esta hospedada porem no meu blog não aparece.

Troquei o endereço de um post e apareceu, será que vou ter que trocar dos outros 1000 que tenho...
Me dá um help ai por favor!?
www.rabaydownloads.blogspot.com; 6 de dezembro de 2009 21:34
Rabay Downloads disse...: Detalhes, já xpandi o html e procurei pela imagem ... e nada!
Já to ficando com raiva!; 6 de dezembro de 2009 22:16
Fabiano Roberto disse...: Rabay Downloads

olhei seu site e infelizmente cada um dos links para download usam uma imagem diferente(url da imagem), ou seja vai ter que trocar o endereço da imagem em cada postagem que sumiu.; 7 de dezembro de 2009 00:02
Menina Veneno disse...: Oi, tudo bem? Vc pode me explicar como posso redimensionar minha foto? Eu a hospedei no imageshack e quando a coloco no blog ela fica enorme! bjos e obrigada!; 11 de junho de 2010 09:43
Fabiano Roberto disse...: Menina Veneno
é possivel mudar o tamanho da imagem com códigos, mas pode distorcer, assim:

<img src="endereço da iamgem" width="140" height="140" border="0" />

os valores que colocar no lugar de 140 será o tamanho dela, mas o jeito certo é usar um programa para editar a imagem e deixa-la no tamanho correto antes de hospedar.

Programas Gratuitos para Edição de Imagens; 11 de junho de 2010 19:05
Menina Veneno disse...: Então, isso que vc me falou, eu faço com os vídeos do youtube (aprendi aqui no blog tbm), mas não dá certo com minha foto, pois no código q vc fala pra gente usar não tem esse "width" e nem esse "height" (olha só: http://img243.imageshack.us/img243/9125/make2059cpia.jpg)... nem os demais links tem essas palavras. Verei se consigo mudar seguindo a sua sugestão de editar a imagem (tentar rsrs) antes de hospedá-la. Muito obrigada pela atenção e um ótimo final de semana!; 11 de junho de 2010 19:38
Fabiano Roberto disse...: se for colocar como um gadget use a opção html/javascript e cole esse código

<img src="http://img243.imageshack.us/img243/9125/make2059cpia.jpg" width="468" height="520" border="0" />; 11 de junho de 2010 20:02
Karine Winter disse...: FABIANO. SOU EXTREMAMENTE LEIGA NAS QUESTÕES RELACIONADAS A EDIÇÃO E CONFIGURAÇÃO DE BLOG. COM AS COISINHAS MAIS BÁSICAS ATÉ ME VIRO DIREITINHO. ESTOU ENFRENTANDO DOIS PROBLEMAS HÁ SEMANAS. JÁ PESQUISEI, VISITEI FORUNS, ETC E NÃO CONSIGO ENCONTRAR AJUDA PARA RESOLVÊ-LOS. 1º)AS FOTOS E IMAGENS QUE PUBLICO NOS POSTS NÃO ESTOU ABRINDO EM OUTRA PÁGINA, OU SEJA, EM TAMANHO MAIOR, QDO CLICO SOBRE ELAS. HÁ DIAS ATRÁS AS IMAGENS FICAVAM DESLOCADAS. COMO SE ESTIVESSEM FORA DA "MOLDURA" SE FOSSEM POSTADS EM TAMANHO MÉDIO. AGORA ESSE PROBLEMA CESSOU, MAS SE CLICO EM CIMA DELAS NÃO CONSIGO ABRI-LAS EM UMA JANELA EM TAMANHO MAIOR. 2º) AS IMAGENS QUE ESTÃO ADICIONADAS NOS GADGETS NO LADO DIREITO DO BLOG QDO CLICADAS NELAS AS MESMAS NÃO REDIRECIONAM PARA O ENDEREÇO LINKADO, NEM ABREM EM OUTRA JANELA.SERÁ QUE VC PODE ME AJUDAR? OS PROBLEMAS COMEÇARAM HÁ UNS 50 DIAS MAIS OU MENOS. ANTES TUDO FUNCIONAVA PERFEITAMENTE BEM.OBRIGADA POR SUA ATENÇÃO!KARINE
www.meumundinhomakeup.blogspot.com; 4 de julho de 2010 09:43
Oriflame disse...: Olá Fabiano!

O senhor é Mestre na arte de ensinar.
Explica tudo tão bem que eu que sou da pré consigo entender à primeira ... :)

Este artigo ensinou-me o que eu andava desesperada para conseguir fazer há algum tempo...

Obrigada!

Ana Maria Parreira (Lisboa); 4 de julho de 2010 11:21
Fabiano Roberto disse...: Karine Winter

para as imagens das postagens abrirem numa nova janela é preciso colocar target="_blank" no código delas na hora de postar, assim:
href="endereço da imagem" target="_blank"><img style=....

sobre as imagens no menu, se está enviando as imagens pelo gadget imagem não tem como alterar isso, só se postar suas imagens usando o gadget html/javascript, mas precisa saber montar os codigos e hospedar imagens; 4 de julho de 2010 13:25
Tiago disse...: EI eu tenho alguns códigos em meu blog que vc ensinou a faser gostei e colokei no site para quem visitar possam tbm tah com o msm efeito e coloquei os devidos creditos ao Dicas para Blogs veja lah o unico código ke estah lah

http://bbaaiixxaakkii.blogspot.com/2010/10/colocar-efeito-neve-no-blog.html

tah certo os creditos? manda ai a resposta pelos comentarios; 26 de outubro de 2010 10:45
Fabiano Roberto disse...: Tiago
você não pode publicar nosso tutorial inteiro, escreva uma descrição do que o código faz e coloque o link.; 26 de outubro de 2010 14:41
Tiago disse...: Tah Blz vlw pelo alerta ai; 26 de outubro de 2010 22:18
Cantora Barbara Pinheiro novo CD "Essencia de um Adorador" disse...: Oie!! Obrigadoooo, mais uma vez!
já estou com a minha caixa link-me rsrs
Deus continue te usando!!; 18 de janeiro de 2011 17:50
DENILSON disse...: Preciso de ajuda.
No editor de html a imagem aparece, porém qd envio para ftp ela nao aparece.
Resolvi hospedar a foto e mesmo assim nao aparece. Aparece um X e qd clico no X, a imagem abre.
O q devo fazer?
OBRIGADO.; 4 de fevereiro de 2011 23:29
Fabiano Roberto disse...: se apareceu o x é porque o endereço da imagem está errado; 5 de fevereiro de 2011 00:35
leonardo disse...: Ola, Fabiano então to usando imageshack a anos no meu blog, e agora do nada todas as imagens aparecem um sapo e uma mensagem em ingles para se registrar, fiz isso e mesmo assim continua com o erro .... pode me ajudar? no aguardo; 24 de fevereiro de 2011 20:59
Fabiano Roberto disse...: também notei o problema com o imageshack, tente hospedar suas imagens no google site(Hospedar Arquivos Grátis no Google Sites) ou no próprio blogger fazendo uma postagem ou pagina extra só com imagens; 25 de fevereiro de 2011 13:41
EBM disse...: fiz exatamente como descreveu mas mesmo assim nao obtiver exito sempre aparece a mensagem : " Este gadget tem erros e só poderá ser usado depois de corrigido. Saiba mais"

podem me ajudar?
grato; 1 de março de 2011 15:33
Fabiano Roberto disse...: acho que está colocando endereço da imagem em lugar errado..

você usou esse endereço da imagem na pagina adicionar gadget?

se for tem um gadget para imagens, não precisa colocar o endereço; 1 de março de 2011 15:58
EBM disse...: vou descrever como fiz:
entrei no site "imageshack" como vc diz no dicasparablogs e fiz upload da imagem q eu qria. copiei o cod. no "directlink".
entrei no meu blog, na opção "Design" e nesta tela tem uma opção "adicionar um gadget" cliquei nessa opção e abriu uma outra tela com varias opções de gadgets do google e mais abaixo tinha uma opção de "adicionar seu proprio gadget" cliquei nessa opção e em seguida apareceu uma outra tela com um campo em branco e um botao logo abaixo escrito "adicionar por URL" entao colei o directlink la e em seguida cliquei em add por url e recebi uma mensagem falando que "Este gadget tem erros e só poderá ser usado depois de corrigido. Saiba mais"
foi a unica maneira q eu achei q poderia ser feito, porem posso ter me enganado e gostaria de saber de vc pode me ajudar com mais claresa.

grato; 1 de março de 2011 17:04
Fabiano Roberto disse...: EBM
esse campo para criar seu proprio gadget não é para imagens. isso é para quem cria gadgets, programadores.

use o gadget de imagens e poderá enviar diretamente para o blogger.; 1 de março de 2011 17:45
EBM disse...: onde q fika essa opção de criar gadget de imagem ? nao o encontro pode me mostrar o caminho? grato; 1 de março de 2011 18:35
Fabiano Roberto disse...: quando você clica para adicionar um gadget aparece uma lista de opções: marcadores, html/javascript, lista de links e muitos outros entre eles tem um para enviar imagens; 2 de março de 2011 14:26
Luísa Neto disse...: Tentei colocar as imagens de miniaturas , mas o que apareceu foi simplesmente a frase em inglês e sem imagens. Como devo fazer?; 29 de março de 2011 14:34
Laura disse...: Eu estou tentando colocar uma imagem no lugar do nome do gadget. Primeiro ocorreu tuda bem, e fui seguindo o mesmo procedimento. mas quando cheguei do gadget "Seguidores" a imagem (Já hospedada no ImageShack) Não apareceu! Eu vi e revi o códi várias veses, mas não achei nada de errado. A imagem continua sem aparecer.; 29 de junho de 2011 11:31
Fabiano Roberto disse...: Laura
mas a imagem aparece no navegador como dissemos? somente a imagem sem mais nada?

faça o teste, se aparecer algo mais é porque o endereço da imagem está errado

copie esse link e cole no navegador:
http://1.bp.blogspot.com/_-v7nVhXnPEc/Sk3kOsKnKCI/AAAAAAAAAQo/5qj7odgYNsQ/s1600-h/hospedagem-imagens.jpg

a sua imagem deve aparecer deste jeito, sem mais nada na pagina; 29 de junho de 2011 16:22
Laura disse...: O que quero dizer é que não aconteceu nada. Todas as imagens nos nomes dos outros Gadgets (Promova, Pesquisa, Tradutor, etc...) Apareceram, mas a imagem no título de "Seguigores" não aparece! O nome continua lá, mas com a fonte normal, sem imagem. Olha:
http://garotas-ao-extremo.blogspot.com/; 30 de junho de 2011 09:55
Fabiano Roberto disse...: o gadget dos seguidores tem fundo proprio... é um iframe por isso não tem como alterar o fundo dele; 30 de junho de 2011 13:57
Matheus disse...: ei cara meu problema não é esse,ate aparece a imagem so que não aparece o link embaixo, só uma caixa branca vazia. o que que eu faço; 7 de julho de 2011 19:16
Fabiano Roberto disse...: caixa branca vazia?... onde? no site imageshack na hora de pegar o endereço da imagem? se for é porque precisa fazer um cadastro no site; 8 de julho de 2011 14:09
RodrigoNPessoa disse...: quero saber por que no meu blog só apareceu o banner sem o codigo, como eu fasso para ele aparecer meu blog é o micago.blogspot.com; 2 de novembro de 2011 19:45
Fabiano Roberto disse...: aqui tem um Gerador de Código - Caixinha link-me; 2 de novembro de 2011 22:18
Phablo Project disse...: Fabiano queria tirar umas imgens que não aparecem no meu blog!

Eu peguei esse template que uso em um site e veio cheio de erros! conseguir tirar alguns mas outros estão insuportáveis!

São imagens do tinypic! e elas só saem quando excluo os Gadgets! e toda vez que eu coloco novos Gadgets elas aparecem!!!!

Será que é alguma coisa de sidebar ou algo assim no html! http://phabloproject.blogspot.com/

ainda estou editando!

quero deixa meu blog bem elaborado com ferramentas mas esses Gadgets com essas imagens me dão raiva!; 4 de fevereiro de 2012 01:42
Fabiano Roberto disse...: talvez sejam imagem de fundo no html do blog

entre na pagina editar html e use o ctrl F para procurar por tinypic então achará as imagens.; 4 de fevereiro de 2012 16:09
Phablo Project disse...: funcionou!!!!!!! :); 4 de fevereiro de 2012 23:32
Phablo Project disse...: só tem outo mais dois problemas! não permanece o botão de compartilhamento no corpo Gadget dos posts e outro é uma caixa invisível com um link falso como se fosse uma imagem e eu não coloco imagem nenhuma! olha lá! e me diz que parte do html pra tirar ou sei lá! me ajude!

http://phabloproject.blogspot.com/; 4 de fevereiro de 2012 23:41
Fabiano Roberto disse...: para pegar o direct link precisa se cadastrar no site; 5 de fevereiro de 2012 12:34
Iran Pessoa disse...: OI BOA NOITE. SOU AUTOR DO BLOG MAN FOR MAN E SEXY CLUBE. QUERIA ADD O MEU BANNER NA MINHA PAGINA, CONSEGUI, ATE AI TUDO BEM.
FIZ DO JEITO QUE ENSINOU AQUI, POREM QUANDO CLICO NA IMAGEM NAO ACONTECE NADA.
O BANNER É ANIMADO, TA FUNCIONANDO DIREITINHO, POREM NÃO REDIRECIONA A LUGAR NENHUM.

O QUE HOUVE?

AGRADEÇO E AGUARDO SEU CONTATO.; 21 de novembro de 2012 21:24
Fabiano Roberto disse...: Iran Pessoa
veja aqui:
Como fazer um banner

mas se é um banner de divulgação é normal não acontecer nada ao clicar nele.

só tem o link no código da caixinha que as pessoas podem copiar para colocar seu banner no blog delas.; 22 de novembro de 2012 00:01
Ana Carolina disse...: Olá, sou inscrita no seu blog e vc esta de parabéns...Coloquei no meu blog: lyndadebonyta.blospot.com a caixinha de link me porem o local do endereço aparece totalmente em branco...Por favor me ajude!
Já lhe agradeço a atenção e atendimento,
carol; 15 de abril de 2013 11:09
Fabiano Roberto disse...: Anan esse problema aconteceu depois que o blogger alterou a pagina do editor de html, mas por enquanto não temos uma solução para o problema.; 15 de abril de 2013 11:14

Melhores Dicas para Blogs

Imagem não aparece no Blog ou Site

56Comentários:

Postar um comentário

Dicas e Tutoriais Úteis para Blogueiros