Come visualizzare il codice nei post di WordPress

Uno dei problemi più comuni che i nuovi utenti di WordPress incontrano è la visualizzazione del codice nei post. Il problema si verifica quando un utente tenta di condividere uno snippet di codice nei propri post. Per impostazione predefinita, WordPress filtra il codice e questo diventa illeggibile. In questo articolo, ti mostrerò come visualizzare il codice nei post di WordPress.

Utilizzo delle entità HTML per visualizzare il codice nei post di WordPress

Le entità HTML sono codici speciali che vengono analizzati dai browser per visualizzare il carattere associato a quella particolare entità. Ad esempio:

• & diventa &
• &lt; diventa <
• &gt; diventa >

Utilizzando le entità HTML puoi visualizzare il codice all'interno dei tuoi post di WordPress.

<div class="awesome"> verrà visualizzato nel browser in questo modo:

<div class="awesome">

Questo metodo è particolarmente utile se vuoi solo visualizzare un paio di righe di codice. Tuttavia, questo metodo può essere difficile da applicare manualmente per più righe di codice.

Per risolvere questo problema puoi utilizzare un codificatore di entità HTML online, come questo. Inserisci semplicemente il codice che vuoi convertire e premi il pulsante codifica. Convertirà il tuo codice in entità HTML e potrai incollare in sicurezza quel codice all'interno del tag <code></code>.

Utilizzo di un plugin per visualizzare il codice nei post di WordPress

Se condividi frequentemente snippet di codice nei tuoi post, allora i metodi sopra menzionati non funzioneranno per te. La prima cosa che devi fare è installare e attivare il plugin SyntaxHighlighter Evolved. Ti risparmierà la fatica di convertire il codice in entità HTML. Non solo, ma evidenzierà il codice per visualizzarlo in un formato molto più leggibile.

Funziona subito, tutto ciò che devi fare è racchiudere il tuo contenuto attorno a tag specifici per la lingua. Ad esempio, se stai condividendo un codice che è principalmente in PHP, allora racchiuderai il tuo codice in questo modo:

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


Apparirà sul tuo sito, in questo modo:

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

Per lingue diverse ci sono alias diversi che puoi usare. Alcuni degli alias più comunemente usati sono:

• Per visualizzare codice HTML usa [html] [/html]
• Per CSS usa questo: [css][/css]
• Per MySQL usa questo: [sql][/sql]
• Per Javascript usa questo: [javascript][/javascript]

Spero che questo articolo ti abbia aiutato a visualizzare il codice nei post di WordPress e nelle pagine.

Se ti è piaciuto questo articolo, unisciti a ThemeLab su Twitter e Google+.