Hugoga alustamine: kuidas luua lihtsat veebisaiti

Hugo on staatiline saidigeneraator, mis võimaldab teil luua veebisaidi vähese kodeerimiskogemusega või ilma selleta. Veebisaidi kujundamisel saate kasutada eelnevalt loodud teemasid. See võimaldab teil keskenduda rohkem saidi täitmisele oma sisuga.

Kuna Hugot kasutatakse enamasti staatiliste veebisaitide jaoks, sobib see suurepäraselt ajaveebi, portfoolio või dokumentatsioonisaitide loomiseks.

Saate hõlpsasti seadistada ja luua Hugo veebisaiti, kasutades eelnevalt ehitatud Hugo teemat. Vaid mõne lühikese sammuga saate seejärel Markdowni abil oma veebisaidile sisu ja lehti lisada.

Kuidas Hugot installida

Peate installima Hugo staatilise saidi generaator Hugo veebisaidi loomiseks, käitamiseks ja testimiseks. Vastavalt Hugo dokumentatsioon, saate selle installida mitmel viisil. Allpool on mõned valikud.

Mac

Saate installida Hugo Homebrew'i abil.

1. Avage oma macOS-i terminal.
2. Installige Homebrew paketihaldur.

   /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

3. Installige Hugo.

   pruulima installida hugo

Windows

Vajate Windowsi jaoks samaväärset paketihaldurit. Näiteks võite kasutada Scoopi paketihaldur.

1. Avage Windows PowerShell, mis peaks juba olema teie Windowsi operatsioonisüsteemi osa.
2. Kui installite Scoopi esimest korda, peate võib-olla määrama oma täitmispoliitika.

   Määra-ExecutionPolicy RemoteSigned -ulatus Praegune kasutaja

3. Install Scoop:

   iex (uus-object net.webclient).downloadstring('https://get.scoop.sh')
   

4. Installige Hugo:

   kühvel installida hugo

Kuidas luua Hugo projekti

Uue Hugo projekti loomiseks peate kasutama sisseehitatud hugo uus sait käsk.

1. Avage terminal või käsuviip. Liikuge kausta, kuhu soovite oma projekti luua.
2. Täitke hugo uus sait käsk:

   hugo uus sait uus-hugo-veebisait

3. Liikuge failiuurijas oma Hugo projekti asukohta.
4. Avage projekti kaust. Näete, et teie uuel Hugo veebisaidil on teie veebisaidi töötamiseks vajalik faili- ja kaustastruktuur.

Kuidas lisada teemat

Praegu sisaldab teie projekt ainult Hugo projekti põhikaustasid. Veebisaidi kohalikul käivitamisel kuvatakse sel hetkel ainult tühi ekraan. Kuna teie veebisaidi jaoks pole veel HTML-i, CSS-i ega kasutajaliidese kujundusi seadistatud, peate need lisama.

Hugo pakub juba sisseehitatud raamatukogu Hugo teemad arendajate loodud.

1. Valige teema, mis teile meeldib. Igal teemal võivad olla veidi erinevad seadistusjuhised, mis on näidatud vastaval eelvaate lehel. Selles õpetuses kasutatakse Jutu teema näitena.
2. Liikuge terminalis või käsureal oma projekti juurkausta.

   cd uus-hugo-veebisait

3. Käivitage Tale'i teema lisamiseks käsk. Teema saate lisada alammoodulina, mis loob uue kausta nimega lugu sees teema kausta.

   git init
   git alammoodul lisa https://github.com/EmielH/tale-hugo.git themes/tale

   Teise võimalusena saate GitHubi lugude hoidla oma projekti teemade kausta kloonida.

   git kloon https://github.com/EmielH/tale-hugo.git themes/tale

4. Liikuge oma projekti kausta. Klõpsake nuppu teemad kausta selle avamiseks. Sõltumata sellest, millist käsku kasutasite, tuleb uus lugu kaust, mis salvestab äsja allalaaditud teema.
5. Aastal config.toml faili, lisage konfiguratsiooni osana jututeema. See käsib Hugol kasutada HTML-i, CSS-i ja muid stiile, mida Tale'i teema sisaldab.

   teema = "lugu"

