syntax highlight

| last update 06/06/2017 08:42 |

Syntax Highlighting ist eine feine Sache für die Darstellung von Codeblöcken.

Ohne Highlight
#include <stdio.h>
  int main(void) {
     printf("Hello World\n");
     return 0;
Mit Highlight
#include <stdio.h>
  int main(void) {
     printf("Hello World\n");
     return 0;

Um in Kirby Syntaxhighlighting für fenced Codeblocks mit prism.js zu realisieren, geht man wie folgt vor:

Auf folgender Seite prismjs.com/download.html: klickt man sich seine gwünschte Variante zusammen und kopiert anschließend die beiden Dateien prism.js so wie prism.css in das Kirby-Unterverzeichnis /assets.

Anschließend sucht man sich die Header Datei des templates raus um prism dort an zwei Stellen einzufügen. In meinem Fall ist es z.B. die Datei sites/snippets/header.php aus dem Baseblog Template

Zwischen <head> und </head> wird folgendes eingefügt:

<?php echo css('assets/prism.css') ?>

Direkt nach <body> fügt man dann noch folgendes ein:

<?php echo js('assets/prism.js') ?>

Das wars dann auch schon. Ab sofort nutzt man im Panel beim Post-Erstellen für fenced Codeblocks zusätzlich noch den Hinweis zur Codesprache nach den drei backticks ```

somit wird aus..

``` c
#include 
  int main(void) {
     printf("Hello World\n");
     return 0;
```

... dieser Codeblock


#include 
  int main(void) {
     printf("Hello World\n");
     return 0;