HOTLINE

(0275) 2974 127

CHAT WA 24/7
0859-60000-390 (Sales)
0852-8969-9009 (Support)
Blog

Cara Setting Open Graph di WordPress Agar Tampil Maksimal di Media Sosial

Dalam dunia digital marketing dan SEO modern, tampilan konten saat dibagikan ke media sosial memiliki peran besar dalam menarik klik (CTR). Inilah fungsi penting dari Open Graph (OG), sebuah protokol yang membuat link website tampil menarik saat dibagikan ke Facebook, WhatsApp, LinkedIn, X (Twitter), dan platform lain. Artikel ini membahas apa itu Open Graph, mengapa penting, serta cara setting Open Graph di WordPress baik menggunakan plugin maupun manual.

Definisi Open Graph

Open Graph adalah sebuah protokol yang dikembangkan oleh Facebook untuk mengontrol bagaimana sebuah halaman web ditampilkan ketika dibagikan ke platform media sosial seperti Facebook, WhatsApp, LinkedIn, dan X (Twitter).

Melalui metadata khusus, Open Graph memungkinkan pemilik website menentukan judul, deskripsi, gambar, dan informasi lain yang muncul pada preview tautan. Dengan adanya Open Graph, tampilan link menjadi lebih rapi, informatif, dan menarik, sehingga membantu meningkatkan interaksi dan jumlah klik ketika konten dibagikan di berbagai media sosial.

Alasan Open Graph Penting

1. Meningkatkan CTR (Click-Through Rate)

Preview link yang menarik membuat orang lebih tertarik mengklik.

2. Membantu Branding

Gambar yang jelas & konsisten meningkatkan citra brand.

3. Mencegah Salah Gambar atau Teks

Sering muncul masalah:

  • Gambar tidak muncul

  • Judul tidak sesuai

  • Deskripsi kacau

Open Graph menyelesaikan semuanya.

4. Optimal untuk Sharing di WhatsApp & Facebook

WhatsApp juga menggunakan metadata Open Graph saat menampilkan preview.

Struktur Tag Open Graph

Berikut contoh kode OG:

<meta property="og:title" content="Judul Halaman">
<meta property="og:description" content="Deskripsi singkat halaman.">
<meta property="og:image" content="https://example.com/image.jpg">
<meta property="og:url" content="https://example.com/artikel-ini">
<meta property="og:type" content="article">

Cara Setting Open Graph di WordPress

Kamu bisa mengatur OG di WordPress dengan tiga cara yaitu plugin SEO, plugin khusus OG, atau manual dengan kode.

1. Mengatur Open Graph Menggunakan Plugin SEO 

  • Menggunakan Rank Math SEO

Langkah-Langkah

    1. Install plugin Rank Math SEO

    2. Masuk ke menu Rank Math → Titles & Meta

    3. Pilih tab Global Meta

    4. Cari bagian Social Meta dan aktifkan Open Graph Meta

    5. Atur:

      • Default Open Graph Image

      • Facebook App ID (opsional)

Mengatur OG di tiap posting

    1. Edit posting

    2. Scroll ke bawah → panel Rank Math

    3. Pilih tab Social

    4. Isi:

      • Facebook Title

      • Facebook Description

      • Facebook Image

Rank Math juga otomatis membuat Twitter Card.

  • Menggunakan Yoast SEO

Langkah-Langkah

    1. Install plugin Yoast SEO

    2. Masuk SEO → Social

    3. Tab Facebook → aktifkan Add Open Graph metadata

    4. Upload default image

Di tiap posting

    1. Edit posting

    2. Scroll ke panel Yoast SEO

    3. Buka tab Social

    4. Atur Title, Description, dan Image

2. Menggunakan Plugin Khusus Open Graph

Jika tidak ingin menggunakan plugin SEO, kamu bisa memakai plugin kecil seperti:

  • Open Graph and Twitter Card Tags

  • WPSSO Core

  • Open Graph by Social Meta

Plugin ini biasanya ringan dan hanya fokus pada metadata sosial.

