jekyll starter blog

Jekyll Starter-Blog-Vorlage

Statisch generierte Website für Entwickler, die Blog-Beiträge schreiben möchten, die im statischen Hosting gehostet werden (z. B. Github-Seiten).

Demo-Website: https://sutanlab.js.org/jekyll-starter-blog

Merkmale

• Einfach, automatisiert und schnell
• SEO-optimiert
• Mobilfreundlich (Zum Startbildschirm hinzufügen)
• Kommentarsystem mit Disqus
• Live-Suche
• AJAX-Paginierung
• RSS-Feed
• Sitemap
• Roboter Txt
• Shell-Skript zum Erstellen von Beiträgen und zur automatisierten Bereitstellung auf Github-Seiten

Im System erforderlich

1. NodeJS
2. Rubin

Aufstellen

1. Installieren Sie die Anforderungen
2. Fork Jekyll Starter-Blog
3. Klonen Sie das Repository, das Sie gerade geforkt haben, oder laden Sie es herunter
4. Gehen Sie zu dem Ordner, den Sie gerade geklont oder heruntergeladen haben, und führen Sie npm install aus, um alle NPM- und Bundler-Abhängigkeiten zu installieren
5. Schauen Sie sich die Beispielbeiträge in _posts an, um Beispiele für die Zuweisung von Kategorien und Tags zu sehen
6. Weitere Hinweise und Dokumentationen zur Anpassung finden Sie in der folgenden Dokumentation

Einrichten Ihrer Website

Gehen Sie und bearbeiten Sie _config.yml

 # Site settings
name : Sutanlab Blog
title : Gading Nst. - Coder
description : A blog and journal about Gading Nst, Junior Developer
baseurl : " /jekyll-starter-blog " # the subpath for your site default is ""
url : " https://sutanlab.js.org " # the base hostname & protocol in your domain (e.g: https://sutanlab.github.io)

# Author Setting
username : Gading Nst.
user_description : Learner, Coder & Coffee Maniac
user_title : Welcome to My Blog Site
avatar_url : /jekyll-starter-blog/assets/img/sutan.jpeg
email : [email protected]
github_username : sutanlab
disqus_username : sutanlab
facebook_username : sgnzst
instagram_username : sutan_gnst
twitter_username : sutan_gnst
medium_username : sutan.gnst

...

Theme-Anpassung

Gehen Sie und bearbeiten Sie _variables.scss im Ordner src/sass

 // theme color
$main : #2c3e50 ;
$sidemenu : #242f3a ;
$hover : darken ( $main , 50 % );
$sec : #FFFFFF ;
$lightGray : #F2F2F2 ;
$texts : #333333 ;
$colorcode : #3085F4 ;
$loader-color : #FFFFFF ;

/* *
  * adjust with your disqus theme
  * if your disqus theme is dark, the color should be darken. 
  * if your disqus theme is light, the color should be lighten
*/
$comment-theme : #304165 ; 

// responsive cut
$cut : 37.5 rem ;

Erstellen Sie einen neuen Beitrag mit dem Befehl post.sh

Sie folgen einfach dem Befehl ./post -c Post Title um einen neuen Beitrag zu erstellen. Der neue Beitrag wird unter _posts im .md -Format erstellt. Und wenn Sie einen neuen Beitrag erstellen, müssen Sie die Beitragsinformationen in der Titelzeile ausfüllen, folgen Sie diesem Beispiel:

 ---
layout : post
title : Post Title
date : 2019-05-02 16:32:44
image : /assets/img/blog/post-image.png
description : First steps to use this template
tags :
  - jekyll 
  - template
categories :
  - I love Jekyll
twitter_text : How to install and use this template
keywords : jekyll, template, my post
---

Für andere ./post.sh :

• ./post -h Ausgabeanweisungen
• ./post -c $TITLE Beitrag erstellen
• ./post -d $TITLE Beitragsentwurf erstellen
• ./post -p $TITLE einen Entwurf für einen Beitrag veröffentlichen/bewerben

So stellen Sie eine Site in Github Pages bereit

1. Denken Sie daran, npm run build zum Kompilieren von Sass, JS und Build-Site-Dateien auszuführen, bevor Sie die Site bereitstellen

2. npm run deploy für die Bereitstellung in einem anderen Zweig aus, der sich auf Github-Seiten befindet

3. Oder Sie können die automatische Bereitstellung mit ./deploy.sh verwenden

So führen Sie den Server für die Entwicklung lokal aus

Führen Sie npm start oder bundle exec jekyll server --host=$IP_ADDR --port=$PORT

Unterstützen Sie mich

Global

Indonesien

• Trakteer
• Karyakarsa

---

Copyright © 2019 von Gading Gading Fadhillah Nasution