Langkah-Langkah Implementasi
Ikuti urutan langkah di bawah ini untuk menghubungkan GitHub Pages Anda ke domain kustom.
Siapkan Repository GitHub Pages
Pastikan Anda sudah memiliki kode website HTML/CSS/JS di dalam repository GitHub.
- Buat repository baru di GitHub.
- Upload file website Anda (pastikan ada file
index.html). - Buka menu Settings > Pages di repository tersebut.
- Pada bagian Build and deployment, pilih branch
main(atau master), lalu klik Save. - Tunggu beberapa saat hingga muncul URL GitHub Pages Anda (misal:
https://username.github.io/repo/).
Tambahkan Custom Domain di GitHub
Beri tahu GitHub bahwa Anda akan menggunakan domain kustom untuk halaman ini.
- Masih di menu Settings > Pages.
- Scroll ke bawah ke bagian Custom domain.
- Masukkan nama domain Anda (misal:
www.domainanda.comataudomainanda.com). - Klik tombol Save. (Proses ini akan otomatis membuat file bernama
CNAMEdi repository Anda).
Catatan: Status DNS check mungkin akan error/pending pada tahap ini. Hal ini wajar karena kita belum mengatur DNS di cPanel.
Konfigurasi DNS di cPanel
Sekarang buka dashboard cPanel dari provider hosting/domain Anda untuk mengarahkan domain ke GitHub.
- Login ke cPanel Anda.
- Cari dan buka menu Zone Editor (atau Advanced Zone Editor).
- Klik Manage pada domain yang ingin Anda atur.
A. Mengatur A Record (Untuk root domain: domainanda.com)
Tambahkan 4 buah A Record yang mengarah ke IP Address GitHub Pages:
185.199.108.153
185.199.109.153
185.199.110.153
185.199.111.153
B. Mengatur CNAME (Untuk subdomain: www.domainanda.com)
Buat atau edit record CNAME untuk www dan arahkan ke URL GitHub Anda:
Name: www.domainanda.com
Type: CNAME
Record: username.github.io
Verifikasi & Aktifkan HTTPS
Setelah menyimpan pengaturan DNS di cPanel, Anda perlu menunggu masa propagasi DNS (biasanya beberapa menit hingga 24 jam).
- Kembali ke GitHub, buka Settings > Pages.
- Cek bagian Custom Domain. Jika DNS sudah terpropagasi, statusnya akan berubah menjadi DNS check successful.
- Centang kotak Enforce HTTPS agar website Anda aman dan memiliki gembok hijau di browser.
- Selesai! Website Anda sekarang dapat diakses melalui custom domain.