Firebug encontrando os codigos do seu template

Postador por Tiago Damasceno

As 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.