Generator Tag Open Graph
Isi judul, deskripsi, URL kanonik, gambar pratinjau, dan og:type, lalu generator ini menuliskan tag <meta> Open Graph yang sesuai, siap ditempel ke <head> halaman Anda. Kolom yang Anda biarkan kosong cukup dihilangkan, dan tanda kutip serta ampersand pada teks Anda di-escape agar markup tetap valid. Generator menulis lima properti og: inti saja, bukan tag Twitter Card atau tag artikel.
Cara membuat tag OG Anda
-
1
Pilih og:type
website untuk halaman utama, article untuk postingan, product untuk halaman toko, video.other untuk sematan. Kolom ini teks bebas, jadi nilai og:type valid apa pun bisa dipakai.
-
2
Isi kolom inti
Judul, deskripsi, URL kanonik, dan URL gambar absolut. Kolom apa pun yang Anda biarkan kosong dihilangkan dari hasil.
-
3
Buat tag-nya
Tanda kutip dan ampersand di-escape untuk Anda, dan Anda mendapat satu baris meta per kolom yang Anda isi.
-
4
Salin blok ke bagian head
Tempel ke dalam `<head>` templat halaman Anda, di atas tag sosial apa pun yang sudah ada.
Tag yang dihasilkan generator ini
<meta property="og:type" content="article">
<meta property="og:title" content="Your page title">
<meta property="og:description" content="A one-line description.">
<meta property="og:url" content="https://example.com/post/123">
<meta property="og:image" content="https://example.com/og-image.jpg">
Itulah seluruh keluarannya. og:type selalu ditulis, sementara og:title, og:description, og:url, dan og:image hanya ditambahkan saat Anda mengisinya. Kelima properti ini adalah yang pertama dibaca oleh Facebook, LinkedIn, Slack, Discord, WhatsApp, dan X, jadi mencakup kasus yang paling umum.
Generator ini tidak menulis tag kartu twitter:, og:image:width / og:image:height, og:site_name, og:locale, atau tag article:. Jika Anda membutuhkannya, tambahkan secara manual di samping blok yang dihasilkan.
Nilai og:type yang penting
| Tipe | Kapan digunakan |
|---|---|
| website | Halaman utama, halaman landing, konten statis |
| article | Postingan blog, berita, halaman editorial |
| product | Halaman detail produk e-commerce |
| video.other | Konten video dan sematan |
| profile | Halaman profil penulis atau pengguna |
| music.song | Halaman trek individual |
Tag yang layak ditambahkan manual
| Tag | Fungsinya | Contoh nilai |
|---|---|---|
og:site_name |
Nama situs secara keseluruhan | Example |
og:locale |
Bahasa dan wilayah halaman | en_US |
og:image:width |
Membantu scraper menata kartu lebih cepat | 1200 |
og:image:height |
Membantu scraper menata kartu lebih cepat | 630 |
twitter:card |
Tata letak kartu di X | summary_large_image |
X kembali ke tag og: saat tidak ada tag twitter:, jadi halaman yang hanya membawa kelima properti yang dihasilkan tetap tampil dengan benar di sana. Tambahkan tag twitter: hanya saat Anda ingin judul, deskripsi, atau gambar yang berbeda khusus di X.
Kesalahan umum yang dibantu dihindari generator ini
namealih-alihproperty. Properti Open Graph berada diproperty="og:...". Generator selalu menulis atribut yang benar.- Tanda kutip dan ampersand yang tidak di-escape. Karakter
"atau&mentah pada judul Anda merusak tag. Generator meng-escape-nya untuk Anda. - URL gambar relatif. Scraper sosial hanya menerima URL absolut. Tempel alamat
https://lengkap gambar, karena generator tidak menambahkan domain Anda. - Ukuran gambar yang salah. 1200 × 630 px adalah ukuran aman universal. Di bawah 200 × 200 px gambar biasanya ditolak.
Pertanyaan yang Sering Diajukan
Di bagian <head> HTML Anda, tinggi di atas, idealnya dekat <title>. Scraper membaca bagian head dan sering berhenti lebih awal, jadi menaruh tag OG di dekat atas mencegahnya terlewat pada halaman yang sangat besar.
Tidak. Tool ini hanya menulis lima properti og: inti. X kembali ke Open Graph saat tag twitter: tidak ada, jadi pratinjau Anda tetap berfungsi. Tambahkan tag twitter: secara manual hanya saat Anda ingin judul, deskripsi, atau gambar yang berbeda di X.
1200 × 630 px, JPG atau PNG, adalah ukuran aman universal. Berfungsi di Facebook, LinkedIn, kartu besar X, Slack, Discord, dan iMessage. Apa pun yang lebih kecil dari 200 × 200 px berisiko ditolak sepenuhnya.
Beri setiap versi bahasa halamannya sendiri dengan tag og: sendiri, dan tambahkan og:locale (misalnya en_US) plus og:locale:alternate untuk versi lain secara manual. Generator ini tidak menulis tag locale untuk Anda.
Alat Terkait
Pemeriksa Panjang Deskripsi Meta
Ukur meta deskripsi dalam karakter dan perkiraan piksel, bandingkan acuan editorial, lalu tinjau contoh tata letak desktop dan seluler.
Simulator SERP Google
Periksa snippet perkiraan bergaya Google dengan batas karakter untuk seluler dan desktop. Draf Anda tetap di sesi browser ini.
Ekstraktor Tautan Eksternal
Tempelkan kode HTML mentah, tentukan URL dasar secara opsional, dan dapatkan daftar bersih tanpa duplikat dari semua tautan eksternal http/https dalam kode untuk audit tautan dan evaluasi SEO.
Generator Skema FAQ
Buat markup JSON-LD FAQPage dari pasangan pertanyaan dan jawaban agar halaman Anda memenuhi syarat untuk hasil kaya (rich results) dan kotak jawaban Google.
Validator Sitemap XML
Periksa XML sitemap di browser untuk menemukan error parsing, lokasi yang hilang, URL duplikat, dan nilai kolom umum.
Pemeriksa header keamanan HTTP
Tempel header respons HTTP dan tinjau HSTS, CSP, clickjacking, MIME, referrer, serta kebijakan lintas origin secara lokal.
Alat ini tersedia dalam bahasa lain
- Trình tạo thẻ Open Graph [VI]
- Open Graph-taggenerator [SV]
- Open-Graph-Tags-Generator [DE]
- Generador de etiquetas Open Graph [ES]
- เครื่องมือสร้างแท็ก Open Graph [TH]
- مولّد وسوم Open Graph [AR]
- Open Graph 태그 생성기 [KO]
- Générateur de balises Open Graph [FR]
- Open Graph-taggenerator [NL]
- Generator tagów Open Graph [PL]
- Open Graph タグジェネレーター [JA]
- Gerador de tags Open Graph [PT]
- Open Graph Tags Generator [EN]
- Generatore di tag Open Graph [IT]
- Генератор тегов Open Graph [RU]
- Open Graph Etiketleri Oluşturucu [TR]
- Open Graph 标签生成器 [ZH]