Recentemente eu me vi na iminência de inserir códigos fontes no meu blog, mas então veio a dúvida cruel: como fazê-lo de uma forma que seja agradável para os leitores?
Depois de pesquisar bastante; depois de tentar vários métodos que, ora não funcionavam e ora não geravam um resultado satisfatório, eu encontrei o projeto Pygments, que é um marcador de sintaxe de várias linguagens (ainda que o slogan do projeto, traduzido para o português do Brasil, seja: Marcador de sintaxe Python).
A utilização do Pygments é relativamente simples e resume-se em 4 etapas (sendo que as duas primeiras são feitas apenas uma vez): Instalação do programa, configuração do blog para trabalhar com o Pygments, geração do código HTML a partir dos fontes e inserção do código no blog.
Instalação do Pygments
No Ubuntu (8.04) não tive problemas nesta etapa. Bastou abrir o Synaptic, procurar por pygments e mandar instalar o pacote python-pygments.
Preparação do Blog
Hospede o arquivo de estilo, que define a formatação do código, em um servidor acessível pela Internet e adicione, antes da tag do seu modelo HTML (Painel/Layout/Editar HTML), a seguinte linha:
Depois de pesquisar bastante; depois de tentar vários métodos que, ora não funcionavam e ora não geravam um resultado satisfatório, eu encontrei o projeto Pygments, que é um marcador de sintaxe de várias linguagens (ainda que o slogan do projeto, traduzido para o português do Brasil, seja: Marcador de sintaxe Python).
A utilização do Pygments é relativamente simples e resume-se em 4 etapas (sendo que as duas primeiras são feitas apenas uma vez): Instalação do programa, configuração do blog para trabalhar com o Pygments, geração do código HTML a partir dos fontes e inserção do código no blog.
Instalação do Pygments
No Ubuntu (8.04) não tive problemas nesta etapa. Bastou abrir o Synaptic, procurar por pygments e mandar instalar o pacote python-pygments.
Preparação do Blog
Hospede o arquivo de estilo, que define a formatação do código, em um servidor acessível pela Internet e adicione, antes da tag do seu modelo HTML (Painel/Layout/Editar HTML), a seguinte linha:
<link rel="stylesheet" href="%5BLOCAL_DE_HOSPEDAGEM%5D/pygments_style.css">
Feito isso, basta salvar o modelo HTML para concluir esta etapa.
Inserindo códigos
Para inserir os códigos, basta abrir um terminal no computador onde o Pygmentize estiver instalado e digitar a seguinte linha de código:
$ pygmentize -f html codigo > codigo.html
Isto irá gerar um arquivo HTML com o código fonte passado por parâmetro. Então deve-se abrir o código gerado em um editor de textos como o GEdit e selecionar e copiar todo o conteúdo do mesmo (COMMAND + A, COMMAND + C).
Abra uma nova postagem no blog e selecione a aba Editar HTML. Cole o código (COMMAND + V). Aqui tem um truque. Na primeira linha do código recém colado, substitua:
Inserindo códigos
Para inserir os códigos, basta abrir um terminal no computador onde o Pygmentize estiver instalado e digitar a seguinte linha de código:
$ pygmentize -f html codigo > codigo.html
Isto irá gerar um arquivo HTML com o código fonte passado por parâmetro. Então deve-se abrir o código gerado em um editor de textos como o GEdit e selecionar e copiar todo o conteúdo do mesmo (COMMAND + A, COMMAND + C).
Abra uma nova postagem no blog e selecione a aba Editar HTML. Cole o código (COMMAND + V). Aqui tem um truque. Na primeira linha do código recém colado, substitua:
<div class="highlight">
por:
<div class="syntax">
Pronto! Apesar do texto normalmente não ficar bem formatado na aba Escrever do editor de postagens do Blogger, ao publicar a sua postagem, o código deverá estar formatado.
Vale lembrar que, no site oficial do projeto Pygments, é possível visualizar vários códigos fontes formatados com esta tecnologia, bem como fazer o envio do seu próprio código – esta última opção ainda permite que você deixe seu código hospedado no site do projeto, para que outros usuários possam visualizá-lo.
Para terminar, uma grande crítica ao Oráculo: o Google tem um projeto chamado Google Code Prettifier (Embelezador de Código do Google), que tem a mesma função do Pygments. Se o Blogger pertence ao Google e o o GCP também, por quê não integrar os dois sistemas? É ridículo que os usuários do Blogger tenham que penar tanto por uma função que o Google já possui...
Para terminar, uma grande crítica ao Oráculo: o Google tem um projeto chamado Google Code Prettifier (Embelezador de Código do Google), que tem a mesma função do Pygments. Se o Blogger pertence ao Google e o o GCP também, por quê não integrar os dois sistemas? É ridículo que os usuários do Blogger tenham que penar tanto por uma função que o Google já possui...
Atualizações
Leia Também
- 2008/15/11 – Devido a problemas com perda de indentação e blocagem do código, troquei todo serviço de listagem de códigos do blog para o SyntaxHighlither.
Leia Também
- Criando um Blog no Blogger – Procedimentos para criação de uma boa estrutura para um blog do Blogger.
Nenhum comentário:
Postar um comentário