Jekyll può essere usato con GitHub Pages per creare un semplici siti web statici sotto forma di blog. Questo video ti mostrerà come configurare la struttura di Jekyll in soli 60 secondi!

Una volta che sei pronto e che hai bisogno di ispirazione, guarda cos'è disponibile tra i temi Jekyll su Envato Market.

Se preferisci una spiegazione scritta, ecco qui l'intero processo descritto in semplici passaggi:

Nuovo progetto

Prima di tutto, crea una cartella sul tuo sistema per un nuovo repo. Fai ciò usando il terminale e naviga dove vorresti che la nuova cartella sia, poi inserisci: mkdir mysite. La nostra nuova cartella è chiamata "mysite", ma puoi nominarla come ti piace.

Cambia la cartella in questa nuova cartella scrivendo cd mysite - una volta qui crea un file di configurazione scrivendo il comando vim _config.yml. La tua finestra del terminale ti mostrerà il contenuto di questa cartella quindi, premi i per entrare nella modalità di inserimento, poi aggiungi il seguente contenuto:

1

title: My Site

Premi Esc per uscire dalla modalità di inserimento, poi scrivi :x per salvare i cambiamenti effettuati.

Creare l'index

Abbiamo bisogno di creare il documento index, quindi scrivi vim index.md e così come hai fatto prima, aggiungi il seguente contenuto:

1

---

2

title: Hello

3

layout: default

4

---

5

6

Hello!

Aggiungi cartella layouts

Ora crea una nuova cartella scrivendo mkdir _layouts e cambia in questa cartella con cd _layouts. Dai un modello di documento predefinito vim default.html e aggiungi il seguente contenuto:

1

{{ content }}

Inizializzare il nuovo repo

Ora dobbiamo inizializzare la cartella come nuovo repo e fare un commit dei cambiamenti. Quindi cominciamo tornando indietro alla cartella principale del progetto con cd... Poi scrivi git init, seguito da git add --all && git commit --all.

Inviare a GitHub

Passa su GitHub con il browser e crea un nuovo repo.

Ti verranno date alcune opzioni a questo punto, quindi prendi i comandi dove vedi invia un repository esistente da linea di comando. I comandi che leggerai saranno qualcosa simile a:

1

git remote add origin git@github.com:your_username/mysite.git

2

git push -u origin master

Incolla questi comandi nel terminale per inviare il tuo repo locale a GitHub.

Impostazioni di GitHub

Infine, nelle Impostazioni del repo di GitHub, scegli di usare il branch master per GitHub Pages, poi premi Salva.

Jekyll è impostato completamente, e il tuo sito è pronto per essere costruito!

Struttura file di Jekyll, spiegazione

• _config.yml funziona come file di configurazione per Jekyll Questo è cosa GitHub Pages legge per le impostazioni come variabili globali, e altro.
• index.md è il documento index principale del sito web GitHub Pages.
• _layouts/default.html è il file template predefinito di cui si baserà index.md.

Risorse utili

Per altre informazioni su come costruire siti web statici usando Jekyll, dai uno sguardo alle seguenti risorse su Envato Tuts+!

• 

  Come installare un tema Jekyll

  In questo tutorial andremo ad installare un tema di Jekyll da proprio l'inizio, cominciando con alcuni consigli base fino ad andare a come fare...
• 

  Nuovo corso: Costruire siti web statici con Jekyll

  Nel nostro nuovo corso imparerai tutto ciò che riguarda il generatore di sito web statico Jekyll e costruirai un intero sito web da zero in meno di due ore. Iscriviti con Guy Routledge...
• 

  La linea di comando per il Web Design: Afferriamo le basi

  In questo tutorial imparerai tutto l'essenziale del lavorare con un terminale o prompt di comandi incluso come aprirlo, come eseguire comandi e come ripetere...