Hallo sahabat telatngoding pada kesempatan kali ini saya akan berbagi tutorial Cara Membuat Realtime Viewer Di Blogger Plus UI dengan mudah.
Pada template plus ui terdapat fitur realtime viewer yang bisa di pasang dengan mudah, beda dengan median ui muaupun fletro pro original yang tidak mendapati fitur tersebut.
Realtime viewer ini bisa anda lihat pada homepage plus ui, disitu terdapat fitur jumlah pengunjung yang membuka artikel anda atau pengunjung yang membaca artikel anda dengan masing masing artikel sesuai pengunjung.
Biasanya fitur ini terdapat pada template premium atau template berbayar, karena untuk membuat fitur ini di perlukan dasar dasar coding.
Realtime viewer ini berfungsi untuk melihat seberapa ramai pengunjung yang membaca artikel kita hanya dengan melihat di homepagenya saja.
Cara Membuat Realtime Viewer Di Blogger Plus UI
Untuk bisa membuat realtime viewer pada template plus ui ini di perlukan database dari firebase.
- Silahkan login ke Firebase
- Klik tombol Mulai
- Klik Create a project ( buat project baru )
- Buat nama project anda lalu centang bagian I Accept the firebase terms dan I confirm that I will use Firebase exclusively for purposes relating to my trade, business, craft, or profession. Lalu klik Continue
- Pada bagian ini biarkan saja dan silahkan klik Continue
- Pilih lokasi analytic anda lalu centang pada I accept the Google Analytics terms dan klik create a project.
- Jika proses sudah selesai silahkan klik Build dan pilih Realtime Database
- Lanjut, anda akan di arahkan ke pembuatan database, silahkan klik create database
- Pilih lokasi database yang anda buat, saya saranin antara United States atau Singapur, jika sudah silahkan klik Next
- Pada bagian ini biarkan saja pada Start in locked mode dan klik Enable
- Jika sudah maka akan keluar gambar seperti di bawah ini, silahkan klik Rules
- Maka akan keluar gambar seperti dibawah ini
- Selanjutnya silahkan hapus kode yang ada di Rules dan salin kode dibawah ini lalu letakan di bagian Rules.
{
"rules": {
".read": true,
"BlogID_0000000000000000000": {
".read": true,
"$post_id": {
".write": "newData.exists() && (data.exists() ? newData.val() == data.val() + 1 : newData.val() == 1)",
".validate": "newData.isNumber() && newData.val() % 1 === 0.0 && newData.val() <= 99999999"
}
}
}
}- Ganti BlogID 000000000000000 dengan ID Blog anda.
- Jika sudah silahkan klik Publish
- Sekarang klik bagian Data lalu salin kode yang ada di box, lihat gambar di bawah ini
- Sekarang masuk ke blog anda dan pilih Edit HTML, cari kode di bawah ini
realViews: {- Maka anda akan menemukan kode seperti di bawah ini
realViews: {
databaseUrl: "https",
abbreviation: "true"
},- Silahkan letakan kode yang anda salin di database firebase ke bagian kode databaseUrl ( Letakan pada bagian Https )
- Simpan template anda dan selesai