Widget Twitter Tweets Untuk Blog Valid AMP


Sejak awal saya blogging dengan menggunakan template valid AMP HTML saya sempat merasa kesulitan ketika saya ingin memasang widget untuk menghubungkan tweet Twitter ke blog saya yang sudah menggunakan template AMP HTML ini. Akhirnya proses pencarian yang saya maksud selama ini yaitu "Cara Memasang Widget Twitter Tweets Untuk Blog Valid AMP" terjawab juga dan saya berhasil menemukan satu blog yang membahas tentang apa yang selama ini saya cari.

Untung saja saya dapat tutorial tersebut melalui dunia maya, meskipun jauh dari Spanyol sana namun rasanya sangat dekat dan tidak mengeluarkan banyak biaya untuk beli tiket pesawatnya... πŸ˜€ πŸ˜€ πŸ˜€
Coba saja kalau saya benar-benar harus berkunjung langsung ke Spanyol dalam dunia nyata, mungkin gaji saya selama 1 Tahun penuh pun tidak cukup... πŸ˜… πŸ˜… πŸ˜… πŸ˜… πŸ˜…

Meski didalam tutorial itu menggunakan bahasa Spanyol namun tidak ambil pusing, jurus andalan "Bing Penerjemah dan Google penerjemah pun saya gunakan sebagai senjata ampuh untuk menaklukan bahasa Spanyol yang saya sendiri tidak mengerti.

Kembali ke topik pembahasan kita kali ini yaitu "Cara Memasang Widget Twitter Tweets Untuk Blog Valid AMP".

Kali ini kita akan belajar dalam tutorial ini untuk mengintegrasikan widget Twitter di  blog valid Accelerated Mobile Pages Project (AMP), fungsi widget ini yaitu akan menampilkan tweets yang telah kita posting pada halaman twitter sobat. Pada dasarnya didalam widget ini tertanam sebagai timeline.

Kode widget ini sangat sederhana, cukup ikuti petunjuk dalam tutorial ini dan diimplementasikan di blog AMP sobat.

Saya mengingatkan kepada sobat bahwa tutorial ini hanya untuk pengguna Blogger yang sudah menggunakan template Blogger valid Accelerated Mobile Pages Project (AMP) saja. Widget ini juga dapat di gunakan pada platform web atau blog lain seperti blogger, wordpress, jomla, dan sebagainya.

Sebelum sobat mengikuti langkah-langkah di bawah ini, pastikan bahwa pada template sobat sudah terpasang komponen berikut.

< script async = 'async' custom-elemen = 'amp-iframe' src = 'https://cdn.ampproject.org/v0/amp-iframe-0.1.js' / >


Namun jika pada template sobat belum terpasang komponen diatas, silahkan sobat copy semua komponen diatas dan letakan di bawah kode <head> atau diatas kode </head>

Untuk langkah-langkahnya silahkan sobat simak baik-baik dibawah ini.

1 . Sign-in akun Blogger sobat


2. Klik "Tata Letak"


3. Klik pada "Tambahkan Gadget"


4. Pilih "HTML / JavaScript"


5. Masukan baris kode berikut


 < amp-iframe lebar = '290'
tinggi = '300'
Sandbox = 'memungkinkan-script memungkinkan-sama-asal memungkinkan-Popup'
frameborder = '0'
bergulir = 'ya'
src =' https://cdn.rawgit.com/Luis-Chavez/Embed-Tweet/adad4db8/.html?user='MidaMaxNet'>
< / amp-iframe >


Silahkan sobat ubah nama pada teks dengan tanda warna kuning yang mengatakan MidaMaxNet ganti dengan username profil twitter sobat.

Jika Anda ingin untuk menambah atau mengurangi ukuran widget, sobat dapat mengubah nomor yang ditandai dengan warna kuning

lebar ='290'
tinggi ='300'

6. Lalu klik "Simpan"

Tempatkan widget twitter ini tepat di bawah Popular Post

Untuk DEMO-nya silahkan lihat bagian sidebar blog ini

Selesai!, sekarang sobat pergi ke blog sobat dan menikmati widget Twitter baru pada blog valid AMP milik sobat.

Butuh bantuan?

Jika ada yang ingin di tanyakan, silahkan tinggal kan pesan sobat di kolom komentar di bawah ini.






You Might Also Like

Comments: