SyntaxHighlighter 3 para Blogger

Olá Blogueiros, já devem ter reparado que recentemente alterei o layout das minhas caixas de texto nos artigos. Hoje trago para vocês isso mesmo, a nova versão do SyntaxHighlighter para Blogger. Para quem não sabe o SyntaxHighlighter é um género de caixa de texto para códigos publicados juntamente com os artigos.

Novas características do SyntaxHighlighter 3 para Blogger

Mais rápido que a versão anterior;
Para seleccionar o código basta um duplo clique;
É possível adicionar titulo ao código;
Melhorias na detecção de códigos css, de CommonJS & node.js, etc...

Demostração

Como Instalar:

1. Vá até Painel > Modelo > Editar HTML
2. Procura por </head>
3. Copie o código abaixo e cole-o logo abaixo de </head>

4. De seguida salve o modelo

Como usar:

Sempre que quiser por um código num artigo recorrendo ao SyntaxHighlighter deverá clicar no botão de HTML do editor de artigos e escrever o código dentro das tags seguintes

<pre class="brush: js">
Your code here
</pre>

Para adicionar um titulo ao código basta adicionar title="Título Aqui" ao código, irá ficar assim:

<pre class="brush: js"

title="
Título Aqui "

>
Your code here
</pre>

No final de editar as suas preferências deverá ficar com um código parecido com este:

<pre class="brush: js" title=" Título Aqui !">
<h4>
        <b:if cond='data:post.numComments == 1'>
          1 <data:commentLabel/>:
        <b:else/>
          <data:post.numComments/> <data:commentLabelPlural/>:
        </b:if>
      </h4>
</pre>

Espero que tenha sido útil e até ao próximo artigo!