open graph meta tag

Tugas seorang blogger adalah membuat konten yang menarik. Karena kita semua sama-sama percaya propoganda “Content is king!”. Tapi, semenarik apapun konten, apabila tidak memiliki pembaca akan sama saja.

Apa yang kamu lakukan setelah selesai membuat sebuah konten yang menarik di website atau blog-mu? Ya, betul. Biasanya kita akan share tulisan kita di social media.

Ada pertanyaan menarik di grup facebook. Bagaimana membuat tampilan post artikel di social media (khususnya facebook) menjadi menarik. Dengan membuat thumbnail yang menonjol misalnya, seperti situs-situs berita.

contoh thumbnail menarik di facebook

Jawabannya adalah Open Graph atau OG Meta Tag.

Apa itu Open Graph Meta Tag?

Open Graph Meta Tag atau OG Tags merupakan sebuah tag html khusus yang bertujuan agar social media mengenali sebuah page di website. Mirip seperti Meta Title dan Meta Description, namun Title dan Description ditujukan untuk search engine, meskipun secara default, social media juga meng-crawl tag ini untuk menampilkan di sosmed tersebut (jika OG Tag tidak ada).

Open Graph diperkenalkan oleh Facebook pada 2010 agar siapapun yang ingin tampilan title, description, dan image yang ditampilkan di facebook berbeda dengan yang di search engine.

Gampangnya, OG Meta Tag ini berfungsi untuk membuat previewcustom yang menarik agar audience kita di social media tertarik untuk mengkliknya. Tag ini dapat menambah CTR dari social media.

Bagaimana cara menggunakan OG Meta Tag?

Cara menggunakan OG meta tag sangat mudah apabila dapat mengakses html page kamu. Tapi sebelumnya, saya ingin menjelaskan beberapa tag yang wajib digunakan dalam merangkai OG Meta Tag.

Title

Yang pertama tentu saja title. Bentuk markup dari title untuk OG meta tag adalah og:title. Batas dari karakter yang digunakan di title tidak terbatas, namun ada baiknya jangan lebih dari 70 karakter agar tidak disunat oleh Facebook.

Type

Selanjutnya yang penting adalah type. OG Meta Tag Type berfungsi untuk mendeteksi jenis postingan yang kamu share, contohnya article, website, video, etc. Bentuk markup dari type adalah og:type.

Image

Ini adalah yang paling penting, karena sebuah gambar adalah hal yang paling diperhatikan disetiap postingan. Protokol untuk menyematkan OG Meta Tag Image adalah og:image.

URL

Apa jadinya jika kamu share sebuah page namun tanpa URL? tentu saja tidak bisa. og:url adalah markup untuk menambahkan og meta tag url.

Description

Untuk postingan yang memiliki type article, blog, atau website, rasanya tag ini menjadi penting. Open Graph untuk description markup-nya adalah og:description.

Jadi, kira-kira markup OG meta tag secara sederhana adalah seperti yang dibawah ini. Saya menggunakan postingan ini sebagai contonya ya.

<meta property="og:type" content="article" />
<meta property="og:title" content="Cara Menggunakan Open Graph Meta Tag" />
<meta property="og:description" content="Open Graph Meta Tag atau OG Tags merupakan sebuah tag html khusus yang bertujuan agar social media mengenali sebuah page di website." />
<meta property="og:url" content="https://www.metropolution.com/marketips/open-graph-atau-og-meta-tag/" />
<meta property="og:image" content="https://www.metropolution.com/wp-content/uploads/2020/01/cara-membuat-open-graph-meta-tag.jpg" />

Menerapkan OG Meta Tag di WordPress

Untuk menerapkan OG meta tag di wordpress itu gampang-gampang susah, ada banyak sekali plugin yang otomatis menyisipkan og meta tag di setiap postingan kita. Seperti yang saya gunakan saat ini adalah Yoast SEO.

Pasti disini semua pernah denger yang namanya Yoast kan? Nah di plugin yoast juga ada opsi yang memungkinkan kita untuk memasang og meta tag untuk facebook dan twitter. Caranya gampang banget, yuk disimak!

Cara membuat og meta tag dengan Yoast

-Pada dashboard yoast, pilih menu “social”

menu social yoast

-Lalu Pilih menu Facebook / Twitter, kemudian “enable” keduanya.

-Setelah itu save changes

-Edit salah satu page / post yang ingin diberikan custom OG meta tag, scroll sampai ke bagian yoast seperti dibawah ini.

klik social

-Silahkan isi facebook title dan facebook description sesuai yang diinginkan. Untuk facebook image, silahkan gunakan gambar yang berbeda atau telah ditambahkan teks / frame sesuai selera. (kamu harus siapkan gambarnya dulu ya).

Note: jika facebook / twitter kamu kosong, maka otomatis gambar yang digunakan adalah gambar unggulan / featured image.

Tips: Gunakan gambar dengan resolusi 1200 x 630 pixels atau aspect ratio 1.9 : 1. Jangan gunakan gambar yang kotak atau 1 : 1 karena akan dipotong oleh facebook.

-Selesai. Silahkan test masukan url kamu di kolom “create post” di facebook. Maka secara otomatis facebook akan menampilkan apa yang telah kamu input di facebook title dan description tadi beserta gambarnya.

facebook preview

Nah begitulah kira-kira tutorial simple kali ini, semoga mudah untuk dimengerti ya!

 

2 KOMENTAR

LEAVE A REPLY

Please enter your comment!
Please enter your name here