Predgovor
Ko ustvarite spletno mesto z orodji umetne inteligence, kot so ChatGPT, Canva, Gemini Canvas, Claude Artifacts ali Sider Web Creator, je naslednje veliko vprašanje kako upravljati spletno gostovanje na GitHub Pages, da boste lahko obiskali spletno mesto prek svoje domene. Ta priročnik vas korak za korakom vodi skozi celoten postopek – od izvoza projekta v Sider Web Creator do popolnoma delujoče spletne strani pod vašo osebno domeno – pri tem pa razkriva skrivnosti spletnega gostovanja in konfiguracije GitHub Pages.
🎯 Kaj se boste naučili
Kako pravilno prenesti in razumeti datoteke projekta, ustvarjenega z umetno inteligenco, preden izberete potek dela spletnega gostovanja GitHub Pages.
Navodila po korakih za brezplačno objavo spletnega mesta na GitHub Pages.
Kako kupiti in povezati svojo domeno po meri v nastavitvah GitHub Pages ter jo povezati z najboljšimi zapisi DNS.
Profesionalni nasveti, da bo spletno mesto videti popolnoma profesionalno in vredno zaupanja, ko bo nastavitev GitHub Pages aktivna.
📥 1. korak: Prenesite svoje spletno mesto iz Sider Web Creator
Večina platform za statično gostovanje – vključno z GitHub Pages – pričakuje čisto mapo z gradnjo, zato morate najprej zbrati svoje datoteke.
1.1 Prenesite projektne datoteke
Ko Web Creator konča z ustvarjanjem spletnega mesta, kliknite gumb Download v zgornjem desnem kotu.
Počakajte, da sistem zapakira vaš projekt.
Prejeli boste datoteko .zip, pripravljeno za nalaganje na GitHub Pages.
Ekstrahirajte datoteko zip kamor koli na vašem računalniku.
1.2 Razumevanje strukture datotek (pomembno!)
my‑website/
├── dist/ ⭐ Produkcijska različica za **GitHub Pages**
│ ├── index.html → Domača stran
│ ├── assets/ → Slogi in skripte
│ └── …
├── src/ 📝 Mapa izvorne kode
├── package.json 📦 Konfiguracija projekta
└── …druge datoteke
Ključni opomnik: Na GitHub Pages se objavi samo vsebina znotraj dist/.
1.3 Lokalni predogled
Vstopite v mapo dist/.
Dvokliknite index.html.
Spletno mesto se odpre v vašem brskalniku.
Preverite, ali vse deluje, preden potisnete na GitHub Pages.
🚀 2. korak: Izberite platformo za objavo
Čeprav je GitHub Pages junak tega priročnika, je tukaj hitra primerjava:
| |
|---|
🌟 GitHub Pages (poudarek tega priročnika) | Popolnoma brezplačno • Objava s povleci in spusti ali git push • Brezplačen HTTPS • Globalni CDN • Domene po meri • Nativni CI z GitHub Actions |
| Globalno robno omrežje • 100 % brezplačno • Izjemno hitro |
| Izčiščen uporabniški vmesnik • Bogat s funkcijami |
📤 3. korak: Objava na GitHub Pages (podroben priročnik)
Čeprav GitHub Pages živi znotraj razvojne platforme, si ga predstavljajte kot ultra-moderno spletno gostovanje s priročnostjo pritiska na gumb.
3.1 Prijavite se in ustvarite repozitorij
Obiščite github.com in se prijavite.
Kliknite + New repository.
Poimenujte ga my‑website in izberite Public (ali Private, če imate plačljiv paket; GitHub Pages zdaj podpira zasebne repozitorije).
Pustite Initialize with README neoznačeno, če nameravate pozneje potisniti.
3.2 Dodajte datoteke svojega spletnega mesta
Metoda A: Nalaganje s povleci in spusti (najboljše za začetnike)
V zavihku Code repozitorija kliknite Add file → Upload files.
Spustite vse v dist/.
Pomaknite se navzdol in kliknite Commit changes.
Metoda B: Git CLI (najboljše za razvijalce)
# Kloniraj prazen repozitorij
git clone https://github.com/<user>/my‑website.git
cd my‑website
# Kopiraj izhod gradnje
cp -r /path/to/dist/* .
# Commit & push
git add .
git commit -m "Začetna objava **GitHub Pages**"
git push origin main
Ne glede na pot vam ostanejo statične datoteke v korenu repozitorija – kot nalašč za GitHub Pages.
3.3 Omogočite GitHub Pages
Pojdite na Settings → Pages.
Pod Source izberite Deploy from a branch → main (/root).
Kliknite Save. GitHub Pages gradi približno 30 sekund in vrne URL, kot je https://<user>.github.io/my‑website/.
3.4 Pridobite svoj privzeti URL
Obiščite povezavo, da potrdite, da se vse naloži. GitHub Pages samodejno streže prek globalnega CDN.
🌐 4. korak: Kupite in povežite svojo domeno
4.1 Kupite domeno
Predlagani registratorji (vsi se dobro razumejo z GitHub Pages): Namecheap, GoDaddy, Alibaba Cloud, Tencent Cloud. Izberite kratko .com, kjer je to mogoče.
4.2 Dodajte domeno v GitHub Pages
Še vedno v Settings → Pages, poiščite Custom domain.
Vnesite mywebsite.com ali www.mywebsite.com.
Kliknite Save. GitHub Pages samodejno zapiše datoteko CNAME.
4.3 Konfigurirajte zapise DNS
| | |
|---|
| | 185.199.108.153, 185.199.109.153, 185.199.110.153, 185.199.111.153
|
| | |
Počakajte 10 minut–24 ur za razširitev. Ti IP-ji so konstantni za GitHub Pages. |
4.4 Uveljavite HTTPS
Ko se DNS razširi, osvežite nastavitve Pages in preklopite Enforce HTTPS. Certifikati Let’s Encrypt se izdajo samodejno.
✨ 5. korak: Poskrbite, da bo spletno mesto videti profesionalno
5.1 Dodajte ikono Favicon po meri
Pripravite ikono velikosti 32 × 32 slikovnih pik z imenom favicon.ico.
Postavite jo v koren repozitorija.
Commit in push; GitHub Pages jo takoj postreže.
5.2 Vstavite meta informacije po meri
Uredite index.html v korenu repozitorija:
<meta name="description" content="Your website description on **GitHub Pages**">
<meta name="author" content="Your Name">
5.3 Analitika (izbirno)
Prilepite GA / Plausible izrezke znotraj <head>; GitHub Pages spoštuje glave predpomnilnika.
🔧 Odpravljanje težav
Prazna stran? Preverite, ali je index.html v korenu repozitorija in ali so poti do sredstev relativne.
Domena se zanka na .github.io? Ponovno preverite zapise A/CNAME in počakajte celoten TTL.
Preklop HTTPS onemogočen? DNS še ni pravilen; preverite z dig.
🎉 Povzetek
Čestitke! Zdaj imate:
✅ Uspešno ste prenesli spletno mesto, ustvarjeno z umetno inteligenco, pripravljeno za gostovanje na GitHub Pages.
✅ Brezplačno ste ga objavili na GitHub Pages.
✅ Zavarovali ste svojo domeno po meri.
✅ Izpopolnili ste okolje GitHub Pages, da je videti popolnoma profesionalno.
Vaše spletno mesto je zdaj:
🌐 Na spletu 24/7, poganja ga GitHub Pages CDN.
🏷️ Streženo pod profesionalno domeno.
🔒 Zaščiteno s šifriranjem HTTPS.
⚡ Globalno hitro zahvaljujoč robnim vozliščem GitHub Pages.
🗝️ V celoti v vaši lasti in pod vašim nadzorom.
💡 Naslednji koraki
Optimizacija SEO: dodajte ciljne ključne besede in meta opise, da povečate uvrstitve v iskanju za vašo nastavitev GitHub Pages.
Skupna raba v družabnih omrežjih: integrirajte gumbe za skupno rabo za glavne platforme.
Neprekinjene posodobitve: redno pošiljajte spremembe; GitHub Pages se samodejno znova objavi.
Varnostne kopije: omogočite zaščito repozitorija GitHub ali zrcalite repozitorij.
Zdaj ste pravi lastnik spletnega mesta – delite svojo povezavo GitHub Pages in pokažite svojo stvaritev svetu!
