Membuat Register Atau Login Blogger Dengan Javascript Khusus Firebase Authentication

Table of Contents

Cara buat fitur login di blogger, cara membuat fitur login di blogger pakai Firebase, download kode html javascript fitur login di blogger dengan firebase Authentication.

Banyak yang bertanya kepada saya, apakah bisa membuat fitur login di blogspot (blogger) ?. Ya tentu saja bisa, pada kesempatan kali saya akan membahasnya untuk kamu membuat fitur login di blogger.

Meski di blogspot gak ada fitur login buat pengguna asli bawaannya seperti di wordpress . Namun pengguna blogger bisa membuat fitur login di blogger/blogspot juga loh.

Dan untuk membuat fitur login di blogger itu ternyata sangat mudah, gak sulit-sulit amat loh. Kamu hanya cukup melakukan beberapa langkah saja untuk bisa menampilkan fitur login di blogger tersebut.

Yang Harus Disiapkan Membuat Fitur Login Di Blogger

Perlu kamu ketahui apa saja yang harus disiapkan untuk membuat fitur login Authentication di blogger. Berikut saya sudah merangkumnya buat kamu.

1. Memiliki Akun Blogger 

pertama yang harus disiapkan untuk membuat fitur login di blogger ya pastinya kamu harus memiliki blog dari blogger/blogspot.

Pastikan Blogger kamu sudah terpublikasi, dan bisa di akses secara online oleh siapapun agar fitur login di blogspot kamu nantinya bisa berfungsi.

2. Akun Firebase yang sudah di setting 

Kedua untuk membuat fitur login di blogger, kamu harus memiliki akun Firebase yang sudah di setting ke Authentication. Jika kamu belum memahami cara menyetting Firebase Authentication untuk blogger, tenang saja karena saya akan membahasnya nanti di bawah.

Fungsi Firebase sendiri , sebagai server yang sama-sama dari google yang digunakan untuk Authentication. Dimana pengunjung blogspot bisa melakukan login / register akun blog kamu yang nantinya data mereka akan disimpan di Firebase.

3. Html javascript kusus fitur login buat Blogger 

Terakhir, setelah kamu melakukan 2 langkah yang saya sebutkan barusan. Berikutnya kamu harus membuat fitur html javascript kusus yang berfungsi sebagai jalan yang menghubungkan antara blogger dan Firebase Authentication saat pengunjung blog kamu melakukan login ataupun register.

Jika kamu gak memahami cara membuat html javascript untuk fitur login di blogger. Kamu tenang saja, karena saya juga akan membagikan kode tersebut secara gratis yang nantinya bisa kamu modifikasi berdasarkan blogger dan akun Firebase kamu.

Membuat Fitur Login Di Blogger Dari Nol Hingga Berfungsi 

Oke selanjutnya mari kita buat fitur di blogger kamu dari nol hingga benar-benar berfungsi. Oke sebelum lanjut, siapkan rokok, dan kopi hitam dulu biar otak kamu lebih fresh 🤣.

Oke berikut adalah langkah-langkah membuat fitur login di blogger kamu dari nol hingga benar-benar berfungsi.

1. Membuat Blog Di Blogspot 

Di langkah ini gak perlu saya jelasin panjang kali lebar ya, saya sudah tau kalau kamu memiliki blog di blogspot dan sedang mencari cara membuat fitur login di platfrom Blogger.

Oke langsung saja ke langkah berikutnya saja ya 😂.

2. Membuat Authentication Di Firebase 

Nah selanjutnya kita buat dilu fitur login Authentication di Firebase terlebih dahulu. Untuk mengaktifkan fitur login di blogger saat membuat widget login/register tersebut di blogspot.

1. Pertama silahkan buat projek dahulu di console.firebase.google.com 
   
   
   
   
   
2. Kemudian kamu pilih web apps , pilih saja icon yang saya beri tanda panah ya solv. 
   
   
   



3. Lalu buat app nickname dan centang seperti di gambar ya.
   
   Kemudian klik tombol register apps



4. Kemudian pada gambar berikut, centang seperti yang dicentang di dalam gambar.
   
   Kemudian klik next >> next lagi >> continue to console



5. Lalu saat sudah berhasil masuk ke console klik Authentication seperti yang ada di gambar.



6. Kemudian pilih menu gett starterd seperti yang ada di gambar .
   
   Catatan:maaf ada coretan merah, di editan gambar.



7. Lalu pilih bagaimana pengguna blogspot kamu melakukan login dan registrasi. Disini saya sarankan memilih ( email / pasword dan google )
   
   
   
Oke kamu klik saja dua fitur itu jika ada tombol centang, kalian centang dan save saja.


8. Kemudian klik pengaturan >> klik domain resmi >> tambahkan domain resmi. 
   
   
   
Padaa saat menambahkan nama domain masukan contoh namadomain.com jadi tanpa www ya.

Contohnya seperti gambar berikut: 

Oke sobat, sekarang kamu dan saya berhasil membuat proyek Firebase Authentication. Langkah selanjutnya mari kita temukan kode javascript SDK dari Firebase Authentication.

Berikut adalah cara menemukan kode login Firebase Authentication:

1. Tekan tombol icon pengaturan kemudian klik pengaturan proyek. 
   
   
   
2.  Kemudian scroll kebawah dan centang konfigurasi seperti gambar dibawah. Nantinya kamu akan menemukan kode seperti contoh



3. Lalu save kode seperti yang saya contohkan

const firebaseConfig = {

  apiKey: "AIzaSyBmIAjWUKY4cJuAJ6J_axanDr7h_8DElug",

  authDomain: "carangeblogdotcom.firebaseapp.com",

  projectId: "carangeblogdotcom",

  storageBucket: "carangeblogdotcom.appspot.com",

  messagingSenderId: "489110980270",

  appId: "1:489110980270:web:da3df6d49ec18234014f3f",

  measurementId: "G-T5BF0YE3P1"

};

Oke jika kamu sudah menemukan kode agar fitur login di blogger kamu nantinya berfungsi, lalu langsung saja save kodenya.

Membuat Fitur Login Di Blogger/Blogspot Dengan Html Javascript Khusus Firebase Authentication 

Selanjutnya, silahkan kamu Download Kode Html Javascript Kusus Menampilkan Fitur Login Di Blogger.

Oke langsung saja kamu klik tombol download dibawah >> lalu ikuti panduan step by step cara melakukan modifikasi kodenya yang sudah tertera di dokumentasi.DOWNLOAD DISINI

Setelah kamu download,  kodenya kamu tinggal pasang kode api Firebase nya di kode yang sudah kamu download.

Di file kodenya sudah ada dokumentasi panduanya kamu tinggal ikuti ajaa panduanya.

Jadi itulah tutorial lengkap cara membuat fitur register/login di blogger yang bisa kamu ikuti dari tutorial saya ini. Mudah-mudahan artikel saya ini bermanfaat.