Sunday, December 11, 2016

Cara Memasang Telegram dan WhatsApp Share Button Valid AMP

Oprek-oprek sebuah kode dan selalu ingin mencari hal yang baru adalah hobi saya. Setelah kemarin Kang Ismet mengirimkan sebuah artikel yang berjudul Telegram Share Button for Blogger (AMP/non-AMP), akhirnya saya pun berinisiatif untuk menggabungkan kode WhatsApp share button dengan kode Telegram share button dengan menggunakan fungsi tabel, supaya keduanya bisa berdampingan satu sama lain (kek truck aja, gandengan mulu) 😈 Yuk, langsung saja pantengin dan pelototin kodenya satu-persatu, lalu terapkan pada blog AMP Anda, supaya pembaca setia blog Anda betah nongkrong berjam-jam di blog Anda, karena mereka merasa diuntungkan sekali dengan adanya Telegram and WhatsApp share button sebagai sarana berbagi mereka kepada orang lain. Dan tentu saja hal ini dapat menambah pengunjung blog Anda 😄

Untuk demo-nya, bisa Anda kunjungi blog ini dengan menggunakan smartphone Anda  ðŸ˜ƒ

Langkah pertama.

Simpan kode di bawah, di mana saja sesuai keinginan Anda.

<table>
<tbody>
<tr>
<td><amp-social-share expr:data-share-endpoint='&quot;tg://msg?text=&quot; + data:post.title + &quot; - &quot; + data:blog.url' layout='container' type='telegram'>
    <amp-img alt='Telegram' height='37' layout='fixed' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwaPJZNU4pvygCL6wBmL49oVa8NPxL1plqoc2DEZks7sN3dKGVZwFpj9DCvf__yOsHkC9AEXGzzj7QeWRA9JTVIMMNa78FhHa7sPYzhXh2ElklPDgzbqxmsIT7ynQwH_fX0-1R63vhaVg/s1600/telegram.png' width='37'/>
</amp-social-share></td>
<td><amp-social-share data-share-endpoint='whatsapp://send' expr:data-param-text='data:post.title + &quot; - &quot; + data:blog.url' layout='container' type='whatsapp'>
    <amp-img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyIxbsvno8bzDoMNijR0-nDLcIXhqrJGw0Vi_wOViO4gu9b6GkiLVH3qlxqShHAkiMBeIBsFmlzx96ffI4nKn7QaC-D3_mDfCtJGpzUvGX0RG2s-JGjhS9SDNmipiRWdwzyHTSZNngwXqA/s1600/wa.png"
      width="37"
      height="37"
      layout="fixed"
      alt="Share via Whatsapp"></amp-img>
</amp-social-share></td>
</tr>
</tbody>
</table>


Notes: Bagi Anda yang ingin menampilkan tombol share tersebut pada tampilan mobile saja, tambahkan kode di bawah tepat di atas kode <table> dan di bawah kode </table>.

<b:if cond='data:blog.pageType == &quot;item&quot; and data:blog.isMobileRequest == &quot;true&quot;'>
 TEMPEL KODE TELEGRAM DAN WHATSAPP SHARE BUTTON DI SINI!
 </b:if>


Untuk penampakan kode yang sudah jadi, bisa Anda lihat pada gambar di bawah ini 😎



That's all~

Artikel Terkait

Load comments