Sistem penghitung jumlah pengunjung menggunakan Google Sheet sebagai database pengunjung (tanpa Firebase, tanpa hosting, 100% gratis) dari JavaScript Blogger.
Kalau kamu mau:
-
Menyimpan juga info halaman mana yang dikunjungi?
-
Tampilkan juga total semua kunjungan?
-
Tambahkan grafik jumlah kunjungan?
Tinggal bilang aja, aku siap bantu lanjut 💪
001. Buka https://sheets.new
002. Isi header di kolom A1: Timestamp
003. Klik Extensions > Apps Script
004. Temukan dan tempelkan di Script Google Apps Script: ID_SHEET dan Sheet_Name
Misalnya link Google Sheet kamu:
https://docs.google.com/spreadsheets/d/1AbCDeFGhiJKlMnOPqrS7tUvwxYzZ1234567890/edit#gid=0
Maka ID-nya adalah:
1AbCDeFGhiJKlMnOPqrS7tUvwxYzZ1234567890
005. Tambahkan Script Google Apps Script dari ChatGPT: Paste kode javascript berikut ini:
function doGet() {
const sheet = SpreadsheetApp.openById(ID_SHEET).getSheetByName("Sheet1");
const now = new Date();
sheet.appendRow([now]);
const today = new Date();
today.setHours(0,0,0,0);
const data = sheet.getDataRange().getValues();
let countToday = 0;
for (let i = 1; i < data.length; i++) {
let time = new Date(data[i][0]);
if (time >= today) countToday++;
}
return ContentService.createTextOutput(JSON.stringify({
pengunjungHariIni: countToday
})).setMimeType(ContentService.MimeType.JSON);
}
006. Klik 💾 Save → beri nama (misal: Pengunjung)
007. Klik 🔄 Deploy > New deployment
008. Pilih "Web App"
009. Description: Misal Penghitung Kunjungan
010. Execute as: Me
011. Who has access: Anyone
012. Klik Deploy
013. Klik Authorize access
014. Pilih akun Google kamu
015. Muncul pesan: "Google hasn’t verified this app" karena aplikasi belum diverifikasi secara publik, tapi tidak masalah jika: dibuat sendiri script-nya dan tidak membagikan URL edit ke orang lain.
016. Klik "Advanced" (di bagian bawah)
017. klik “Go to [namascript] (unsafe)”
018. Klik Izinkan (Allow) semua permintaan
019. Salin yang akan kamu dapat link bash (API kamu) seperti: ini: https://script.google.com/macros/s/AKfycbxxxxxxx/exec
Setiap kali seseorang membuka blog, browser akan memanggil URL tersebut, lalu Google Sheets mencatat waktu kunjungan dan menghitung total pengunjung hari itu.
Kalau kamu edit script dan ingin URL tetap sama, kamu bisa redeploy dan pilih "Manage deployments" lalu klik icon pensil (✏️) di deployment sebelumnya.
020. Langkah setelah klik "Allow" kamu belum mendapatkan URL Web App
b. Klik tombol "Deploy" > "Manage deployments" atau (Deploy > Test deployments > Web app atau ulangi Deploy > New deployment jika sebelumnya belum tersimpan)
c. Di jendela yang muncul: Kamu akan melihat daftar deployment-mu & Klik icon pensil ✏️ di sebelah kanan nama deployment, lanjut langkah 007-011
021. Tambahkan link bash ke HTML berikut:
<div id="kunjungan" style="background:#f0fff0;padding:10px;border-radius:10px;">
Menghitung kunjungan...
</div>
<script>
const startTime = Date.now();
function formatDurasi(ms) {
const detik = Math.floor(ms / 1000);
const menit = Math.floor(detik / 60);
const sisaDetik = detik % 60;
return `${menit} menit ${sisaDetik} detik`;
}
setInterval(() => {
const lama = formatDurasi(Date.now() - startTime);
const el = document.getElementById("kunjungan");
if (el.dataset.pengunjung) {
el.innerHTML = `👤 Anda adalah pengunjung ke-${el.dataset.pengunjung} hari ini.<br>⏱️ Lama kunjungan Anda: ${lama}`;
}
}, 1000);
// Ganti URL berikut dengan URL Web App kamu, ingat 1 baris
fetch("https://script.google.com/macros/s/AKfycbxxxxxxx/exec")
.then(res => res.json())
.then(data => {
document.getElementById("kunjungan").dataset.pengunjung = data.pengunjungHariIni;
});
</script>
022. bisa Cek di ChatGPT bisa sebagian di samarkan
023. Tambahkan ini ke Tata Letak Blogger → Tambah Gadget → HTML/JavaScript:
024. Klik Simpan → Lihat Blog kamu (tidak muncul di blogger)
025. Sekarang bisa lihat data kunjungan yang otomatis tercatat di Google Sheet. Setiap baris adalah 1 kunjungan ke blog kamu.
026. MELIHAT DATA DI GOOGLE SHEET: https://sheets.google.com atau apa bisa di Google Drive?
Comments
Post a Comment