gatsby ghost simply
v1.0.0
Eine Starter-Vorlage zum Erstellen blitzschneller Websites mit Ghost (in diesem Fall als Headless-CMS) und Gatsby unter Verwendung des hervorragenden Simply Ghost-Themes. Vom Lenker-Thema zu React/Gatsby umgeschrieben.
Demo: https://gatsby-ghost-simply.netlify.app/
custom_template verwenden!)custom_template verwenden!)custom_template ).custom_template ). # With Gatsby CLI
gatsby new gatsby-starter-ghost https://github.com/anarion80/gatsby-ghost-simply.git # From Source
git clone https://github.com/anarion80/gatsby-ghost-simply.git
cd gatsby-ghost-simplyDann installieren Sie Abhängigkeiten
yarnStarten Sie den Entwicklungsserver. Sie haben jetzt eine Gatsby-Site, die Inhalte von Headless Ghost abruft. Sie müssen weder das ursprüngliche Simply Ghost-Theme in Ihrer Ghost-Instanz installiert noch dort zusätzliche Routen eingerichtet haben.
gatsby developStandardmäßig füllt der Starter Inhalte aus einer Standard-Ghost-Installation unter https://gatsby.ghost.io.
Um Ihre eigene Installation zu verwenden, müssen Sie die Konfigurationsdatei .ghost.json mit Ihren Anmeldeinformationen bearbeiten. Ändern Sie den apiUrl Wert in die URL Ihrer Ghost-Site. Für Ghost(Pro)-Kunden ist dies die Ghost-URL, die auf .ghost.io endet, und für Benutzer der selbst gehosteten Version von Ghost ist es dieselbe URL, die für den Zugriff auf Ihre Website verwendet wird.
Aktualisieren Sie als Nächstes den contentApiKey -Wert auf einen Schlüssel, der der Ghost-Site zugeordnet ist. Ein Schlüssel kann durch Erstellen einer Integration in Ghost Admin bereitgestellt werden. Navigieren Sie zu Integrationen und klicken Sie auf „Neue Integration hinzufügen“. Benennen Sie die Integration entsprechend und klicken Sie auf „Erstellen“.
{
"apiUrl" : " https://gatsby.ghost.io " ,
"contentApiKey" : " 9cc5c67c358edfdd81455149d0 "
} Konfigurieren Sie abschließend Ihre gewünschte URL in siteConfig.js , damit Links (z. B. kanonische Links) korrekt generiert werden. Sie sollten dort auch andere Werte aktualisieren, die für das Menü, das Teilen in sozialen Netzwerken und die Suche benötigt werden.
{
menuDropdown : [
{
label : `About` ,
url : `/about` ,
} ,
.
.
.
] ,
followSocialMedia : [
{
service : `youtube` ,
title : `YOUR_TITLE` ,
url : `YOUR_URL` ,
} ,
.
.
.
] ,
searchSettings : {
key : `YOUR_GHOST_API_KEY` ,
url : `YOUR_GHOST_URL` ,
/* This is optional */
options : {
keys : [ `title` , `plaintext` ] ,
limit : 10 ,
} ,
/* This is optional to perform filtering of the ghost api */
api : {
resource : `posts` ,
parameters : {
limit : `all` ,
fields : [ `title` , `slug` , `plaintext` ] ,
filter : `` ,
include : `` ,
order : `` ,
formats : `` ,
} ,
} ,
} ,
} Um benutzerdefinierte Beitragsvorlagen zu verwenden, fügen Sie dem Beitrag ein bestimmtes internes Tag hinzu (z. B. #custom-post-wide , #custom-kusi-doc usw.).
Demo und Repo sind die „Maximalversion“ mit allen möglichen Arten von Homepage-Varianten, Beitragsvorlagen, Portfolios, Dokumenten usw. Nach Bedarf anpassen/entfernen.
Der Starter enthält drei Konfigurationsdateien speziell für die Bereitstellung mit Netlify. Eine netlify.toml Datei für Build-Einstellungen, eine /static/_headers Datei mit Standard-Sicherheitsheadern für alle Routen und /static/_redirects zum Festlegen benutzerdefinierter Netlify-Domänenumleitungen.
Klicken Sie zur Bereitstellung auf Ihrem Netlify-Konto auf die Schaltfläche unten.
Inhalts-API-Schlüssel gelten im Allgemeinen nicht als vertrauliche Informationen, sie sind so vorhanden, dass sie im Falle eines Missbrauchs geändert werden können; Daher übernehmen die meisten Leute es direkt in ihre .ghost.json -Konfigurationsdatei. Wenn Sie diese Informationen lieber aus Ihrem Repository fernhalten möchten, können Sie diese Konfiguration entfernen und stattdessen Netlify ENV-Variablen für Produktions-Builds festlegen.
Nach der Bereitstellung können Sie eine Ghost + Netlify-Integration einrichten, um Deploy-Hooks von Ghost zu verwenden, um Netlify-Neuerstellungen auszulösen. Auf diese Weise wird Ihre Website jedes Mal, wenn sich Daten in Ghost ändern, auf Netlify neu erstellt.
Sie können das Standard-Frontend des Ghost-Lenker-Designs deaktivieren, indem Sie in Ihren Ghost-Einstellungen die Markierung Make this site private aktivieren. Dies ermöglicht den Passwortschutz vor der Ghost-Installation und legt <meta name="robots" content="noindex" /> fest, sodass Ihr Gatsby-Frontend zur Quelle der Wahrheit für SEO wird.
# Run a production build, locally
gatsby build
# Serve a production build, locally
gatsby serve Gatsby develop verwendet die development in .ghost.json – während Gatsby build die production verwendet.
Copyright (c) 2021 anarion80 – Veröffentlicht unter der GPLv3-Lizenz.
