Cara Validasi Twitter Card Pada Template Kompi Ajaib

Postingan ini untuk melanjutkan postingan yang kemudian wacana template yang saya bagikan. Baik template Kompi Ajaib maupun Dark Template Kompi Ajaib mempunyai dasar template yang sama, hanya tampilan saja yang berbeda.

Nah pada kedua template tersebut sudah saya lengkapi dengan Open Graph dan Twitter Card. Untuk Open Graph sesungguhnya tidak ada problem alasannya ialah itu akan otomatis bekerja, namun untuk Twitter Card perlu ada tindakan lanjutan yaitu validasi Twitter Card.

Nah untuk itu postingan ini dibentuk untuk melengkapi cara validasi Twitter Card pada kedua template Kompi Ajaib tersebut. untuk lebih terang wacana Twitter Card ini, silahkan simak postingannya.


Pada template Kompi Ajaib terdapat arahan Open Graph dan Twitter Card menyerupai di bawah ini.

 <b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageName' property='og:title'/>
<meta expr:content='data:blog.canonicalUrl' property='og:url'/>
<meta content='article' property='og:type'/>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta expr:content='&quot;Silahkan baca artikel &quot; + data:blog.pageName + &quot; ini selengkapnya di &quot; + data:blog.title + &quot;&quot;' property='og:description'/>
</b:if>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta content='Blog Description Here.' name='description'/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta content='website' property='og:type'/>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta expr:content='&quot;Silahkan kunjungi &quot; + data:blog.pageTitle + &quot;Untuk membaca postingan-postingan menarik.&quot;' property='og:description'/>
</b:if>
</b:if>
<b:if cond='data:blog.postImageUrl'>
<meta expr:content='data:blog.postImageUrl' property='og:image'/>
<b:else/>
<b:if cond='data:blog.postImageThumbnailUrl'>
<meta expr:content='data:blog.postThumbnailUrl' property='og:image'/>
<b:else/>
<meta content='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_UFxVs0MwFztIisteafZo9BVEiLkLvXTmxrYW9b1R_D3F7QqA-6VC7wcZ0AC_llfLyC3m_7aLKYiz3y_sXCsftkTRM_kbd_vmduUzzkAzhP5_lEDgtpNd2TcuK4HPvU3R5UNyPnQYzQRk/s1600/Graphic1.png' property='og:image'/>
</b:if>
</b:if>
<meta content='xxxxxxxxxxxxxx' property='fb:admins'/>
<meta content='xxxxxxxxxxxxxx' property='fb:profile_id'/>
<meta expr:content='data:blog.title' name='twitter:site'/>
<meta content='summary_large_image' name='twitter:card'/>
<meta content='@UsernameTwitter' name='twitter:creator'/>

Yang perlu Anda sesuaikan ialah untuk fb:admins dan fb;profil silahkan ganti xxxxxxxxxxx dengan id unik profil fb Anda. Dan untuk UsernameTwitter silahkan ganti dengan username Twitter Anda.

Setelah kedua hal di atas diadaptasi masing-masing dengan akun fb dan twitter Anda, maka sekarang tinggal melaksanakan validasi Twitter Card. Silahkan susukan link di bawah ini.

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

Silahkan masukan URL blog Anda pada kolom yang tersedia kemudian klik tombol Preview card seperti pada gambar di bawah ini.


Setelah muncul Card preview di sebelah kanan, silahkan klik tombol Request approval dan akan muncul beberapa data wacana akun Twitter Anda, jikalau perlu silahkan lengkapi Deskripsi Blog kemudian klik lagi tombol Request approval.


Kemudian sesudah itu akan muncul notifikasi "whitelist request for card is pending approval".


Nah silahkan Anda buka kotak masuk email Anda dan buka email dari Twitter Card.


Setelah itu silahkan refresh halaman validasi Twitter Card tadi. Maka jikalau Twitter Card blog Anda sudah di-approval, halaman validasi Twitter Card akan menyerupai gambar di bawah ini.


Kemudian silahkan cek halaman Twitter Anda, maka tweet postingan Anda akan menyerupai gambar di bawah ini, muncul view summary untuk menampilkan thumbnail dan summary postingan.



Sumber https://www.kompiajaib.com/

0 Response to "Cara Validasi Twitter Card Pada Template Kompi Ajaib"

Posting Komentar

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel