Run je een blog over web development en wil je graag code in je blogberichten delen? Vanwege veiligheidsredenen filtert WordPress standaard ‘raw code’ uit blogberichten, widgets en reacties. Gelukkig is er een uitstekende oplossing waarmee je code wél zichtbaar kunt maken in je blogberichten, namelijk de SyntaxHighlighter Evolved plugin.
De SyntaxHighlighter Evolved plugin installeren
Download en installeer de plugin en ga naar Settings > SyntaxHighlighter om de instellingen te configureren. De standaard instellingen werken prima voor de meeste websites, maar het is raadzaam om toch even alle instellingen na te lopen. Elke optie is voorzien van een gedetailleerde beschrijving om uit te leggen wat het doet. Zodra je klaar bent klik je op de ‘Save changes’ knop.
Werking van de SyntaxHighlighter Evolved plugin
De SyntaxHighlighter Evolved plugin maakt gebruik van simpele shortcodes om de code weer te geven. Voor elke programmeertaal of scripttaal moet je je code in de shortcode voor die taal ‘wrappen.’
Voor PHP ziet dat er zo uit:
[php]
<?php
echo “Hello World”;
?>
[/php]
Dit komt er dan als volgt uit te zien in je blogbericht:
<?php
echo “Hello World”;
?>
Voor CSS wrap je je code als volgt:
[css]
.entry-title {
font-family:”Open Sans”, arial, sans-serif;
font-size:16px;
color:#272727;
}
[/css]
Dit komt er dan als volgt uit te zien in je blogbericht:
.entry-title {
font-family:”Open Sans”, arial, sans-serif;
font-size:16px;
color:#272727;
}
De SyntaxHighlighter Evolved plugin zal de code voor de betreffende programmeertaal highlighten. Ook regelnummers en tab inspringing worden netjes afgehandeld. Zo kunnen je gebruikers heel gemakkelijk stukjes code van je WordPress site kopiëren en plakken.