Kuidas oma veebisaidile lehti lisada

Saate kirjutada oma sisu mis tahes vormingus, mida Hugo aktsepteerib. Seejärel teisendab Hugo teie failid kasutajale edastades automaatselt HTML-failideks. See muudab selle kiireks nii ehitamise kui ka juurutamise. See näide kasutab Markdown, lihtne lihtteksti keel, teie sisu vorminguna.

Saate kirjutada Markdowni enamasti lihtsas inglise keeles, millele on lisatud mõned sümbolid mis tahes vormingu määramiseks. See hõlmab pealkirjade tähistamiseks sümbolite lisamist, paksus kirjas sõnu või mis tahes muud põhivormingut, mida vajate.

Uue alamlehe või postituse lisamiseks oma veebisaidile peate lisama uue Markdowni faili sisu kausta. Igal postitusel või lehel on sellega seotud oma Markdowni fail.

1. Ava sisu kausta oma Hugo projekti sees. Looge uus Markdowni fail nimega myFirstPost.md.
2. Avage fail mis tahes tekstiredaktoris, näiteks Notepad++ või Visual Studio Code.
3. Lisage faili ülaossa mõned metaandmed. See sisaldab postituse kohta olulist teavet. Teie kasutatav teema vormistab selle teabe lehel teatud viisil.

   
   autor: "Sinu nimi"
   pealkiri: "Minu esimene postitus"
   kuupäev: "2022-05-17"
   

4. Pärast metaandmete lisamist saate hakata Markdowni abil sisu lisama.

   See on minu esimene postitus minu Hugo veebisaidil!
   Kasutatakse Hugo teemat jaokssee saidi nimi on Tale.
   See on väga lihtne paigaldada ja seadistada.
   # Alampealkiri
   See on mingi sisu.
   # Veel üks alapealkiri
   See on rohkem sisu.

5. Oma veebisaidile lehtede lisamiseks võite vabalt lisada allahindlusfaile.

Kuidas oma Hugo veebisaiti kohapeal käivitada ja testida

Veebisaidi käitamiseks kasutage hugo serveeri käsk.

1. Avage terminal või käsurida.
2. Liikuge oma Hugo projekti juurkausta.
3. Käivitage hugo serveeri käsk:

   hugo serveeri

4. Oodake, kuni veebisait lõpetab käivitusprotsessi. Kui see on lõpetatud, prindib terminal sõnumi, mis ütleb, millise kohaliku aadressi kaudu saate veebisaidile juurde pääseda. Tavaliselt on see http://localhost: 1313/.
5. Avage veebibrauser ja sisestage http://localhost: 1313/või mis tahes aadressi, mille terminal teile andis. Näete oma Hugo veebisaidi avalehte.
6. Lehel on iga teie allahindlusfaili postituste loend. Sel juhul on sisuga täidetud kaks allahindlusfaili. See hõlmab ka lehte myFirstPost.md, mille te varem tegite. See sisaldab ka uut postitust nimega bananaCakeRecipe.md.
7. Klõpsake ühe eelvaate pealkirja lingil. See viib teid selle konkreetse postituse täislehele.

Teie Hugo veebisaidi hostimine

Staatilise veebisaidi käivitamine ja käivitamine on Hugoga lihtne ja kiire. Saate kasutada ja konfigureerida eelehitatud teemasid ning käivitada oma Hugo veebisaiti kohapeal testimiseks. Markdowni abil saate oma veebisaidile lisada ka sisulehti.

Kui olete oma Hugo veebisaidi loonud, võite hakata selle hostimise kohta lisateavet õppima. Saate valida paljude tasuta veebisaidi hostimisvõimaluste hulgast, näiteks Dropbox, Google Drive või OneDrive.

Kuidas saada tasuta veebisaidi hostimist Dropboxi, Google Drive'i või OneDrive'i abil

Loe edasi