GitHub Pages เป็นวิธีที่ยอดเยี่ยมในการสร้างเว็บไซต์ส่วนตัวของคุณเองตั้งแต่เริ่มต้น เป็นบริการฟรีและต้องมีบัญชี GitHub เท่านั้น อย่างไรก็ตาม โปรดทราบว่า GitHub Pages ไม่ได้นำเสนอการออกแบบที่ใช้งานง่ายที่สุดสำหรับการสร้างเว็บไซต์ (ต่างจาก Wix หรือ Squarespace) แต่เป็นวิธีที่ยอดเยี่ยมในการได้รับประสบการณ์กับ HTML/CSS/JS และองค์ประกอบทั้งหมดของเว็บไซต์ บทความวิกิฮาวนี้จะแนะนำวิธีการเริ่มต้นใช้งาน
ขั้นตอน
ขั้นตอนที่ 1 ลงทะเบียนบัญชีบน GitHub หากคุณยังไม่มี
ก่อนที่คุณจะสร้างเว็บไซต์ของคุณเองบนหน้า GitHub คุณต้องสร้างบัญชีบน GitHub หากคุณมีบัญชีบน GitHub แล้ว อย่าลืมเข้าสู่ระบบ สามารถเข้าถึงได้จากแถบเครื่องมือด้านบนขวา
ขั้นตอนที่ 2. สร้างที่เก็บบน GitHub
อย่าลืมตั้งชื่อที่เก็บ "[ชื่อผู้ใช้ GitHub ของคุณที่นี่].github.io" การดำเนินการนี้จะเริ่มต้นเว็บไซต์ GitHub ของคุณ
วิธีที่ 1 จาก 2: การใช้ตัวแก้ไขโค้ด
ขั้นตอนที่ 1 ดาวน์โหลดเดสก์ท็อป GitHub หากคุณยังไม่ได้ติดตั้ง
การติดตั้งเดสก์ท็อป GitHub ทำได้ง่ายเพียงแค่ไปที่ https://desktop.github.com/ และคลิกที่ปุ่ม "ดาวน์โหลด" สีม่วงขนาดใหญ่ จากนั้นเรียกใช้โปรแกรมติดตั้ง นี่เป็นสิ่งจำเป็นเพื่อผลักดันการเปลี่ยนแปลงไปยังที่เก็บของคุณ
ขั้นตอนที่ 2 ติดตั้งโปรแกรมแก้ไขโค้ด
คุณต้องมีหนึ่งอันเพื่อที่จะได้รับการเน้นไวยากรณ์บน GitHub ตัวเลือกยอดนิยม ได้แก่ Atom, Visual Studio Code, Sublime Text และ Notepad++ ที่ให้สัมผัสที่เต็มไปด้วยฟีเจอร์และความเรียบง่าย หลังจากติดตั้งตัวแก้ไขโค้ด คุณก็พร้อมที่จะเริ่มต้น
ขั้นตอนที่ 3 สร้างไฟล์ชื่อ "index.html"
คุณสามารถทำได้ในโปรแกรมแก้ไขโค้ดหรือทางออนไลน์ คุณยังสามารถไปที่ตำแหน่งของที่เก็บในฮาร์ดไดรฟ์ของคุณ และสร้างไฟล์ "index.html" ในโฟลเดอร์ของที่เก็บในไดรฟ์ของคุณ
ขั้นตอนที่ 4 เพิ่ม HTML ของคุณ
คุณจะต้องเรียนรู้ HTML เพื่อให้สามารถเขียนโค้ดหน้าเว็บพื้นฐานได้ นอกจากนี้ยังเป็นประโยชน์สำหรับคุณในการเรียนรู้ CSS และ JavaScript เพื่อให้คุณสามารถเพิ่มสไตล์และฟังก์ชันการทำงานให้กับหน้าเว็บของคุณได้
อย่าลืมบันทึกไฟล์
ขั้นตอนที่ 5. ยอมรับการเปลี่ยนแปลง
กลับไปที่เดสก์ท็อป GitHub และคลิกที่ปุ่มสีน้ำเงิน Commit to master จากนั้นคลิกที่ Push Origin การดำเนินการนี้จะอัปโหลดการเปลี่ยนแปลงไปยัง GitHub
หากคุณวางแผนที่จะทำการเปลี่ยนแปลงเพิ่มเติม คุณจะต้องการดึงจุดเริ่มต้นเช่นกัน คลิกที่ปุ่ม Pull Origin ในเดสก์ท็อป GitHub เพื่อดาวน์โหลดการคอมมิตล่าสุดไปยังเครื่องของคุณ
ขั้นตอนที่ 6 ดูหน้าเว็บของคุณ
ไปที่ "[ชื่อผู้ใช้ GitHub ของคุณที่นี่].github.io" ในเว็บเบราว์เซอร์ คุณอาจต้องเลี่ยงแคชของเบราว์เซอร์โดยกด Ctrl หรือ ⌘ Command ค้างไว้ขณะคลิกปุ่มรีเฟรชเพื่อดูหน้าเว็บใหม่
วิธีที่ 2 จาก 2: การใช้ GitHub Online
ขั้นตอนที่ 1. สร้างไฟล์ชื่อ "index.html"
คลิกที่ เพิ่มไฟล์ จากนั้นคลิกที่ สร้างไฟล์ใหม่ ซึ่งจะเป็นการเปิดตัวแก้ไขไฟล์ เพิ่ม "index.html" ลงในช่อง "ตั้งชื่อไฟล์ของคุณ"
ขั้นตอนที่ 2 เพิ่ม HTML ของคุณ
คุณจะต้องเรียนรู้ HTML เพื่อให้สามารถเขียนโค้ดหน้าเว็บพื้นฐานได้ นอกจากนี้ยังเป็นประโยชน์สำหรับคุณในการเรียนรู้ CSS และ JavaScript เพื่อให้คุณสามารถเพิ่มสไตล์และฟังก์ชันการทำงานให้กับหน้าเว็บของคุณได้
อย่าลืมบันทึกไฟล์
ขั้นตอนที่ 3 ยอมรับการเปลี่ยนแปลง
คลิกที่ปุ่มสีเขียว Commit new file เพื่อบันทึกไฟล์ไปที่ GitHub
ขั้นตอนที่ 4 ดูหน้าเว็บของคุณ
ไปที่ "[ชื่อผู้ใช้ GitHub ของคุณที่นี่].github.io" ในเว็บเบราว์เซอร์ คุณอาจต้องเลี่ยงแคชของเบราว์เซอร์โดยกด Ctrl หรือ ⌘ Command ค้างไว้ขณะคลิกปุ่มรีเฟรชเพื่อดูหน้าเว็บใหม่
เคล็ดลับ
- ในการเพิ่มหน้าย่อย เพียงแค่สร้างโฟลเดอร์ใหม่บน GitHub และเพิ่มไฟล์ "index.html" ลงในโฟลเดอร์นั้น
- หากคุณจดทะเบียนชื่อโดเมน คุณสามารถให้ GitHub Pages ใช้ชื่อโดเมนนั้นแทนค่าเริ่มต้นได้
- ที่เก็บเพจ GitHub ต้องเป็นแบบสาธารณะ ยกเว้นในกรณีที่คุณมีบัญชีพรีเมียม
