Ich entwerfe einfach ein Theme für die Ghost Blogging Plattform, indem ich die Ghost Theme Dokumente lese. Jetzt brauche ich nur noch die Paginierung. Das Dokument sagt, erstellen Sie eine pagination.hbs im Ordner partial . aber das Problem ist, ich weiß nicht, wie das Markup sein soll.
Es gibt einen kurzen Beitrag hier , der erklärt, wo Finden Sie das relevante Code-Bit für Ihre pagination.hbs-Datei. Sie können den Standard-Paginierungscode als Vorlage verwenden.
Um Notizen zu posten, müssen Sie den Standard-Paginierungscode aus core/server/helpers/tpl/pagination.hbs in den Ghost-Quellcode kopieren und ihn verwenden, um Ihre eigene pagination.hbs-Datei im partials -Verzeichnis Ihres Designs zu erstellen.
Sie sehen das Markup, das Sie dort bearbeiten müssen, z. B .:
%Vor%Sie müssen Ghost neu starten, nachdem Sie Ihre Änderungen gespeichert haben, um die Änderungen zu sehen.
Ich habe JavaScript-Code erstellt, der die standardmäßige Ghost-Paginierung erweitert. Anstatt "Seite 1 von X" anzuzeigen, wird eine Reihe von Seitennummern mit vorherigen, nächsten, ersten und letzten Schaltflächen angezeigt. Es hat auch eine Ellipse im Zentrum für Seiten mit vielen Seiten. Es kann auf der Seite Code Injection-Einstellungen vollständig angepasst werden.
Meine Implementierung erstellt eine Bootstrap-Paginierungskomponente, aber ich bin mir ziemlich sicher, dass Sie mit den erstellten Klassen und Elementen ( <nav> und <ul> elements) das ausgeben könnten, was Sie wollten.
Hier ist ein Code, den ich vor dem {{ghost_foot}} einfüge. Auf diese Weise kann ich einige der Einstellungen im Fußzeilenbereich der Code-Injection überschreiben:
Hier ist die pagination.hbs für die angepasst Paginierung , die ich auf meiner Site verwende:
Hier ist der JavaScript-Code , das die Paginierung zum obigen HTML hinzufügt.
Hinweis: Da diese Links auf dem Client erstellt werden, stehen sie Suchmaschinen während der Indizierung nicht zur Verfügung. Allerdings verstehe ich, dass die Suchmaschinen die Tags link rel="prev" und link rel="next" verwenden, die Ghost für jede Indexseite ausgibt.
So sehen sie für meine Website aus:
%Vor%Das lässt mich glauben, dass Suchmaschinen zwischen den Seiten navigieren und auf alle Links zugreifen können. Ich habe dies jedoch bei niemandem bestätigt, der es sicher wissen würde. Recherchieren Sie, wenn Sie denken, dass dies ein Problem sein könnte.
Ich habe auch sichergestellt, dass ich meinen Ghost-Sitemap-Link an die Suchmaschinen gesendet habe, um sicherzugehen.
Dies gibt Ihnen eine weitere Option, wenn Sie mit Paginierung arbeiten.
Hier ist die vollständige Beschreibung in meinem Blog, die gibt ein paar mehr Details.
Ich habe all dies (und ein paar andere Ghost-Tricks, wie das Binden von Font Awesome-Icons an Navbar-Links) auf meiner Website: cerkit.com .
Tags und Links html node.js blogs ghost-blog