01 June, 2015

Membuat Twitter Cards Link Posting Blogspot

Hello, bro and sis kali ini kita akan mencoba membuat Twitter Card untuk url posting blog blogspot dengan cara yang sangat mudah. Tapi sebelum kita mulai ada baiknya mengetahui sedikit Apa itu Twitter Card


Twitter Cards

Twitter Cards (Kartu Twitter) merupakan semacam media attch foto, video atau media yang lainnya dan di sematkan di tweet yang kita kirim. Di samping itu juga di sertakan cuplikan sekitar 200 karakter kata di dalamnya untuk di share kepada followers kita. Sehingga link atau tweet kamu tersebut kelihatan sedikit lebih profesional ... cieee :))

Tuch kurang lebih seperti di bawah ini contohnya. Sebenarnya twitter cards ini mirip-mirip dengan summary link pada share di posting status facebook atau google+

Tapi sayangnya di twitter, kita harus sedikit melakukan penambahan meta tag pada website atau blog kita untuk membuatnya.  Tapi tenang tidak sulit menerapkannya di dalam blogger blogspot kita. Sip kita langsung lanjut saja ...



Cara membuat tweet Twitter Cards

Partama-tama login dahulu ke dasbord panel blogger kamu. Diamkan saja dahulu kemudian langsung menuju ke link validation twitter card dan login dengan akun twitter kamu
https://cards-dev.twitter.com/validator

Ini nanti untuk validasi kartu twitter kamu apakah sudah berhasil atau belum?, kurang lebih jika belum berhasil gambarnya akan seperti ini. Itu jelas karena blogspot kita belom di setting dan di tambahkan kode meta tag.


Oke sekarang kembali ke dasbord blogspot kamu


Mulai Menambahkan kode Meta tag

Kemudian pada Template
Edit HTML
Cari kode <head>

Oke , sudah ketemu?, jika sudah copy paste kode berikut ini di bawah kode <head> :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
      <b:if cond='data:blog.postImageUrl'>
        <b:if cond='data:blog.metaDescription'>
          <meta content='summary' name='twitter:card'/>
          <meta content='@depalpiss' name='twitter:site'/>
          <meta content='@depalpiss' name='twitter:creator'/>
          <meta expr:content='data:blog.pageName' name='twitter:title'/>
          <meta expr:content='data:blog.metaDescription' name='twitter:description'/>
          <meta expr:content='data:blog.postImageUrl' name='twitter:image:src'/>
          <meta expr:content='data:blog.homepageUrl' name='twitter:domain'/>
        </b:if>
      </b:if>
</b:if>

Nah itu username saya @depalpiss ganti dengan usarname twitter kamu. Jika sudah beres SIMPAN TEMPLATE


Validasi Kartu

Langkah terakhir kambali menuju twitter validasi kartu, dan masukkan url salah satu postingan kamu di kotak validasi


contoh saya memasukkan url posting saya ini : http://www.superblog.info/2015/05/retouching-foto-model-menjadi-karakter.html

Jika berhasil akan di tampakkan kartu kamu, dan beres... nah sekarang coba buat tweet dengan menyertakan salah satu url posting kamu di twitter. Biasanya untuk sharing tweet perdana ringkasan dan gambar belum muncul, sedikit membutuhkan waktu sekitar beberapa jam.

Catatan : Oh iya sedikit tambahan info untuk membuat twitter cards ini bekerja jangan lupa pada setiap postingan di Setelan entri isikan kata-kata dalam Deskripsi Penelusuran selain untuk SEO itu juga untuk menangkap summary yang nanti akan di sharing via twitter.

Sip beres cukup mudah caranya... selamat mencoba & salam ... :)

6 comments

  1. saya sih pengen banget ya mas bikin ini, tapi saya nggak punya twitter, dulu sih punya, tapi password nya lupa.. hahaha

    ReplyDelete
    Replies
    1. h ah aha :)) bisa begitu di itu aja gan pake link lupa password di form loginnya :))

      Delete
  2. Tutorny boleh juga ni mas, ijin bookmark dulu ya, nanti mau dicoba...

    ReplyDelete
    Replies
    1. siap sobat Daniel makasih kunjungannya salam ngeblog :)

      Delete
  3. oh jadi kelihatan lebih menarik tweetnya yamas.
    kayaknya perlu dicobain nih.
    soalnya saya jarang ngakses twitter mas.update artikel aja saya buat otomatis

    ReplyDelete
    Replies
    1. sip Mas Yanto :)) kalo saya twitter sana google+ seneng, malahan facebook yang jarang tuk sosial media sharing link blog!

      Delete


Copyright © 2016 Photoshop blog dan Blogger