Com esse realçador de código-fonte você pode inserir programas bem formatados em seus posts. Vamos usar as bibliotecas gratuitas em JavaScr...
Com esse realçador de código-fonte você pode inserir programas bem formatados em seus posts. Vamos usar as bibliotecas gratuitas em JavaScript do SyntaxHighlighter para inserir código de programas em seus posts.
Você deve colocar os arquivos .js e de estilo .css em um site que possa armazená-los. Um bom repositório para isso é o Google Pages.
Depois de hospedar os arquivos, faça backup de seu template (para o caso de algo der errado) e coloque o código a seguir imediatamente antes de </html>
Troque [SEU SERVIDOR] pelo endereço onde o arquivo será hospedado.
Pronto! Já deve estar funcionando. Para colocar os códigos no seu post basta inserir o código da seguinte forma:
No caso de se usar tags, você deve trocar todos os símbolos "<" ("menor que") pelo código html <.
O nome da classe pode variar dependendo da linguagem utilizada, veja tabela completa das linguagens e dos apelidos usados no atributo class.
Qualquer dúvida é só comentar.
Traduzido e adaptado de Tips for software engineer: Using SyntaxHighlighter on BLOGGER por Brasil Acadêmico.
Você deve colocar os arquivos .js e de estilo .css em um site que possa armazená-los. Um bom repositório para isso é o Google Pages.
Depois de hospedar os arquivos, faça backup de seu template (para o caso de algo der errado) e coloque o código a seguir imediatamente antes de </html>
Troque [SEU SERVIDOR] pelo endereço onde o arquivo será hospedado.
<link href='http://[SEU SERVIDOR]/SyntaxHighlighter.css' rel='stylesheet' type='text/css'/>
<script src='http://[SEU SERVIDOR]/shCore.js' type='text/javascript'/>
<script src='http://[SEU SERVIDOR]/shBrushCpp.js' type='text/javascript'/>
<script src='http://[SEU SERVIDOR]/shBrushCSharp.js' type='text/javascript'/>
<script src='http://[SEU SERVIDOR]/shBrushCss.js' type='text/javascript'/>
<script src='http://[SEU SERVIDOR]/shBrushJava.js' type='text/javascript'/>
<script src='http://[SEU SERVIDOR]/shBrushJScript.js' type='text/javascript'/>
<script src='http://[SEU SERVIDOR]/shBrushSql.js' type='text/javascript'/>
<script src='http://[SEU SERVIDOR]/shBrushXml.js' type='text/javascript'/>
<script class='javascript'>
//<![CDATA[
function FindTagsByName(container, name, Tag)
{
var elements = document.getElementsByTagName(Tag);
for (var i = 0; i < elements.length; i++)
{
if (elements[i].getAttribute("name") == name)
{
container.push(elements[i]);
}
}
}
var elements = [];
FindTagsByName(elements, "code", "pre");
FindTagsByName(elements, "code", "textarea");
for(var i=0; i < elements.length; i++) {
if(elements[i].nodeName.toUpperCase() == "TEXTAREA") {
var childNode = elements[i].childNodes[0];
var newNode = document.createTextNode(childNode.nodeValue.replace(/<br\s*\/?>/gi,'\n'));
elements[i].replaceChild(newNode, childNode);
}
else if(elements[i].nodeName.toUpperCase() == "PRE") {
brs = elements[i].getElementsByTagName("br");
for(var j = 0, brLength = brs.length; j < brLength; j++) {
var newNode = document.createTextNode("\n");
elements[i].replaceChild(newNode, brs[0]);
}
}
}
dp.SyntaxHighlighter.ClipboardSwf =
"http://[SEU SERVIDOR]/clipboard.swf";
dp.SyntaxHighlighter.HighlightAll("code");
//]]>
</script>
Pronto! Já deve estar funcionando. Para colocar os códigos no seu post basta inserir o código da seguinte forma:
<pre name="code" class="c-sharp">
...Seu código aqui.
<pre>
No caso de se usar tags, você deve trocar todos os símbolos "<" ("menor que") pelo código html <.
O nome da classe pode variar dependendo da linguagem utilizada, veja tabela completa das linguagens e dos apelidos usados no atributo class.
Qualquer dúvida é só comentar.
Traduzido e adaptado de Tips for software engineer: Using SyntaxHighlighter on BLOGGER por Brasil Acadêmico.
Comentários