Konfigurera Jekyll för GitHub-sidor på 60 sekunder

Jekyll kan användas med GitHub Pages för att skapa enkla, bloggmedvetna, statiska webbplatser. Den här videon visar hur du konfigurerar Jekyll flatfilstrukturen på bara benen på 60 sekunder!

När du är färdig och behöver inspiration, kolla vad som är tillgängligt bland Jekyll-teman på Envato Market.

Om du föredrar en skriftlig förklaring, här är hela processen som beskrivs i klara steg:

Nytt projekt

Skapa först en mapp på ditt system för en ny repo. Gör detta genom att använda terminalen för att navigera till var du vill att din nya mapp ska vara och ange sedan: mkdir mysite. Vår nya mapp heter "mysite", men du kan namnge det du vill ha.  

Byt katalog till den här nya mappen genom att ange cd mysite-en gång där skapar en konfigurationsfil genom att ange kommandot vim _config.yml. Ditt terminalfönster visar dig innehållet i den här filen, så träffa jag att komma in infogningsläge, Lägg sedan till följande innehåll:

titel: Min webbplats

Träffa Esc att lämna infogningsläge, skriv sedan in : x för att spara de ändringar du har gjort.

Skapa index

Nästa måste vi skapa indexdokumentet, så skriv in vim index.md och mycket som du gjorde tidigare, lägg till följande innehåll:

--- titel: Hej layout: standard --- Hej!

Lägg till layoutmapp

Skapa nu en ny mapp genom att skriva in mkdir _layouts och byta till den katalogen med cd _layouts. Ge det ett standardmallokument vim default.html och lägg till följande innehåll:

 innehåll 

Initiera Ny Repo

Nu måste vi initiera mappen som en ny repo och begå ändringarna. Så börja med att navigera tillbaka till roden av vårt projekt med CD… . Ange sedan git init, följd av git add --all && git commit --all. 

Pushing till GitHub

Byt till GitHub via webbläsaren och skapa en ny repo. 

Du får några alternativ på den här tiden, så ta tag i kommandona där du ser tryck på ett befintligt förråd från kommandoraden. Kommandona kommer att läsa något som:

git remote add ursprung [email protected]: your_username / mysite.git git push -u ursprungsmästare

Klistra in dessa kommandon i terminalen för att driva din lokala repo till GitHub.

GitHub Inställningar

Slutligen, i GitHub repo inställningar, välja att använda huvudgrenen för GitHub Sidor, sedan träffa Spara.

Jekyll är upplagt och din webbplats är redo att byggas!

Jekyll filstruktur, förklarad

• _config.yml fungerar som Jekyll-konfigurationsfilen. Det här är vad GitHub Pages läser för hela webbplatsens inställningar som globala variabler och mer.
• index.md är root index-dokumentet på webbplatsen för GitHub Pages.
• _layouts / default.html är standardmallfilen som index.md kommer att baseras på.

Användbara resurser

För mer information om att bygga statiska webbplatser med Jekyll, kolla in följande resurser runt Envato Tuts+!

• 

  Så här ställer du in en Jekyll-tema

  I denna handledning kommer vi att gå igenom att skapa ett Jekyll-tema från början, från och med några grundläggande installationsråd, genom att gå igenom hur man ...
• 

  Ny kurs: Bygga statiska webbplatser med Jekyll

  I vår nya kurs får du lära dig allt om den statiska Jekyll-generatorn och bygga en hel webbplats från början på mindre än två timmar. Gå med i Guy Routledge ...
• 

  Kommandoraden för webbdesign: Ta tag i grunderna

  I den här handledningen lär du dig alla nödvändigheter för att arbeta med en terminal eller kommandotolk, inklusive hur man öppnar det, hur man kör kommandon, hur man repeterar ...