Så langt tilbake som jeg kan huske, brukte jeg Google Code Prettify for å bruke syntaksmarkeringen på kodeblokken på CSS-Tricks. Du vet, hvor i en linje som test , er delen en annen farge enn testdelen. Dette er veldig nyttig for kodelesbarhet. Det hjelper også lesere med en gang å forstå hva de ser på er en kodeblokk (folk liker å skanne artikler, vet du ikke).
I denne nye designen bestemmer vi oss for å gå med det nylig utgitte Prism.js i stedet. Det er ganske mye lettere og raskere. Den er også skreddersydd for å fungere bare med HTML, CSS og JavaScript, som er 95% av koden på CSS-triks. Jeg liker også ganske hvordan klassenavnene som brukes til farging blir rasjonelt navngitt.
Vi begynner å finne ut hvordan vi skal bruke den. Først og fremst ber vi CodeKit om å sammenkoble dette biblioteket i vår globale JavaScript-fil (som er tom så langt, men vi skriver kode der senere). Vi kobler sammen den komprimerte JavaScript-filen i den medfølgende bunntekstdelen.
Det tar oss et øyeblikk å forstå at det ikke er noe du "kaller", det fungerer bare forutsatt at du har de riktige klassenavnene på plass. Vi avslutter med å leke litt med CSS og få koden til å se mer ut som den alltid har gjort på CSS-Tricks.