Sebenarnya saya sudah pernah share cara untuk menggunakan emoji dari Twitter emoji di dalam postingan blog, namun itu hanya untuk blog non AMP karena menggunakan script.Kemudian saya mencari cara agar bisa dengan mudah menggunakan emoji di postingan blog AMP maupun blog non AMP tanpa menggunakan script.
Akhirnya saya menemukan cara mudah menggunakan emoji dari Twemoji di postingan blog
Sebenarnya di blogger sudah disediakan emoji, tapi masih hitam putih. Kalau pakai ini kan postingan jadi lebih berwarna, bukan?
Caranya cukup mudah, kita hanya copy image untuk emoji-nya lalu paste di postingan. Saya sudah menyediakan list emoji untuk copy image emoji.
Hanya pilih emoji yang ingin dipakai lalu klik kanan pada emoji tersebut lalu copy image, kemudian paste di postingan.
Kemudian silahkan di mode HTML lakukan seperti berikut:
Silahkan tambahkan kode attribute berikut pada kode
<img untuk setiap emoji yang ditambahkan:
class="emojika" width="16" height="16"Sehingga menjadi seperti ini.
<img class="emojika" width="16" height="16" alt="🆚" src="https://twemoji.maxcdn.com/16x16/1f19a.png" />Untuk blog AMP, rubah kode
<img jadi <amp-img dan kode /> di akhir kode jadi ></amp-img> sehingga menjadi seperti berikut:
<amp-img class="emojika" width="16" height="16" alt="🆚" src="https://twemoji.maxcdn.com/16x16/1f19a.png" ></amp-img>Kemudian silahkan simpan CSS berikut di edit HTML agar emoji tampil rapih.
Untuk blog non AMP simpan di style:
.post-body img.emojika{width:16px;height:16px;vertical-align:middle}Untuk blog AMP simpan di style amp-custom:
.post-body amp-img.emojika{vertical-align:middle}Mudah bukan?