Softonic

Pratinjau Open Graph

Langkah 1 / 2
Berikutnya

Ketik judul, deskripsi, nama situs, URL halaman, dan URL gambar, lalu alat ini menampilkan kartu berbagi Facebook dan X (Twitter) langsung yang diperbarui pada setiap ketikan. Ini adalah ruang uji desain untuk tag Open Graph Anda: tidak ada yang diambil atau dipublikasikan, jadi Anda bisa melatih panjang judul dan pemotongan gambar sampai kartunya terlihat pas, lalu menyalin teksnya ke tag og: Anda yang sesungguhnya.

Cara pratinjau disusun

  1. 1

    Ketik bidang-bidang kartu

    Judul, nama situs, deskripsi, URL halaman, dan URL gambar. Setiap bidang dipetakan ke satu tag og:.

  2. 2

    Amati kartu diperbarui

    Mockup Facebook dan X dirender ulang saat Anda mengetik, memakai tata letak asli dan pemotongan masing-masing platform.

  3. 3

    Tambahkan URL gambar

    Tempel alamat gambar https absolut untuk melihat pemotongannya; biarkan kosong dan kartu Facebook menampilkan placeholder.

  4. 4

    Salin ke tag og: Anda

    Saat kartu sudah enak dibaca, pindahkan judul, deskripsi, dan gambar yang sama ke tag meta halaman Anda.

Setiap bidang menjadi apa

Bidang Tag Open Graph Yang tampil di kartu
Judul og:title Judul tebal, dipotong menjadi satu baris
Deskripsi og:description Subjudul abu-abu, dibatasi dua baris
Nama situs og:site_name Label kecil di atas judul Facebook
URL og:url Domain ditampilkan; host yang menentukannya
URL gambar og:image Dipotong ke 1.91:1 di kedua kartu mockup

Alat ini membaca host dari URL yang Anda ketik, jadi https://blog.example.com/post menampilkan blog.example.com di kartu.

Dua kartu itu, dan bedanya

  • Facebook menampilkan gambar yang dipotong ke 1.91:1, lalu domain dalam huruf kapital kecil, judul tebal dalam satu baris, dan deskripsi hingga dua baris. Tanpa URL gambar, ia menampilkan placeholder abu-abu, penyebab paling umum dari berbagi yang datar tanpa gambar di dunia nyata.
  • X (Twitter) menampilkan kartu summary_large_image dengan sudut membulat: gambar dipotong 2:1, lalu domain, judul, dan deskripsi di bawahnya.

Menyesuaikan teks agar pas

  • Judul: targetkan 60 sampai 70 karakter. Facebook memotong sekitar 88 dan X sekitar 70, jadi judul di bawah 70 tetap utuh di mana saja.
  • Deskripsi: jaga di bawah sekitar 160 karakter; kartu membatasinya ke dua baris dan sisanya dibuang.
  • Gambar: desain pada 1200 x 630 px agar pemotongan 1.91:1 bersih, dan inangkan di URL https:// absolut. Jalur relatif tidak akan dimuat setelah tag aktif.
  • Nama situs: singkat dan hanya merek, tanpa slogan. Ia berada di atas judul sebagai label.

Daftar periksa hari publikasi

  • [ ] Judul di bawah 70 karakter
  • [ ] Deskripsi di bawah 160 karakter
  • [ ] URL gambar absolut (https, bukan // atau jalur relatif)
  • [ ] Gambar didesain pada 1200 x 630 px, JPG atau PNG
  • [ ] URL cocok dengan kanonik yang akan Anda terbitkan
  • [ ] Teks disalin ke tag og: yang sesungguhnya, lalu diverifikasi dengan alat pemeriksa

Pertanyaan yang Sering Diajukan

Tidak. Anda mengetik bidang-bidang kartu secara manual dan alat ini membuat mockup tampilannya. Ini ruang uji desain, bukan scraper, jadi berfungsi juga sebelum halaman daring. Untuk membaca tag yang sudah ada di sebuah halaman, tempel HTML halaman itu ke Open Graph Checker.

Kartu Facebook dan kartu gambar besar X (Twitter). Keduanya memakai nilai Open Graph yang sama, jadi kartu yang enak dibaca di sini menjadi acuan yang baik untuk LinkedIn, Slack, Discord, dan aplikasi lain yang membuka tautan dari tag og: yang sama, masing-masing dengan batas yang sedikit berbeda.

Karena bidang gambar kosong, atau URL yang Anda tempel bukan alamat https absolut yang berfungsi. Tambahkan URL gambar https lengkap dan pemotongannya langsung muncul. Saat sudah aktif, jaga berkas di bawah 5 MB dan disajikan dengan tipe konten publik image/*.

Setiap platform memotong pada titik yang berbeda (Facebook sekitar 88 karakter, X sekitar 70), dan kartu mockup mencerminkannya. Pangkas judul menjadi 60 sampai 70 karakter dan ia akan tetap utuh di setiap platform.

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