Om du bloggar om internet och programmering kommer du förmodligen förr eller senare att behöva skriva någon form av kod i dina inlägg. Oavsett om du skriver javascript, PHP eller HTML kommer du förmodligen att upptäcka ett problem: koden förstör dina inlägg. Om du till exempel vill visa besökarna hur de gör text fet genom att använda <strong>-taggen kommer koden att exekveras och din egen text blir fet. Lösningen? Läs vidare.

Vissa löser det här genom att placera ett mellanslag i koden – ”< strong >” – men då kommer koden inte att fungera när dina besökare kopierar den. Det finns ett par mycket mer praktiska sätt att lösa problemet.

DIY (Do It Yourself)

Om du använder blockredigeraren i WordPress (Gutenberg) kan du enkelt visa kod genom att lägga till ett Kodblock (eller Code block). Då visas koden korrekt utan att den körs av webbläsaren.

Om du inte använder blockredigeraren kan du omsluta all din kod med <code>-taggen, då det låter dig särskilja koden från resterande text i inlägget genom att redigera ditt temas CSS-dokument. Sedan måste du omvandla koden till karaktärsentiteter. Alltså,

Från detta: <strong>exempelkod</strong>
Till detta: &lt ;strong&gt ;example code&lt ;/strong&gt ; (observera mellanrummen)

Du kan göra detta manuellt genom att ersätta < med &lt ; och > med &gt ;.

Genom tillägg

Det går alltså att publicera kod i inlägg relativt enkelt, men eftersom vi pratar om WordPress så finns det såklart också tillägg som gör processen ännu enklare.

Om du villl få färgmarkering (syntax highlighting) I kod kan du använda tillägg som SyntaxHighlighter Evolved eller bibliotek som Prism.js. Dessa markerar olika delar av koden i olika färger och gör den lättare att läsa.

Då kan du producerar kod med följande utseende:

h4 { background-color: white; } 
p  { background-color: #1078E1; } 
ul { background-color: rgb( 149, 206, 145); }

Snyggt, inte sant?