Ingin menampilkan video di blog Anda?
Untuk menampilkan video di blog sama seperti Anda menambahkan photo atau gambar. Pada entri post yang Anda buat klik fitur image yang letaknya diatas kolom writing post, yaitu diantara fiturl link dan fitur blockquote. Kemudian Anda hanya tinggal mengatur ukuran layar, agar layar responsive untuk semua ukuran layout, buat ukuran lebar dengan prosentase.
Misalkan lebar penuh ukuran layar html desktop 600px pada kolom posting dan layar penuh ukuran layar mobile 320 px. Perbedaan ini akan menyesuaikan lebar video dengan ukuran lebar dengan prosentase, misalkan width= "90%", untuk tampilan di tengah dan atau width="100%", untuk ukuran width full body.
Dan jika Video yang ingin ditampilkan ada kontrolnya, baik kontrol play on, off dan mute. Maka video yang di upload diubah kode didalamnya. Caranya pada entry post, switch dari fitur compose ke fitur html. Kemudian ubah menjadi seperti di bawah ini. Kode di bawah untuk html 5.
<video width="400px" height="350px" controls> <source src="url/*.mp4" type="video/mp4"> <source src="url/*.ogg" type="video/ogg"> </video>
Lalu bagaimana untuk menampilkan video yang ada di Facebook?
Sekarang ini, masing - masing platform sosial media telah membuat frame embedded masing - masing, termasuk juga Facebook dan Instagram. Dan agar tampilan video bisa di play di blog tanpa dialihkan ke link video itu berada.
Maka Anda harus membuat embedded video facebook. Caranya, facebook telah membuat formulanya, Anda cukup copy paste dari formula itu. Untuk membuat formula, pertama klik link video yang ada di halaman facebook. Untuk mengetahui link video
- pada video facebook, diatas video di sebelah kanan ada fitur titik tiga horisontal. Klik fitur tersebut
- Kemudian setelah tampil layout pop up, scroll ke bawah, klik "link tautan" yang ada di paling bawah
- Buka link ini Facebook Developers Tool
- Kemudian masukan atau paste link tautan tadi ke kolom url video
- Selanjutnya klik dapatkan kode
- copy masing - masing kode tersebut
- untuk kode di bawah ini simpan di atas bodt atau di bawah body
<div id="fb-root"></div> <script async defer crossorigin="anonymous" src="https://connect.facebook.net/id_ID/sdk.js#xfbml=1&version=v4.0&appId=1696873897025372&autoLogAppEvents=1"></script>
- Dan kode di bawah ini adalah tampilannya, simpan atau paste di bawah body
<div class="fb-video" data-href="https://www.facebook.com/1429672729/posts/10220909373110641/?app=fbl" data-width="500" data-show-text="true"></div>
- Selesai
Sekarang dengan tampilan embedded dari Facebook, video dapat ditayangkan diblog tanpa dialihkan ke link asalnya. Untuk ukuran agar responsive ada dapat ubah kode layout dengan responsive.
Dan seperti juga menampilkan video dari twitter, youtube dan instagram, selain menggunakan embedded juga dapat ditampilkan dengan menggunakan iframe, yaitu bingkai video yang ketika di play akan dialihkan ke link asalnya.
Demikian cara menambahkan video di blog.
Semoga bermanfaat.
No comments:
Post a Comment