Firebug encontrando os codigos do seu template
Este blog recebe em média 40 comentários/dia e 90% deles são perguntas ou relatos de dificuldades em localizar um determinado código no template. Alguns desejam fazer modificações mas não percebem exatamente onde devem alterar o código. Por exemplo, alguém me pergunta como retirar um menu ou os paineis do template Clean, mas não sabe que trecho do código corresponde à eles. Para detectar qualquer código da sua (e de outras) páginas, recomendo o Firebug, um complemento do Firefox que eu uso inclusive para converter temas do Wordpress para o Blogger. Após ter instalado o Firebug, acesse a página onde se encontra o código que deseja modificar (se for em seu próprio blog, acesse a página principal e não a página de visualização), clique em Ferramanetas - Firebug - Inspecionar Elemento, como na imagem abaixo:
Veja que uma janela se abriu na parte inferior da tela: do lado direito você verá o código CSS (o que dá estilo à página) e do lado esquerdo o código HTML. Para localizar o código correspondente à um determinado elemento na página, basta colocar o mouse sobre ele (sobre o slide do template Clean, por exemplo) e será mostrado os dois códigos correspondentes:
clique para ampliar e ver os detalhes
Veja na imagem que à esquerda já aparece em destaque o inicio do código HTML que corresponde ao slide e à direita o CSS. Você pode localizar qualquer detalhe: código de cor, fonte, largura de uma div, etc, bastando apontar o cursor sobre o elemento.Esta é uma excelente maneira de conhecer os códigos e entender melhor a estrutura do seu template.
Fica a dica.
25 comentários:
olá
Localizar un código también funciona Ctrl + F
Ótima dica Ariane!
Cada vez que "te visito" gosto mais do seu blog.
Como dizem aqui no Japão: arigato!
Ótima dica..muito boa mesmo
Obrigado ;)
Adorei seu blog, descobri por um link no blog do Helio Jenné. Quero ler com calma, porque meu negocio é escrever e mal tenho tido tempo pra isso. Mas gosto de uma coisa mais bonitinha e arrumadinha, vai ler legal brincar um pouco mais com as possibilidades e sair do que só está available no Blogger. Voltarei mais vezes com certeza. Um abraco.
Bonzu, o Ctrl+F só serve se vc já sabe o q está procurando, caso contrário, é o Firebug q te dá o nome da DIV ou class vc procura.
Olá Ariane, vc tem previsão de quando vai postar aquele post (outrora prometido) de: como transformar wordpress em blogspot?
Abração
Uso e recomendo também.
Apenas uma sugestão para outro plugin: Web Developer
https://addons.mozilla.org/pt-PT/firefox/addon/60
Podemos modificar o CSS etc de um site/blogue e ver o resultado em tempo real
O claro, ctrl + f cuando ya se sabe lo que está procurando, muy interesnate,
Hola Ariane, me gustan tus diceños de plantillas
Ótima dica, Ariane ^^
Bom, preciso de uma ajudinha sua: instalei um novo layout no meu blog e gostei muito do resultado (dá uma olhadinha, adoraria sua opinião também).
MAS, estou com um problema: onde está escrito "undefined", logo no canto esquerdo das postagens, deveria estar a data da postagem.
Porque isso está ocorrendo?
Grata desde já!
Grande beijo! ;*
Anne
http://annetakashi.blogspot.com
Olá Ariane!
Gostei da dica! já baixei a extensão para o Firefox e estou me acostumando ao poucos com o firebug.
Oi !
gostaria de te fazer um desafio!
desafio a vc tentar axar algum sistema de login compativel com o blogger?
c vc conseguir isso , namoral, vc e a melhor!
Mto obrigado pela dica, seu blog já está nos meus favoritos.
Ariane, por tanta ajuda que recebi do seu blog, estou te contemplando com o premio dardos, é só passar no Hippies & Beatniks e pegar. Grande abraço e boa sorte na casa nova.
Muito obrigado Ariane, era o que eu precisava :-D
maternajapão,Marciano, obrigada!
Vicky, seja bem-vinda e volte sempre! abraços
Wil, na verdade é usando o Firebug...olho o código e vou 'transplantando'. é tão intuitivo que não sei se vai virar mesmo post.
Ricardo, este é sensacional, vou fazer um post sobre ele também.
Anne, não achei seu blog :-(
rafael, vai gostar, com certeza. abraços
!!! não, obrigada :-)
filmespravc, eu é que agradeço
Augusto, agradeço imenso a sua gentileza.
Metal, de nada! Espero que te ajude muito.
Como transforma WordPress em Blogger?
Como programador eu uso (e recomendo!) o firebug. Com ele é fácil acessar qualquer elemento html do blog, identificar sua id ou class. Também é possível editar no próprio firebug as css e testar os resultados em tempo real...
Parabéns pelo excelente trabalho, Ariane!
Olá Ariane, tudo bem com você ?
O meu assuto não tem a ver com essa postagem, mas eu queria que você e ajudasse a "concertar" o eu blog.
Eu baixei um template e instalei certinho, mas quando eu fui colocar uma image no menu ficou muito estranho, e os links da HEADER quase ficam ocultos porque estão da mesma cor da página, procurei no HTML e não consegui mudar. Você pode me ajudar???
O link do meu blog é:
http://pegadownloadings.blogspot.com
O e-mail é:
pegadownloadings2008@hotmail.com ou
jefersonlima206@yahoo.com
Por favor, me ajude, já tentei de tudo...
Até então não havia descoberto funcionalidade para o Firebug, mas gostei da explicação, e agora vou adotar pra procurar erros no template.
;)
Olá, adorei este blog (site)!!! Muito bom! Estou com dificuldades em mexer com o html (ou será "xml"?) do blogspot...
Sempre trabalhei no blogger.com.br e lá não dá problemas!
Parabéns pelo seu trabalho!
Laura Jardim
ola fiz uma modificação no meu blog com uma dica que peguei aqui e não me lembro qual era e depois descobri que agora, ou seja , depois da modificação, na proxima pagina ou pagina anterior so aparece os titulos e não as postagens, como faço para desfazer esta modificaçõ, pois muitas outras eu ja fiz depois e não lebro qual que causou isto.
se puderes me passar uma dica,
obrigado.
moisesalba@gmail.com
http://moisesalba.blogspot.com
Ual, realmente muito útil. Esse blog foi uma benção que caiu do céu. Quem sabe um dia eu não faça templates tão bonitos quanto esses do TNB
Ari... Muito obrigado por tudo. Meu blog tá ficando bom demais graças a tua ajuda. Acredito que esse Firedebug vai desmontar todas as minhas dúvidas. Não sou japonês e não estou no japão, mas... Arigato! ^^
Te adoro,
Leo
Olá, gostaria de saber como inserir este sistema de comentarios igual este do seu blog. Muito Obrigado!
Muito bom... muito fácil Obrigado !
Postar um comentário
Os comentários são moderados.