Įžanga
Sukūrus svetainę naudojant AI įrankius, tokius kaip ChatGPT, Canva, Gemini Canvas, Claude Artifacts arba Sider Web Creator, kitas svarbus klausimas yra kaip tvarkyti žiniatinklio prieglobą „GitHub Pages“, kad galėtumėte pasiekti svetainę per savo domeną. Šis vadovas žingsnis po žingsnio nuves jus per visą procesą – nuo projekto eksportavimo iš Sider Web Creator iki visapusiškos svetainės, veikiančios jūsų asmeniniu domenu, – tuo pačiu išaiškindamas tiek žiniatinklio prieglobos, tiek „GitHub Pages“ konfigūracijos subtilybes.
🎯 Ką išmoksite
Kaip teisingai atsisiųsti ir suprasti AI sugeneruotus projekto failus prieš pasirenkant „GitHub Pages“ žiniatinklio prieglobos darbo eigą.
Žingsnis po žingsnio instrukcijos, kaip nemokamai patalpinti svetainę „GitHub Pages“.
Kaip įsigyti ir susieti savo pasirinktinį domeną „GitHub Pages“ nustatymuose ir prijungti jį prie geriausios praktikos DNS įrašų.
Profesionalūs patarimai, kaip padaryti, kad svetainė atrodytų visiškai profesionaliai ir patikimai, kai „GitHub Pages“ nustatymas bus aktyvus.
📥 1 žingsnis: Atsisiųskite savo svetainę iš Sider Web Creator
Dauguma statinio prieglobos platformų, įskaitant „GitHub Pages“, tikisi švaraus kompiliavimo aplanko, todėl pirmiausia turite surinkti savo failus.
1.1 Atsisiųskite projekto failus
Kai Web Creator baigs generuoti svetainę, spustelėkite mygtuką Atsisiųsti viršutiniame dešiniajame kampe.
Palaukite, kol sistema supakuos jūsų projektą.
Gausite .zip failą, paruoštą įkelti į „GitHub Pages“.
Išarchyvuokite zip failą bet kur savo kompiuteryje.
1.2 Supraskite failų struktūrą (svarbu!)
my‑website/
├── dist/ ⭐ Gamybinis kompiliavimas, skirtas **GitHub Pages**
│ ├── index.html → Pagrindinis puslapis
│ ├── assets/ → Stiliai ir scenarijai
│ └── …
├── src/ 📝 Šaltinio kodo aplankas
├── package.json 📦 Projekto konfigūracija
└── …kiti failai
Svarbus priminimas: Tik turinys, esantis dist/, yra publikuojamas „GitHub Pages“.
1.3 Vietinės peržiūros testas
Įeikite į aplanką dist/.
Dukart spustelėkite index.html.
Svetainė atsidarys jūsų naršyklėje.
Patikrinkite, ar viskas veikia, prieš perkeliant į „GitHub Pages“.
🚀 2 žingsnis: Pasirinkite diegimo platformą
Nors „GitHub Pages“ yra šio vadovo herojus, pateikiame greitą palyginimą:
| |
|---|
🌟 GitHub Pages (pagrindinis šio vadovo akcentas) | Visiškai nemokama • „Drag-and-drop“ arba git push diegimas • Nemokamas HTTPS • Pasaulinis CDN • Pasirinktiniai domenai • Vietinis CI su „GitHub Actions“ |
| Pasaulinis Edge tinklas • 100 % nemokama • Žaibiškai greita |
| Patogi vartotojo sąsaja • Funkcijų gausa |
📤 3 žingsnis: Diegimas į „GitHub Pages“ (išsamus vadovas)
Nors „GitHub Pages“ gyvena kūrėjų platformoje, pagalvokite apie tai kaip apie itin modernų žiniatinklio prieglobą su patogumu vienu mygtuko paspaudimu.
3.1 Užsiregistruokite ir sukurkite saugyklą
Apsilankykite github.com ir prisijunkite.
Spustelėkite + New repository.
Pavadinkite ją my‑website ir pasirinkite Public (arba Private, jei turite mokamą planą; „GitHub Pages“ dabar palaiko privačias saugyklas).
Palikite Initialize with README nepažymėtą, jei planuojate perkelti vėliau.
3.2 Pridėkite savo svetainės failus
A metodas: „Drag-and-Drop“ įkėlimas (geriausia pradedantiesiems)
Saugyklos skirtuke Code spustelėkite Add file → Upload files.
Įkelkite viską, kas yra dist/.
Slinkite žemyn ir spustelėkite Commit changes.
B metodas: Git CLI (geriausia kūrėjams)
# Klonuokite tuščią saugyklą
git clone https://github.com/<user>/my‑website.git
cd my‑website
# Nukopijuokite kompiliavimo išvestį
cp -r /path/to/dist/* .
# Įvykdykite ir perkelkite
git add .
git commit -m "Initial **GitHub Pages** deploy"
git push origin main
Bet kuris kelias palieka jums statinius failus saugyklos šaknyje – puikiai tinka GitHub Pages.
3.3 Įgalinkite „GitHub Pages“
Eikite į Settings → Pages.
Skiltyje Source pasirinkite Deploy from a branch → main (/root).
Spustelėkite Save. „GitHub Pages“ sukompiliuoja per ~30 s ir grąžina URL, pvz., https://<user>.github.io/my‑website/.
3.4 Gaukite savo numatytąjį URL
Apsilankykite nuorodoje, kad patvirtintumėte, jog viskas įkeliama. „GitHub Pages“ automatiškai teikia per pasaulinį CDN.
🌐 4 žingsnis: Įsigykite ir susiekite savo domeną
4.1 Įsigykite domeną
Siūlomi registratoriai (visi gerai veikia su „GitHub Pages“): Namecheap, GoDaddy, Alibaba Cloud, Tencent Cloud. Jei įmanoma, pasirinkite trumpą .com.
4.2 Pridėkite domeną „GitHub Pages“
Vis dar būdami Settings → Pages, raskite Custom domain.
Įveskite mywebsite.com arba www.mywebsite.com.
Spustelėkite Save. „GitHub Pages“ automatiškai įrašo CNAME failą.
4.3 Konfigūruokite DNS įrašus
| | |
|---|
| | 185.199.108.153, 185.199.109.153, 185.199.110.153, 185.199.111.153
|
| | |
Palaukite 10 min.–24 val., kol bus paskleista. Šie IP adresai yra pastovūs „GitHub Pages“. |
4.4 Įdiekite HTTPS
Kai DNS bus paskleistas, atnaujinkite Pages nustatymus ir perjunkite Enforce HTTPS. „Let’s Encrypt“ sertifikatai išduodami automatiškai.
✨ 5 žingsnis: Padarykite, kad svetainė atrodytų profesionaliai
5.1 Pridėkite pasirinktinę piktogramą
Paruoškite 32 × 32 px piktogramą pavadinimu favicon.ico.
Įdėkite ją į saugyklos šaknį.
Įvykdykite ir perkelkite; „GitHub Pages“ ją iškart pateikia.
5.2 Įterpkite pasirinktinę meta informaciją
Redaguokite index.html saugyklos šaknyje:
<meta name="description" content="Your website description on **GitHub Pages**">
<meta name="author" content="Your Name">
5.3 Analizė (nebūtina)
Įklijuokite GA / Plausible fragmentus į <head>; „GitHub Pages“ atsižvelgia į talpinimo antraštes.
🔧 Trikčių šalinimas
Tuščias puslapis? Patvirtinkite, kad index.html yra saugyklos šaknyje, o turto keliai yra santykiniai.
Domenas nukreipia į .github.io? Dar kartą patikrinkite A/CNAME įrašus ir palaukite visą TTL.
HTTPS perjungimas išjungtas? DNS dar nėra teisingas; patikrinkite naudodami dig.
🎉 Santrauka
Sveikiname! Jūs dabar:
✅ Sėkmingai atsisiuntėte AI sugeneruotą svetainę, paruoštą talpinti „GitHub Pages“.
✅ Nemokamai patalpinote ją „GitHub Pages“.
✅ Apsaugojote savo pasirinktinį domeną.
✅ Patobulinote „GitHub Pages“ aplinką, kad ji atrodytų visiškai profesionaliai.
Jūsų svetainė dabar:
🌐 Pasiekiama internete 24 valandas per parą, 7 dienas per savaitę, ją palaiko „GitHub Pages“ CDN.
🏷️ Pateikiama profesionaliu domenu.
🔒 Apsaugota HTTPS šifravimu.
⚡ Pasauliniu mastu greita dėl „GitHub Pages“ Edge mazgų.
🗝️ Visiškai valdoma jūsų.
💡 Kiti žingsniai
SEO optimizavimas: pridėkite tikslinių raktinių žodžių ir meta aprašymų, kad pagerintumėte paieškos reitingus savo „GitHub Pages“ sąrankai.
Dalijimasis socialiniuose tinkluose: integruokite bendrinimo mygtukus pagrindinėms platformoms.
Nuolatiniai atnaujinimai: reguliariai įvykdykite pakeitimus; „GitHub Pages“ automatiškai iš naujo diegia.
Atsarginės kopijos: įgalinkite „GitHub“ saugyklos apsaugą arba atspindėkite saugyklą.
Dabar esate tikras svetainės savininkas – pasidalykite savo „GitHub Pages“ nuoroda ir parodykite savo kūrinį pasauliui!
