Hoje vou ensinar a vocês como criar uma caixa com código HTML no próprio post do blog.
1 – O primeiro passo é acessar o código-fonte do seu blog no painel de controles (Modelo -> HTML).
Busque (control+F) pela linha:
]]></b:skin>
2 – Cole na linha acima o código:
code{background: #eee;border:1px solid #eee; color:#000;font-size:100%;font-face: verdana;font-height: 130%;height: auto;display:block;white-space:pre;word-wrap:break-word;padding:0 10px 5px 20px;}3 – Salve o modelo.
O código ficará dessa maneira
4 – Você pode fazer algumas alterações, como:
Background – Alterar a cor do fundo. Para utilizar uma imagem de fundo, como eu, usar: background: url(endereço da imagem)
Border – Alterar largura da borda, tipo (solid, dashed. dotted) e a cor.
Color – Alterar a cor da fonte
Font-Face – Fonte utilizada
5 – Ao escrever um post, deve-se colocar o código desejado entre as tags <code> e </code> no modo de publicação HTML. Assim, todo conteúdo que estiver entre essas tags ficarão na configuração criada.
6 – Visualize o post antes de publicar, para certificar-se de que ficou da forma como você deseja.
Atenção: Você só precisará fazer o passo 5 toda vez que for publicar algum código no post, não necessitando mais alterar o HTML do seu blog.
Qualquer dúvida basta colocar nos comentários que eu tentarei explicar.
