gatsby attila theme starter gatsby attila theme starter Download - Gatsby Attila Themenstarter Quellcode Download

gatsby attila theme starter

Andere Kategorien

1.0.0

Herunterladen

Gatsby-Starter-Try-Ghost

Ein Gatsby -Starter zum Erstellen von Blogs von Headless Ghost CMS.

Verwandeln Sie Ihren Ghost -Blog in eine blitzschnelle statische Website. Dieses Gatsby-Thema ist ein Front-End-Austausch des Ghost-Lenkermotors mit der Standardhaut und -funktionalität von Ghost Casper. Alle Inhalte stammen aus einem kopflosen Geister -CMS.

Dieser Starter wird bei Draftbox verwendet. Holen Sie sich in 5 Minuten oder weniger ein sicheres, sicheres Front-End für Ihr WordPress- oder Ghost-Blog, ohne zu codieren. Für unsere Mittee bieten wir auch Code -Exportfunktionen.

Demo

Spielen Sie mit der Demo, um einen ersten Eindruck zu bekommen.

Merkmale

Ghost Casper Haut und Funktionalität
SEO optimiert
Voll reagiert
Gatsby Bilder
404 Seite gestylt
RSS -Feed
Ampseiten
Sitemap
Kontaktformular
Formular abonnieren
Soziales Teilen
Integration von Google Analytics
Segmentintegration
Disqus -Integration
Komponierbar und erweiterbar

Erste Schritte

Installieren Sie diesen Starter, indem Sie ausführen

gatsby new try-ghost https://github.com/draftbox-co/gatsby-attila-theme-starter

Verzeichnis ändern
```
 cd try-ghost
```
Laufen
```
gatsby develop
```
und besuchen Sie Ihre Website unter http://localhost:8000 .

? Was ist drin?

Ein kurzer Blick auf die obersten Dateien und Verzeichnisse, die Sie in einem Gatsby-Projekt sehen werden.

 .
├── node_modules
├── static
├── .gitignore
├── gatsby-config.js
├── yarn.lock
├── package.json
└── README.md

/node_modules : Dieses Verzeichnis enthält alle Codemodule, von denen Ihr Projekt abhängt (NPM -Pakete), die automatisch installiert werden.
/static : Dieses Verzeichnis enthält alle statischen Dateien, die vom Thema wie favicon , logo und robot.txt erforderlich sind.
.gitignore : Diese Datei gibt Git mit, für welche Dateien kein Versionshistorie verfolgt / nicht führen dürfe.
gatsby-config.js : Dies ist die Hauptkonfigurationsdatei für eine Gatsby-Site. Hier können Sie Informationen über Ihre Website (Metadaten) wie den Titel und die Beschreibung des Site angeben, die Gatsby -Plugins, die Sie einschließen möchten, usw. (finden Sie in den Konfigurationsdokumenten für weitere Details).
yarn.lock (siehe yarn.lock unten, zuerst). Dies ist eine automatisch generierte Datei basierend auf den genauen Versionen Ihrer NPM -Abhängigkeiten, die für Ihr Projekt installiert wurden. (Sie werden diese Datei nicht direkt ändern).
package.json : Eine Manifestdatei für Node.js -Projekte, die Dinge wie Metadaten (der Name des Projekts, Autor usw.) enthält. Dieses Manifest ist, wie NPM weiß, welche Pakete für Ihr Projekt installiert werden sollen.
README.md : Eine Textdatei mit nützlichen Referenzinformationen zu Ihrem Projekt.

Konfigurieren

    //siteConfig.js
    module . exports = {
        siteUrl : `https://your-blog.com` , // Do not include a trailing slash!
    
        postsPerPage : 12 , //for future use
    
        siteTitleMeta : `Gatsby Starter Ghost CMS` , // This allows an alternative site title for meta data for pages.
        siteDescriptionMeta : `Gastby Starter with Ghost CMS and Casper Skin` , // This allows an site description for meta data for pages.
    
        shareImageWidth : 1000 , // Change to the width of your default share image
        shareImageHeight : 523 , // Change to the height of your default share image
    
        shortTitle : `Ghost` , // Used for App manifest e.g. Mobile Home Screen
        siteIcon : `favicon.png` , // Logo in /static dir used for SEO, RSS, and App manifest
        backgroundColor : `#e9e9e9` , // Used for Offline Manifest
        themeColor : `#15171A` , // Used for Offline Manifest
    }

In der oben gezeigten Konfiguration sind die wichtigsten Felder, die geändert werden müssen, siteUrl , siteTitleMeta und siteDescriptionMeta . Aktualisieren Sie mindestens diejenigen, die Ihren Anforderungen entsprechen.

Ghost -Inhalts -API -Schlüssel

Alle Inhalte stammen aus einem Ghost CMS. Wenn Sie die Datei nicht anpassen. .ghost.json Inhalt wird aus dem Demo -Standort unter https://cms.gotsby.org abgerufen. Sicher möchten Sie Ihren eigenen Inhalt beschaffen. Ändern Sie die Schlüssel, um Ihren eigenen API -Schlüssel für Ghost CMS Content -API zu entsprechen:

    {
        " development " : {
            " apiUrl " : " http://localhost:2368 " ,
            " contentApiKey " : " 9fccdb0e4ea5b572e2e5b92942 "
        },
        " production " : {
            " apiUrl " : " http://localhost:2368 " ,
            " contentApiKey " : " 9fccdb0e4ea5b572e2e5b92942 "
        }
    }

Einsetzen

    gatsby build

Nach Abschluss des Build -Prozesses finden Sie Ihre statische Website im public/ Ordner. Kopieren Sie diese Dateien in Ihren Webserver.

Optimierung

Sie können das standardmäßige Ghost-Lenker-Themen-Front-End deaktivieren, indem Sie Make this site private in Ihren Geistereinstellungen ermöglichen. Dies ermöglicht den Kennwortschutz vor der Ghost-Installation und setzt <meta name="robots" content="noindex" /> so wird Ihr Gatsby Front-End zur Quelle der Wahrheit für SEO.