CSS3 – Page 3 – News Today Buffington

Cara Mendapatkan @font-face Google Fonts Agar Sesuai Device Dan Browser

Feb 13, 2019

—

by

Baiklah, kita mulai tutorialnya. Di sini saya menggunakan browser Chrome, dan alat yang dibutuhkan adalah User Agent Switcher. Silahkan masuk ke sini untuk mendapatkan ekstensi User Agent Switcher for Chrome. Silahkan tambahkan ekstensi tersebut ke browser Chrome Anda.Setelah ekstensi berhasil ditambahkan, maka akan muncul di kanan atas browser. Sekarang silahkan pergi ke Google Fonts untuk

Responsive Iframe Dengan Multi Server

Jan 19, 2019

—

by

Mr Android

in Blogger, CSS3, HTML5, Trik, Tutorial, Widget

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

Jan 1, 2019

—

by

Mr Android

in Blogger, CSS3, HTML5, Trik, Tutorial, Widget

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…

Membuat Tombol Chat Whatsapp Melayang Di Blog Dengan SVG

Dec 18, 2018

—

by

Mr Android

in Blogger, CSS3, HTML5, Tutorial, Widget

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

Membuat Multi Server Video Pada Fluid Player File m3u8

Nov 18, 2018

—

by

Mr Android

in Blogger, CSS3, HTML5, Trik, Widget

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

Oct 31, 2018

—

by

Mr Android

in AMP, Blogger, CSS3, HTML5, Trik, Tutorial, Widget

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

Oct 14, 2018

—

by

Mr Android

in Blogger, CSS3, HTML5, Trik, Tutorial, Widget

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

Oct 13, 2018

—

by

Mr Android

in Blogger, CSS3, HTML5, Trik, Tutorial, Widget

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…

Memainkan Dua Sumber Video Atau Lebih Dalam Satu Elemen Video HTML5

Sep 30, 2018

—

by

Mr Android

in Blogger, CSS3, HTML5, Javascript, Trik, Tutorial

Hal ini bisa dilakukan dengan bantuan javascript untuk memutar bagian pertama kemudian menyambung ke bagian selanjutnya sampai video selesai. Berikut javascript-nya, silahkan simpan di atas kode //var myvid = document.getElementById(‘video-id’); myvid.addEventListener(‘ended’, function(e) { // get the active source and the next video source. // I set it so if

Cara Embed Video Yang Diupload Di Blogger Agar Responsive

Sep 3, 2018

—

by

Mr Android

in AMP, Blogger, CSS3, HTML5, Trik, Tutorial

Mengupload video di Blogger ini sangat mudah, yang jelas harus disiapkan file videonya misal dengan format MP4. Silahkan klik ikon upload video di bar atas di editor postngan pada mode compose seperti gambar berikut. Silahkan upload video Anda. Setelah proses upload video selesai, silahkan alihkan editor post ke mode HTML untuk mendapatkan kode videonya. Biasanya…

Category: CSS3