Como exibir código em publicações do WordPress

Um dos problemas mais comuns que os novos usuários do WordPress enfrentam é a exibição de código nas publicações. O problema ocorre quando um usuário tenta compartilhar um trecho de código em suas publicações. Por padrão, o WordPress filtra o código e ele se torna impossível de ler. Neste artigo, mostrarei como exibir código nas publicações do WordPress.

Uso de entidades HTML para exibir código em publicações do WordPress

As entidades HTML são códigos especiais que são analisados pelos navegadores para exibir o caractere associado a essa entidade específica. Por exemplo:

• & torna-se &
• &lt; torna-se <
• &gt; torna-se >

Usando entidades HTML, você pode exibir código dentro de suas postagens do WordPress.

<div class="awesome"> será exibido no navegador desta forma:

<div class="awesome">

Esse método é particularmente útil se você quiser exibir apenas algumas linhas de código. No entanto, esse método pode ser difícil de aplicar manualmente a várias linhas de código.

Para resolver esse problema, você pode usar um codificador de entidades HTML on-line, como este. Basta inserir o código que deseja converter e pressionar o botão de codificação. Ele converterá seu código em entidades HTML e você poderá colar esse código com segurança dentro da tag <code></code>.

Como usar o plug-in para exibir o código em publicações do WordPress

Se você compartilha trechos de código com frequência em suas publicações, os métodos mencionados acima não funcionarão para você. A primeira coisa que você precisa fazer é instalar e ativar o plugin SyntaxHighlighter Evolved. Ele evitará o incômodo de converter o código em entidades HTML. Além disso, ele destacará o código para exibi-lo em um formato muito mais legível.

Ele funciona imediatamente, tudo o que você precisa fazer é envolver seu conteúdo em tags de idioma específicas. Por exemplo, se você estiver compartilhando um código que está principalmente em PHP, então você envolveria seu código desta forma:

<?php
função themelab_demo_code() { 
$i = 1;
while ($i <= 10):
    echo $i."<br />";
    $i++;
endwhile;
}
themelab_demo_code();
?>

Ele aparecerá em seu site, assim:

<?php
function themelab_demo_code() { 
$i = 1;
while ($i <= 10):
    echo $i."<br />";
    $i++;
endwhile;
}
themelab_demo_code();
?>

Para diferentes idiomas, há diferentes aliases que você pode usar. Alguns dos aliases mais comumente usados são:

• Para exibir código HTML, use

• Para CSS, use isto:
• Para MySQL, use isto:
• Para Javascript, use isto:

Espero que este artigo tenha ajudado você a exibir códigos em posts e páginas do WordPress.

Se você gostou deste artigo, junte-se ao ThemeLab no Twitter e no Google+.