Ghost gefällt mir bisher äußerst gut, jedoch ist es schon etwas gewöhnungsbedürftig wenn man Wordpress kennt. So können bei Ghost nicht einfach Plugins installiert werden, wenn man eine bestimmte Funktionalität haben möchte. Mir fehlte beispielsweise eine Art Lightbox um Bilder anzuzeigen. Da heißt es bei ghost selbst Hand anlegen und "Code anfassen" :)

Hier habe ich eine leichte, funktionierende Lösung gefunden. Die Beschreibung dort bezieht sich zwar auf das Standardtheme "casper", lässt sich jedoch auch mit ein paar kleinen Anpassungen in dem hier verwendeten Theme ghostium anwenden.

Installation

Im wesentlichen muss zum installieren der Lightbox folgendes getan werden:

  1. default.hbs ausfindig machen[^n] und in einem Editor eurer Wahl (vim!) öffnen:
vim default.hbs
  1. Die css Datei verlinken:
<link rel="stylesheet" type="text/css" href="/assets    /css/sb.css">

diese Zeile direkt nach den meta tags einfügen (vermutlich geht auch eine andere Stelle)

3. Die js Datei einbinden (bevorzugt werden javascript Sachen ganz unten eingefügt, d.h. vor dem </body> Tag):

<script src="{{asset 'js/slimbox2.js'}}">
Damit die Slimbox auch beim ersten Laden der Seite verfügbar ist, müssen noch folgende Zeilen hinzugefügt werden:
<script>
$(document).ready(function() {
var _customHandler = function() {
	$("a[rel^='lightbox']").slimbox();
};
_customHandler();

	$(this).on('pjax:end', _customHandler);
});
</script> 

(Den Code habe ich von dieser Seite übernommen und für Slimbox angepasst)


4. Die Dateien Downloaden und an die richtigen Stellen ../ghostium/assets kopieren
Entweder direkt vom Entwickler oder aus meinem github Repo.

Benutzung

In einem Post eurer Wahl fügt ihr ein Bild mit folgendem Markdown Code ein:

[![](/content/images/JAHR/MONAT/BILD_Vorschau.png)](/content/images/JAHR/MONAT/BILD.png" rel="lightbox)

Das erste Bild wird als Thumbnail verwendet, das Zweite wird in der Lightbox angezeigt.
Hier noch ein Beispiel wie das ganze aussehen sollte wenn alles geklappt hat: