Cara Pasang Open Graph & Twitter Card di Blogger

Oleh TipsTechPraktis -

Cara Pasang Open Graph & Twitter Card di Blogger

Open Graph (OG) dan Twitter Card adalah meta tag yang berfungsi menampilkan judul, deskripsi, dan gambar saat artikel dibagikan ke media sosial. Dengan menambahkan OG dan Twitter Card di Blogger, tampilan share artikel akan lebih profesional dan menarik.

Langkah-langkah Menambahkan Open Graph & Twitter Card

  1. Buka Blogger → Tema → Edit HTML.
  2. Cari tag <head> di dalam template.
  3. Tempelkan kode meta berikut di dalamnya:
<!-- Open Graph -->
<meta property="og:title" expr:content="data:blog.pageName"/>
<meta property="og:description" expr:content="data:blog.metaDescription"/>
<meta property="og:type" content="website"/>
<meta property="og:url" expr:content="data:blog.url"/>
<meta property="og:image" expr:content="data:blog.postImageUrl"/>

<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image"/>
<meta name="twitter:title" expr:content="data:blog.pageName"/>
<meta name="twitter:description" expr:content="data:blog.metaDescription"/>
<meta name="twitter:image" expr:content="data:blog.postImageUrl"/>

Manfaat Open Graph & Twitter Card

  • Preview artikel terlihat rapi saat dibagikan di Facebook & Twitter.
  • Meningkatkan CTR (Click Through Rate) dari sosial media.
  • Memperkuat branding blog.
Apakah Open Graph wajib di Blogger?

Tidak wajib, tapi sangat disarankan agar tampilan share link lebih menarik di sosial media.

Apa bedanya Open Graph dan Twitter Card?

Open Graph dipakai Facebook dan LinkedIn, sedangkan Twitter Card dipakai khusus Twitter/X.

You may want to read this post :

Komentar

Posting Komentar

Postingan populer dari blog ini

Panduan Membuat Halaman Sitemap di Blogger (Support Median UI & SEO Friendly)

Oleh TipsTechPraktis -
Apa itu Halaman sitemap atau daftar isi blog berfungsi sebagai navigasi untuk memudahkan pengunjung menjelajahi semua artikel berdasarkan label. Artikel ini akan membahas cara membuat sitemap khusus untuk template Median UI dengan tampilan profesional, ringan, serta mendukung SEO. Kenapa Sitemap Penting di Blogger? Mempermudah pengunjung menemukan konten Membantu crawler Google dalam mengindeks halaman Menambah struktur internal link blog Menambah nilai SEO halaman Cara Membuat Sitemap Median UI di Blogger 1. Buat Halaman Statis Baru Masuk ke dashboard Blogger > Halaman > Halaman Baru . Beri judul seperti: Sitemap atau Daftar Isi . 2. Gunakan Script Sitemap Tabulasi Otomatis Salin dan tempelkan kode berikut pada mode HTML halaman: Untuk Template Median Ui 1.6 <!--[ Sitemap script DTE, source: dte.web.id/teknis/widget-daftar-isi-tabulasi-blogger ]--> <script src='//dte-project.github.io/blogger/tabbed-toc.min.js?active=0&amp;loa...
Read more »

GoPay Bukan Sekadar E-Wallet: Inilah Inovasi Finansial

Oleh TipsTechPraktis -
Ulasan Aplikasi GoPay: Lebih dari Sekadar Dompet Digital Eh, udah tau belum GoPay ada app baru? Download deh. Dapet 100x GRATIS transfer ke semua bank, jadi bisa hemat s.d. Rp250.000! Selalu ada harga MURAAAH di app GoPay. Ini link downloadnya di bawah. Gopay Ewallet 25MB ios dan android .apk dan ios Apa Itu Aplikasi GoPay? Dulunya hanya fitur tambahan di aplikasi Gojek, kini GoPay hadir sebagai aplikasi standalone di Google Play dan App Store . Fokus utamanya: memberikan pengalaman pembayaran dan pengelolaan uang digital yang cepat, aman, dan fleksibel. Fitur Unggulan yang Jarang Dibahas Transfer Antar Bank Bebas Biaya: Hingga 100x per bulan, bahkan dijamin sampai dalam 1 menit atau Anda dapat kompensasi otomatis. QRIS Satu Scan untuk Semua: Tak peduli tokonya pakai bank apa, cukup scan dengan GoPay. GoPay Later...
Read more »

Cara Membuat Recent Post Otomatis di Blogger Tanpa JavaScript Berat

Oleh TipsTechPraktis -
Widget Recent Post atau postingan terbaru adalah fitur penting di Blogger yang membantu pembaca tetap terhubung dengan konten terbaru Anda. Namun, banyak widget recent post menggunakan JavaScript dari pihak ketiga yang memperlambat loading blog dan berdampak buruk terhadap SEO. Dalam panduan ini, Anda akan belajar cara menampilkan recent post otomatis tanpa JavaScript berat, cukup dengan memanfaatkan fitur feed Blogger dan sedikit pengaturan HTML sederhana. Cara ini ringan, SEO friendly, dan sangat efektif. Kenapa Harus Menghindari JavaScript Berat? Sering memuat dari domain luar Menambah beban render halaman Menurunkan skor Core Web Vitals Membuat struktur data tidak terbaca crawler Cara Kerja Feed Blogger Setiap blog Blogger memiliki feed RSS atau Atom default. Feed ini bisa digunakan untuk menampilkan konten terbaru secara otomatis tanpa skrip berat. https://NAMA-BLOG-ANDA.blogspot.com/feeds/posts/default?alt=rss Kode HTML Recent Post Ringan <b:widge...
Read more »