Utilizando SintaxHighlighter do google

Olá galera!

Vamos aprender como inserir em seu blog ou site o Google Sintax Highlighter. Pra quem não sabe ele é um plugin que formata um conteúdo para ficar bem parecido com uma aparência de um editor de html/css/jquery e etc…

Bom primeiro vamos baixar o Google Sintax Highlighter.

Após baixar o código, extraia o mesmo em uma pasta em seu computador.

Procure na pasta “Styles” pelo arquivo SyntaxHighlighter.css.

Copie o conteúdo e cole em seu arquivo “.css” do seu blog ou site. Geralmente no WordPress é o style.css que está dentro da pasta de seu tema!

Agora vamos abrir a pasta “Scripts”, e nela conterá vários arquivos com o início shBrush + (o nome da linguagem).js. Ex: shBrushPhp.js, shBrushCss.js, shBrushJScript.js, etc.

Abra o arquivo referente a linguagem que vc deseja, copie o conteúdo e cole no fim do arquivo shCore.js que se encontra na mesma pasta.

Copie este código para a pasta js do seu tema WordPress ou do seu site.

<?php if( is_singular() ){ ?>

<script language="javascript" src="url-do-script-shCore.js"></script>
<script language="javascript">
     dp.SyntaxHighlighter.HighlightAll('code');
</script>

<?php } ?>

Fonte: para a parte de mesclagem do tutorial .js e .css usei a dica daqui.

OK?