3. Cara Setting Open Graph Secara Manual (Tanpa Plugin)

Untuk yang ingin hasil lebih fleksibel, tambahkan kode berikut ke functions.php (lebih aman gunakan child theme):

function custom_open_graph_tags() {
if (is_singular()) {
global $post;

$title = get_the_title($post->ID);
$desc = wp_strip_all_tags(get_the_excerpt($post->ID));
$image = get_the_post_thumbnail_url($post->ID, 'large');
$url = get_permalink($post->ID);

echo "
<meta >. esc_attr($title) ."'>
<meta >. esc_attr($desc) ."'>
<meta >. esc_url($image) ."'>
<meta >. esc_url($url) ."'>
<meta >;
}
}
add_action('wp_head', 'custom_open_graph_tags');

Cara Mengecek Apakah Open Graph Sudah Benar

Setelah mengatur OG, sangat penting melakukan pengecekan.

1. Facebook Sharing Debugger

 https://developers.facebook.com/tools/debug/

Fungsinya:

  • Melihat metadata OG yang terbaca

  • Menyegarkan cache Facebook

  • Mengetahui error (misalnya: image terlalu kecil)

2. Twitter Card Validator

 https://cards-dev.twitter.com/validator

3. LinkedIn Post Inspector

https://www.linkedin.com/post-inspector/

Tips Memilih Gambar Open Graph yang Optimal

  • Ukuran ideal: 1200 × 630 px

  • Rasio: 1.91:1

  • Format: JPG atau PNG

  • Hindari teks terlalu kecil

  • Gunakan gambar high-quality

Kesimpulan

Open Graph adalah elemen penting dalam optimasi tampilan link ketika dibagikan ke media sosial. Dengan pengaturan OG yang benar, website akan menampilkan judul, deskripsi, dan gambar yang lebih relevan sehingga meningkatkan profesionalitas, daya tarik, dan peluang klik.

Di WordPress, pengaturan Open Graph dapat dilakukan dengan mudah melalui plugin SEO seperti Rank Math dan Yoast SEO, plugin khusus OG, atau secara manual dengan menambahkan kode ke theme. Setelah pengaturan selesai, penting untuk memeriksa hasilnya menggunakan Facebook Debugger atau validator lain untuk memastikan metadata terbaca dengan tepat.

Secara keseluruhan, implementasi Open Graph yang benar akan membantu memperkuat branding, meningkatkan engagement, dan memberikan pengalaman share yang lebih baik di berbagai platform sosial.

5/5 - (1 vote)
Fitri Ana

Recent Posts

Rekomendasi HP Kamera Bagus Harga Terjangkau, Hasil Foto Tajam Tanpa Mahal

Perkembangan fotografi mobile semakin pesat seiring meningkatnya kualitas kamera pada smartphone. Saat ini, kamera HP…

6 hours ago

Website Lemot di cPanel? Kenali Engintron dan Cara Ampuh Meningkatkan Performa Server

Dalam dunia hosting dan manajemen server, performa serta efisiensi sumber daya adalah dua hal yang…

7 hours ago

Single Account System: Solusi Praktis atau Ancaman Keamanan?

Dalam beberapa tahun terakhir, tren penggunaan satu akun untuk mengakses banyak aplikasi semakin berkembang. Pengguna…

8 hours ago

Panduan Mengelola Folder Trash di cPanel untuk Menambah Ruang Hosting

Saat mengelola website melalui cPanel, banyak pengguna tidak menyadari bahwa file yang sudah dihapus sebenarnya…

10 hours ago

Manfaat Staging WordPress dan Cara Membuatnya di Hosting

Setiap perubahan pada website WordPress berisiko menimbulkan error, mulai dari plugin konflik hingga website tidak…

13 hours ago

Alternatif Pengganti Chip RAM: Masa Depan Teknologi Memori Komputer

Chip RAM (Random Access Memory) memegang peran krusial dalam sistem komputer dan berbagai perangkat digital.…

1 day ago