Sette opp Jekyll for GitHub Pages på 60 sekunder

Jekyll kan brukes med GitHub Pages for å lage enkle, bloggbevisste, statiske nettsteder. Denne videoen vil vise deg hvordan du konfigurerer Jekyll flatfilstrukturen på bare-bein på 60 sekunder!

Når du er ferdig og trenger inspirasjon, sjekk ut hva som er tilgjengelig blant Jekyll-temaene på Envato Market.

Hvis du foretrekker en skriftlig forklaring, er hele prosessen beskrevet i klare trinn:

Nytt prosjekt

Først oppretter du en mappe på systemet for en ny repo. Gjør dette ved å bruke terminalen til å navigere til hvor du vil at den nye mappen skal være, og skriv inn: mkdir mysite. Vår nye mappe heter "mysite", men du kan nevne det du vil.  

Bytt katalog til denne nye mappen ved å skrive inn cd mysite-Når det er opprettet en konfigurasjonsfil ved å skrive inn kommandoen vim _config.yml. Terminalvinduet viser deg innholdet i denne filen, så hit Jeg å gå inn sett inn modus, Legg deretter til følgende innhold:

tittel: Mitt nettsted

Truffet Esc å forlate sett inn modus, og skriv deretter inn : x for å lagre endringene du har gjort.

Opprett indeks

Deretter må vi opprette indeksdokumentet, så skriv inn vim index.md og mye som du gjorde før, legg til følgende innhold:

--- tittel: Hei layout: standard --- Hei!

Legg til layoutmappe

Opprett nå en ny mappe ved å skrive inn mkdir _layouts og bytt til katalogen med cd _layouts. Gi det et standard mal dokument vim default.html og legg til følgende innhold:

 innhold 

Initialiser ny repo

Nå må vi initialisere mappen som en ny repo og forplikte endringene. Så begynn å navigere tilbake til roten av prosjektet vårt med cd ... . Skriv deretter inn git init, etterfulgt av git add --all && git commit --all. 

Skubbe til GitHub

Bytt til GitHub via nettleseren og opprett en ny repo. 

Du vil bli gitt noen alternativer på dette punktet, så ta tak i kommandoene der du ser skyv et eksisterende lager fra kommandolinjen. Kommandoene vil lese noe som:

git remote add opprinnelse [email protected]: your_username / mysite.git git push -u opphavsmester

Lim inn disse kommandoene i terminalen for å presse din lokale repo til GitHub.

GitHub Innstillinger

Til slutt, i GitHub repo innstillinger, velge å bruke master grenen for GitHub Sider, deretter treffer Lagre.

Jekyll er alt satt opp, og nettstedet ditt er klar til å bli bygget!

Jekyll filstruktur, forklart

• _config.yml fungerer som Jekyll-konfigurasjonsfilen. Dette er hva GitHub Pages leser for hele nettstedet-innstillinger, for eksempel globale variabler og mer.
• index.md er root-indeksdokumentet på nettstedet GitHub Pages.
• _layouts / default.html er standardmalfilen som index.md vil være basert på.

Nyttige ressurser

For mer informasjon om å bygge statiske nettsteder ved hjelp av Jekyll, sjekk ut følgende ressurser rundt Envato Tuts+!

• 

  Slik oppretter du et Jekyll-tema

  I denne opplæringen vil vi gå gjennom å sette opp et Jekyll-tema fra begynnelsen, med utgangspunkt i noen grunnleggende installasjonsråd, som går gjennom hvordan du skal ...
• 

  Ny kurs: Bygg statiske nettsteder med Jekyll

  I vårt nye kurs vil du lære alt om Jekyll statisk nettsted generator og bygge en hel nettside fra bunnen av på mindre enn to timer. Bli med Guy Routledge ...
• 

  Kommandolinjen for webdesign: Ta tak i det grunnleggende

  I denne opplæringen lærer du alle nødvendigheter av å jobbe med en terminal eller kommandoprompt, inkludert hvordan du åpner den, hvordan du kjører kommandoer, hvordan du gjentar ...