Firebug encontrando os codigos do seu template

Recebemos em média 40 comentários por 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 painéis 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:

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.

Via: Redação - Foto: Divulgação