Category: Widget
-
Responsive Iframe Dengan Multi Server
Agar lebih jelas, silahkan coba pada demo JSFiddle berikut ini, klik tombol demo di bawah ini. Open FiddleJika Anda ingin mencobanya, silahkan ikuti langkah berikut ini:Silahkan tambahkan CSS berikut pada style blog Anda. .div-frame { position: relative; width: 100%; overflow: hidden; font-family:-apple-system,BlinkMacSystemFont,”Roboto”,”Segoe UI”,”Oxygen-Sans”,”Ubuntu”,”
-
Custom Search Engine Adsense Sesuai Label Post Atau Keyword Dalam Postingan Blog
Jawabannya tentu saja bisa. Kita bisa mengedit custom search engine agar iklan yang ditampilkan sesuai dengan label post atau bisa dengan target keyword tertentu (sebaiknya dengan keyword yang masih berhubungan dengan niche blog) dan kita menampilkannya di dalam postingan blog.Tentu saja dengan ini kita tidak tergantung pada pengunjung yang melakukan pencarian agar melihat atau mengklik…
-
Widget Recent Post Untuk AMP Dengan Next Prev
Widget Recent Post Untuk AMP Dengan Next Prev yang dimaksud adalah seperti pada demo berikut: Demo Untuk menyimpan widget recent post ini di sidebar blog AMP, silahkan copy kode berikut ini dan simpan di antara widget di sidebar melalui EDIT HTML. …
-
Membuat Tombol Chat Whatsapp Melayang Di Blog Dengan SVG
Tombol ini saya buat dengan 2 versi yaitu menampilkan ikon dengan CSS dan menampilkan ikon dengan HTML. Tentu saja keduanya menggunakan ikon SVG. 1. Ikon dengan CSSDengan ini maka kode HTML menjadi lebih simpel karena tidak menggunakan kode HTML ikon SVG. Simpan kode HTML berikut di atas kode
-
Cara Embed Chatango Pada Blog AMP HTML
Jika Anda ingin mencoba embed Chatango pada blog AMP Anda, silahkan ikuti langkah-langkahnya berikut ini. Yang pertama dilakukan adalah silahkan buat chat group Chatango pada akun Chatango Anda. Untuk Embed as silahkan pilih Box dan hilangkan centang pada Full width ticker on mobile. Untuk Size silahkan pilih Responsive. Untuk warna dan lainnya silahkan sesuaikan dengan…
-
Membuat Multi Server Video Pada Fluid Player File m3u8
Seperti pada postingan saya sebelumnya tentang cara embed file m3u8, kita bisa menggunakan plugin FluidPlayer untuk memutar video HLS m3u8. Dan ada sahabat Kompi yang menanyakan cara membuat multi server pada player m3u8 ini. Untuk itu sebelum ini saya sudah melakukan beberapa percobaan untuk mencoba mengganti source video dengan javascript, namun gagal. Dan kemudian saya…
-
Membuat Permalink Dengan Tombol Copy To Clipboard Untuk Blog AMP
Permalink dengan tombol Copy to clipboard untuk blog AMP ini bisa disimpan di dalam postingan, misalnya di bawah postingan. Ini menggunakan amp-iframe, menjalankan JS kustom yang dimuat di latar belakang dengan tombol placeholder yang tetap terlihat. Untuk demonya silahkan coba di JSFiddle berikut ini. Silakan klik ikon Copy to clipboard untuk menyalin permalink-nya. Open Fiddle
-
Cara Embed File m3u8 Dengan Responsive Video HTML5
Kita bisa mengunakan plugin yang support HLS yang gratis yaitu plugin Fluid Player. Dengan ini kita bisa melakukan kustom video HTML5. Jika Anda memiliki file m3u8 dan ingin menampilkannya di blog untuk ditonton secara online, silahkan ikuti langkah-langkahnya di bawah ini. Silahkan simpan kode berikut ini di atas kode //function loadCSS(e, t, n) { “use…
-
Cara Embed Video Google Drive Dengan Elemen Video HTML5
Seperti kita ketahui bahwa Google Drive memang sudah menyediakan kode embed dengan iframe, namun ada sedikit yang mengganjal untuk saya khususya jika digunakan untuk embed video. Yaitu kita harus klik 2 kali untuk memutar video dan terdapat ikon link untuk preview video ke Google Drive di kanan atas player yang cukup mengganggu tampilan player. Dengan…
-
Menggunakan CDN Staticaly Pada Thumbnail Related Post Dari DTE
Masih ingat cara agar related post DTE supaya support HTTPS? Nah trik untuk mengubah protokol semua gambar related post DTE menjadi CDN Staticaly ini sama seperti merubahnya menjadi support HTTPS dan sebetulnya konsepnya sama seperti javascript kemarin yang untuk menggunakan CDN Staticaly dengan mudah secara otomatis pada semua gambar. Javascript related post DTE itu tampak…