Hur man skapar en blogg med Hugo

Introduktion

Hugo är en statisk webbplatsgenerator med blixtsnabb renderingshastighet och utmärkt användarvänlighet. Tack vare alla dess innehållsorienterade funktioner kan du alltid fokusera på att skapa innehåll snarare än att bygga miljön:

• Med Hugo kan du bygga en statisk webbplats som körs var som helst på flera minuter utan att behöva oroa dig för tråkiga beroenden eller databaser.
• Du kan komponera ditt innehåll i Markdown, den mest bekväma skrivstilen, och omedelbart se ändringarna du har gjort på webben.
• Dessutom kan du få ut det mesta av Hugos rika temaförråd och snabbt växande community.

I den här handledningen kommer jag att visa dig hur du installerar och använder Hugo för att bygga en statisk bloggsida på en CentOS-baserad Vultr LEMP-serverinstans.

Förutsättningar

Logga in på din instans som en icke-root-användare med sudo-behörigheter. Se hur du skapar en sådan användare i den här artikeln .

Steg 1: Installera Hugo-programmet

Hugo kan installeras på nästan alla vanliga plattformar. För CentOS behöver du bara ladda ner den senaste programfilen i ett .tar.gzarkiv och packa upp den till en lämplig plats. I skrivande stund är den senaste versionen 0.15.

sudo yum update -y
sudo yum install git -y
cd ~
wget https://github.com/spf13/hugo/releases/download/v0.15/hugo_0.15_linux_amd64.tar.gz
tar -zxvf hugo_0.15_linux_amd64.tar.gz
sudo mv hugo_0.15_linux_amd64/hugo_0.15_linux_amd64 /usr/local/bin/hugo

Testa din installation med följande kommando:

 hugo version

Steg 2: Bygg din webbplats

Med Hugo kan du bygga din webbplats från vilken mapp som helst på din server. Här byggde jag en webbplats i katalogen mysite/under min hemkatalog.

cd ~
hugo new site ~/mysite

Kör följande kommandon för att se webbplatsens arkitektur:

cd mysite
ls -lF

Som du ser liknar webbplatsens nuvarande arkitektur:

archetypes/

config.toml

content/

data/

layouts/

static/

Med ytterligare två kataloger som ska skapas themes/och public/, är hela arkitekturen för en Hugo-webbplats kompakt men ändå heltäckande.

Till att börja med, vet att ditt innehåll bör lagras i katalogen content/.

Steg 3: Installera teman från Hugo-förvaret

För att installera alla teman från Hugo-förvaret, kör följande kommandon. Dessa kommer att skapa en katalog som heter themes/i din webbplatskatalog och laddar ner alla teman från Hugo temarepo.

cd ~/mysite/
git clone --depth 1 --recursive https://github.com/spf13/hugoThemes.git themes

Om du bara vill installera ett enstaka tema, besök Hugo temarepo för att bestämma ditt favorittema. Kopiera dess URL och klistra in den i git clonekommandot nedan.

cd ~/mysite/
mkdir themes
cd themes
git clone https://github.com/jaden/twentyfourteen

Steg 4: Gör några grundläggande konfigurationsändringar

Filen som namnges config.tomli din webbplatskatalog innehåller den globala konfigurationen för din Hugo-webbplats. Redigera filen med en textredigerare för att göra några grundläggande konfigurationsändringar enligt listan nedan. Kom ihåg att byta ut värdena enligt dina specifika förutsättningar.

baseurl = "http://[YourSiteIP]/"
languageCode = "en-us"
title = "Your Site Name"
theme = "twentyfourteen"

Steg 5: Komponera ditt innehåll

Ange följande kommando i din webbplatskatalog för att skapa en innehållssida i katalogen ~/mysite/content/post/.

cd ~/mysite/
hugo new post/about.md

Öppna filen i en textredigerare, formatet på filen ska likna följande.

+++
date = "2015-12-25T03:21:23Z"
draft = true
title = "about"

+++

Mellan de två raderna +++ligger metainformationen om din innehållssida. Här kan du ta bort raden draft = trueoch ändra titelraden som du vill.

Under den andra +++raden lägger du till innehållet som du vill visa på webbsidan. Kom ihåg att skriva ditt innehåll på Markdown-språket.

## This is an H2 headline

Text goes here.

När du är klar med denna redigering, håll textredigeraren öppen för senare användning.

Steg 6: Justera ditt innehåll med Hugo-servern

Du kan använda Hugos inbyggda webbserver för att distribuera din webbplats, som omedelbart kan visa dina ändringar på webbsidan så fort du ändrar ditt innehåll i en textredigerare.

Öppna en annan terminal, konfigurera iptablesreglerna för att tillåta din åtkomst till din webbplats på Hugo-serverns standardport 1313:

sudo iptables -I INPUT -p tcp --dport 1313 -j ACCEPT

Starta Hugo-servern:

hugo server --bind="[YourServerIP]"

Besök din webbplats från en webbläsare:

http://[YourServerIP]:1313

Nu kan du försöka redigera innehållet i sidfilen i föregående terminal eller lägga till/ta bort en sidfil. Du kommer att upptäcka att alla ändringar i content/katalogen kommer att återspeglas samtidigt på din webbläsarskärm. Detta är en fantastisk funktion för en upptagen bloggare eftersom du alltid omedelbart kan se dina ändringar för bättre komponerande upplevelser.

När du är klar med redigeringen, tryck på för Ctrl+Catt stoppa Hugo-servern.

Steg 7: Publicera din webbplats

Nu är det dags att publicera din webbplats på webben. Kör följande kommandon och Hugo kommer att generera allt statiskt innehåll som är lämpligt för publicering i public/katalogen.

cd ~/mysite
hugo

Obs! Hugo kommer inte att radera gamla filer som genererades tidigare när du kör kommandona ovan. För att undvika oväntade resultat kan du alltid ta bort public/katalogen innan du kör hugokommandot eller ange en ny utdatadestination som visas i följande kommando.

hugo --destination=public2

Eftersom Nginx-webbservern redan har körts på servern, är allt du behöver göra att kopiera innehållet i ~/mysite/public/katalogen eller andra anpassade destinationskataloger till din webbkatalog /usr/share/nginx/html/.

Ta bort originalfilerna:

cd /usr/share/nginx/html/
sudo rm -rf background.jpg index.php logo.png

Kopiera dina statiska webbplatsfiler till webbkatalogen:

cd ~/mysite/public
sudo cp -R ~/mysite/public/. /usr/share/nginx/html/

Det är allt. Nu kan du besöka din supersnabba statiska webbplats från din webbläsare: http://[YourServerIP].

För att se mer information, använd kommandot hugo helpeller besök Hugos officiella webbplats .