Periksa markup sosial

Saat Anda berbagi halaman di sebuah jejaring sosial, ini secara otomatis mengambil konten halaman dan menampilkan informasi seperti URL, judul, deskripsi, dan gambar.

Ini disebut og tag (opengraph) dan diatur oleh plugin SEO Anda.
Anda harus memeriksa informasi apa yang akan ditampilkan ketika seseorang membagikan konten Anda di jejaring sosial mereka agar tetap sesuai dengan konten Anda.

Banyak lalu lintas situs web berasal dari pembagian media sosial, dan bagian utama dari pemasaran media sosial adalah mendorong orang untuk membagikan konten Anda dengan pengikut Twitter, teman Facebook, dan kontak Google+ mereka.

Panduan Lengkap untuk Markup Media Sosial

Semakin banyak konten Anda dibagikan dengan orang lain, semakin banyak eksposur yang didapat situs web Anda. Namun, webmaster biasanya tidak memiliki banyak kebebasan berkenaan dengan tampilan konten mereka saat seseorang membagikan tautan di jejaring sosial, kecuali mereka mengambil beberapa langkah tambahan.

Markup media sosial memberi Anda kendali atas bagaimana konten Anda muncul saat dibagikan melalui jejaring sosial. Fungsi markup media sosial memberi Anda lebih banyak kendali atas bagaimana konten Anda muncul ketika dibagikan melalui jejaring sosial populer. Menambahkan markup media sosial ke situs web Anda memudahkan pengguna untuk membagikan konten Anda dengan cara yang lebih berguna dan rapi.

Anda dapat melakukannya dengan menambahkan kode HTML yang diperlukan ke situs web Anda atau dengan menggunakan plugin markup media sosial yang sesuai jika tersedia untuk sistem manajemen konten Anda.

Twitter Card

Salah satu alasan Twitter begitu populer adalah karena Twitter membuatnya tetap sederhana, tetapi batasan 140 karakter juga tidak memberikan banyak hal untuk dikerjakan pengguna.

Twitter Card memungkinkan Anda mendapatkan lebih banyak manfaat dari batas ini dengan menyertai Tweet dengan representasi yang lebih kaya dari konten yang dibagikan.

Contoh kartu Twitter:

Saat ini ada enam Kartu Twitter yang tersedia yang menentukan bagaimana pratinjau konten Anda muncul ketika dibagikan di Twitter.

Anda dapat memilih dari Ringkasan, Foto, Galeri, Aplikasi, Pemain atau kartu Produk. Misalnya, jika konten yang dipermasalahkan mewakili suatu produk, Anda mungkin ingin menggunakan Kartu Produk untuk menampilkannya dengan lebih baik saat konten dibagikan di Twitter.

Untuk mengaktifkan Twitter Cards di situs web Anda, Anda harus masuk ke akun Twitter Anda dan membuka dev.twitter.com/cards untuk mendapatkan kode yang diperlukan.

Kode tersebut akan terlihat seperti berikut:

<meta name = "twitter: card" content = "summary_large_image" />
<meta name = "twitter: description" content = "Deskripsi ditempatkan di sini" />
<meta name = "twitter: title" content = "Judul di sini" />
<meta name = "twitter: site" content = "@ YourTwitterHandle" />
<meta name = "twitter: domain" content = "http://www.yourdomain.com" />
<meta name = "twitter: image: src" content = "https: //www.yourdomain/image.jpg" />
<meta name = "twitter: creator" content = "@ AuthorTwitterHandle" />

Untuk informasi lengkap tentang Kartu Twitter, Anda dapat melihat bagian bantuan di Twitter di dev.twitter.com/docs/cards. Setelah Anda memahami berbagai kartu yang tersedia, Anda dapat membuatnya menggunakan Validator Kartu Twitter.

Facebook Open Graph

Facebook Open Graph memungkinkan Anda menyesuaikan tampilan konten Anda saat dibagikan di Facebook. Untuk menggunakan Open Graph, Anda perlu menambahkan tag meta tertentu ke kode HTML halaman web yang ingin Anda bagikan.

Misalnya, untuk beranda, Anda mungkin ingin menggunakan tag yang akan menyajikan informasi tentang situs web Anda secara keseluruhan setiap kali dibagikan, sementara tag untuk halaman tertentu harus dipilih sehingga lebih merangkum dan menyajikan konten dengan lebih baik.

Tag meta yang lebih spesifik juga tersedia, termasuk yang berfokus pada lokasi geografis, individu, bisnis, produk, dan lainnya.

Contoh Open Graph yang digunakan untuk mengisi kiriman tautan Facebook:

Untuk menambahkan Open Graph ke situs web Anda, Anda perlu menambahkan dua baris berikut ke yourtag:

xmlns: og = "http://ogp.me/ns#" 
xmlns: fb = "https://www.facebook.com/2008/fbml">

Dengan kode ini di HTML beranda Anda, Anda sekarang dapat menambahkan tag meta ke halaman web individual Anda untuk menyesuaikan tampilan pratinjau mereka saat dibagikan. Tag ini termasuk og: title, og: type, og: image dan og: url.

Ada juga beberapa tag opsional tambahan seperti og: description dan og: site_name. Misalnya, data meta Grafik Terbuka yang dilampirkan ke halaman web tertentu mungkin terlihat seperti ini:

<meta property = "og: title" content = "Judul Anda" />
<meta property = "og: image" content = "http://www.yourdomain.com" />
<meta property = "og: site_name" content = "Site name" />
<meta property = "og: description" content = "Ini adalah deskripsi Anda" />

 Kemudian kunjungi debugger Open Graph Facebook untuk memvalidasi kode Anda.

Data Terstruktur Google

Data Terstruktur Google digunakan untuk menyesuaikan cara konten Anda muncul saat dibagikan di jejaring sosial Google+, dan yang lebih penting, tampilannya di hasil penelusuran Google (biasanya disebut cuplikan kaya).

Google mendukung markup data terstruktur untuk berbagai jenis konten termasuk ulasan, orang, produk, bisnis, resep, acara, dan musik.

Namun, seperti Open Graph untuk Facebook, Anda juga dapat menggunakan data terstruktur untuk menentukan judul, deskripsi, dan gambar yang akan ditampilkan saat membagikan tautan melalui Google+. Seperti yang Anda lihat, ini sangat mirip dengan Open Graph.

<meta itemprop = ”name” content = ”Judul di sini”>
<meta itemprop = ”description” content = ”Description here”>
<meta itemprop = ”image” content = ”https: //www.yourdomain/image.jpg”>

Setelah Anda menambahkan kode, Anda dapat memvalidasinya menggunakan Alat Pengujian Data Terstruktur Google.

Jika Data Terstruktur Google tidak ada, Google+ akan menggunakan data Grafik Terbuka.

Masih butuh bantuan?

YA. Bantu Saya Buatkan.

Tools yang digunakan	Pendalaman Materi
– WordPress	– Cukup jelas