Daftar Isi:
🔗
Panduan Lengkap
Cara Pakai
OG Tag Generator
Buat preview link WhatsApp dan Facebook kamu tampil profesional — dengan gambar, judul, dan deskripsi yang rapi — hanya dalam hitungan menit.
Kenapa Penting?
Tanpa OG Tag, Link Kamu Terlihat Kosong
Saat kamu bagikan URL ke WhatsApp atau Facebook tanpa meta tag OG yang benar, yang muncul hanya link polos — tanpa gambar, tanpa judul menarik. Pengunjung tidak tertarik klik.
Preview Gambar Otomatis
Gambar halaman muncul secara otomatis saat link dibagikan ke siapapun.
Klik Lebih Tinggi
Link dengan preview rapi terbukti mendapat klik 3× lebih banyak dibanding link polos.
Gratis & Langsung Jadi
Tidak perlu install apapun. Isi form, generate, salin, selesai.
Tutorial
6 Langkah Menggunakan Tool Ini
Ikuti panduan berikut dari awal hingga kode OG tag kamu siap dipasang.
1
Buka Halaman Tool OG Tag Generator
Klik tombol di bagian bawah artikel ini untuk membuka halaman generator. Tool ini berbasis web, tidak perlu login, tidak perlu daftar akun — langsung bisa dipakai siapa saja.
💡 Bookmark halaman tool agar mudah dibuka lagi kapan saja dibutuhkan.
2
Isi URL Halaman yang Ingin Dibagikan
Masukkan URL lengkap halaman kamu di kolom URL Halaman. Pastikan dimulai dengan https:// dan URL sudah bisa diakses publik (bukan halaman draft atau private).
💡 Contoh: https://situsanda.com/artikel-terbaru — bukan URL lokal atau localhost.
3
Tulis Judul dan Deskripsi yang Menarik
Kolom Judul (og:title) adalah teks besar yang muncul di preview link. Tulis dengan menarik, maksimal 95 karakter. Di bawahnya, isi Deskripsi (og:description) — 1–2 kalimat singkat yang membuat orang penasaran untuk klik. Maksimal 200 karakter.
✍️ Tips menulis: Gunakan angka, kata kerja aktif, atau pertanyaan. Contoh: “5 Cara Hemat Listrik yang Terbukti Efektif” lebih menarik dari “Artikel tentang listrik”.
4
Masukkan URL Gambar Preview
Di kolom URL Gambar (og:image), masukkan link langsung menuju file gambar — bukan link halaman yang berisi gambar. Gambar ini yang akan tampil sebagai thumbnail besar saat link dibagikan.
📐 Ukuran ideal gambar: 1200 × 630 piksel, format JPG atau PNG, ukuran file di bawah 8 MB. Gunakan gambar yang sudah diupload ke hosting kamu.
5
Atur Informasi Tambahan (Opsional)
Lengkapi field tambahan jika diperlukan: Nama Situs untuk branding, Tipe Halaman (website atau article), dan pengaturan Twitter/X Card jika ingin hasil bagus di platform X. Semua field ini tidak wajib diisi.
🎯 Untuk blog atau artikel, pilih tipe article. Untuk halaman utama atau landing page, pilih website.
6
Generate, Salin, dan Pasang di Website
Klik tombol ✨ Generate Meta Tag. Kode OG tag akan langsung muncul di bawah — lengkap dengan pratinjau kartu seperti tampilan di WhatsApp. Klik Salin Kode, lalu tempel kode tersebut di dalam bagian <head> halaman HTML kamu.
📋 Di WordPress, gunakan plugin Header Footer Code Manager atau Insert Headers and Footers untuk menempelkan kode di bagian <head> secara mudah.
Referensi Field
Arti Setiap Kolom di Form Generator
Panduan singkat fungsi setiap field agar kamu mengisi dengan benar.
og:url
URL lengkap halaman yang sedang kamu optimasi. Ini adalah identitas unik halaman di media sosial.
og:title
Judul yang tampil sebagai teks tebal di preview link. Buat semenarik mungkin, maks 95 karakter.
og:description
Teks penjelasan singkat di bawah judul. Idealnya 1–2 kalimat, maks 200 karakter.
og:image
URL langsung file gambar thumbnail. Ukuran ideal 1200×630 px agar tidak terpotong di semua platform.
og:site_name
Nama brand atau situs kamu. Biasanya muncul di atas atau di bawah judul, tergantung platform.
og:type
Jenis halaman: website untuk halaman umum, article untuk post blog atau berita.
twitter:card
Jenis tampilan di Twitter/X. Pilih summary_large_image untuk gambar besar yang lebih eye-catching.
fb:app_id
ID aplikasi Facebook (opsional). Dibutuhkan jika kamu menggunakan Facebook Analytics atau FB Pixel tingkat lanjut.
Contoh Output
Begini Tampilan Kode yang Dihasilkan
Kode ini yang kamu salin dan pasang di bagian <head> halaman website kamu.
<!-- Open Graph / Facebook --> <meta property="og:type" content="article" /> <meta property="og:url" content="https://situsanda.com/artikel" /> <meta property="og:title" content="5 Cara Hemat Listrik yang Terbukti" /> <meta property="og:description" content="Tagihan listrik bengkak? Coba 5 tips ini..." /> <meta property="og:image" content="https://situsanda.com/uploads/cover.jpg" /> <meta property="og:image:alt" content="5 Cara Hemat Listrik yang Terbukti" /> <meta property="og:site_name" content="Nama Situs Kamu" /> <!-- Twitter / X Card --> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:title" content="5 Cara Hemat Listrik yang Terbukti" /> <meta name="twitter:description" content="Tagihan listrik bengkak? Coba 5 tips ini..." /> <meta name="twitter:image" content="https://situsanda.com/uploads/cover.jpg" />
Tips Pro
Agar Hasil Preview Makin Sempurna
Beberapa hal yang perlu diperhatikan setelah kode OG tag terpasang.
Baca Juga:
🔄 Bersihkan Cache Facebook
Setelah memasang kode, buka Facebook Sharing Debugger dan klik “Scrape Again” agar Facebook memuat ulang data OG tag terbaru dari halaman kamu.
📐 Perhatikan Rasio Gambar
Gambar dengan rasio 1.91:1 (1200×630 px) adalah standar emas. Gambar terlalu kecil atau proporsi aneh akan terpotong atau tidak ditampilkan sama sekali.
🔍 Gunakan Satu OG Tag Per Halaman
Jangan memasang kode OG tag ganda di satu halaman. Jika pakai plugin SEO seperti Yoast atau Rank Math, nonaktifkan OG tag dari plugin tersebut terlebih dahulu.
⚡ Update Saat Konten Berubah
Jika judul atau gambar artikel berubah, generate ulang kode OG tag dan perbarui yang terpasang. Lalu bersihkan cache Facebook dan WhatsApp dengan share ulang linknya.
Meta tag Open Graph adalah “sampul buku” digital kamu. Orang menilai sebuah link dari preview-nya sebelum memutuskan untuk klik — sama seperti menilai buku dari covernya.
— Prinsip dasar optimasi media sosial
Siap Bikin Preview Link
yang Langsung Menarik?
Buka tool generator sekarang — gratis, tanpa login, langsung bisa dipakai. Kurang dari 2 menit untuk hasil yang terlihat jauh lebih profesional.
Buka OG Tag Generator →✓ Gratis ✓ Tanpa registrasi ✓ Kode langsung jadi
