Kami berusaha menyediakan website yang berguna untuk pengetahuan para pembaca, panduan singkat dan sederhana ini semoga menjadi jalan bagi kalian yang mengalami kesulitan dalam membuat blog di dunia maya, kami mengambil sumber dari blog Panduan Blog Online.com seandainya kalian berkenan langsung mengunjungi website tersebut, selamat menikmati!
Anda pernah membaca artikel yang dilengkapi dengan video menarik? Tahukah Anda bahwa video tersebut bisa saja berasal dari website lain? Itulah contoh penggunaan iFrame.
Apa itu iFrame? Di artikel ini, kami akan membahas iFrame secara lengkap, termasuk cara penggunaan dan beberapa contohnya. Mari baca lebih lanjut!
iFrame adalah singkatan dari Inline Frame, sebuah komponen dari file HTML yang memungkinkan Anda menyematkan video, dokumen, dan file lainnya ke dalam sebuah halaman website.
Proses untuk menyematkan file dengan teknik ini disebut sebagai embed iFrame. Pada sebuah file HTML, penggunaan iFrame ditandai dengan adanya tag <iframe>.
Ketika menggunakan iFrame HTML, file yang disematkan bisa berasal dari halaman lain website Anda. Namun, bisa juga dari website lain. Contoh yang paling umum dari penggunaan iFrame adalah penyematan video YouTube.
Anda bisa dengan mudah mengunggah file yang Anda butuhkan ketika membuat artikel di blog/website. Lalu, kenapa harus menggunakan iFrame?
Jawabannya adalah menggunakan iFrame memberikan berbagai keuntungan. Apa saja?
Kadang Anda menemukan konten menarik di internet dan ingin menggunakannya di website Anda. Hal yang akan Anda lakukan mungkin mengunduh file tersebut, dan lalu mengunggahnya kembali di postingan Anda.
Bagaimana jika file tersebut ternyata memiliki hak cipta? Anda tentu harus siap dengan konsekuensi hukum yang akan Anda terima jika pemiliknya keberatan.
Nah, penggunaan iFrame bisa menghindarkan anda dari pelanggaran hak cipta. Sebab, penyematan konten dari pihak lain dengan cara embed iFrame tidak melanggar hak cipta.
Salah satu contohnya adalah pernyataan di laman resmi YouTube. Disebutkan bahwa secara default, setiap video YouTube bisa disematkan pada website lain. Jika pengguna YouTube ingin menerapkan pembatasan (restriction), mereka bisa melakukan setting khusus terlebih dahulu.
Jadi, jika ingin menggunakan konten dari website lain, menggunakan iFrame merupakan cara paling aman. Namun, tentu saja secara etika Anda tetap disarankan untuk meminta izin dari pemilik konten yang bersangkutan.
iFrame bisa membantu Anda mengurangi penggunaan media penyimpanan. Sebab, Anda tidak perlu mengunggah semua file ke Media Library WordPress.
Dengan embedding iFrame, file yang Anda gunakan tidak disimpan di server hosting Anda. Jadi, Anda tidak perlu khawatir kehabisan storage.
Sebagai contoh, ketika Anda melakukan embed video YouTube di website Anda, video tersebut masih berada di server milik YouTube. Saat pengunjung memutar video di website Anda, aksesnya pun langsung dari server YouTube.
Dengan kondisi ini, Anda jadi tidak perlu ragu ketika ingin menampilkan file video dengan kualitas terbaik yang umumnya memiliki ukuran file cukup besar.
Nah, walaupun menggunakan iFrame memiliki banyak keuntungan, ada kekurangan yang harus Anda waspadai.
Penggunaan iFrame harus selalu mempertimbangkan faktor keamanan. Artinya, Anda harus benar-benar mengetahui keamanan website yang memiliki file tersebut. Jika website tersebut rentan malware, tentu akan mengganggu kondisi website Anda.
Apabila ingin mempelajari cara mengamankan website, Anda bisa megunduh ebook keamanan WordPress di bawah ini.
Setelah mengetahui manfaatnya, saatnya Anda belajar cara menggunakan iFrame dengan beberapa metode yang berbeda.
Metode pertama adalah dengan memasukkan elemen iFrame secara manual ke dalam HTML. Pada metode manual, Anda bisa menggunakan tag <iframe> berikut tautan dari file yang ingin Anda sematkan.
Kode yang digunakan adalah <iframe src="https://www.example.com"></iframe>. Anda bisa mengganti example.com dengan tautan yang Anda inginkan
Perlu diingat bahwa Anda hanya bisa melakukan embed konten dari website yang memiliki protokol yang sama. Artinya, jika website Anda menggunakan https, gunakan tautan yang berasal dari website dengan https juga.
Selain itu, Anda juga bisa mengatur bagaimana iFrame ditampilkan. Misalnya seperti contoh di bawah ini:
iFrame di atas ditampilkan dalam ukuran 680×480 piksel. Oleh karena itu, kode HTML yang digunakan harus menambahkan parameter weight dan height. Weight untuk lebar iFrame, height untuk tingginya.
Inilah kode HTML yang kami gunakan: <iframe src="https://www.example.com" width="680" height="480"></iframe>
Selain menambahkan kode secara manual, Anda juga bisa menyematkan kode embed untuk membuat iFrame. Hal ini berguna jika Anda ingin menggunakan konten tertentu dari sebuah website, misalnya YouTube.
Cara membuat iFrame dengan kode embed dari YouTube adalah sebagai berikut:
Pada video YouTube yang Anda saksikan, akan ada tombol Share.
Ketika memilih tombol tersebut, Anda akan menemukan pilihan cara untuk membagikan video. Salah satunya dengan cara embedding.
Saat Anda memilih kode embed, YouTube akan menampilkan kode yang bisa Anda gunakan di website Anda. Silakan klik Copy.
Inilah contoh kode embed yang kami gunakan:
<iframe width="560" height="315" src="https://www.youtube.com/embed/Fsxf_KsaUX8" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
Selanjutnya, masuk ke Block Editor WordPress Anda untuk membuat posting. Lalu, tempel kode embed yang sudah Anda dapatkan dari YouTube. Pastikan Block Editor telah mengenalnya sebagai Custom HTML.
Jika berhasil, inilah tampilan posting Anda saat sudah diterbitkan.
Anda juga bisa menggunakan plugin untuk membuat iFrame.
Plugin adalah software yang menawarkan fungsi tambahan untuk website WordPress Anda. Untuk menggunakan plugin WordPress, Anda harus mengunduh dan menginstalnya terlebih dahulu.
Ada banyak plugin iFrame yang tersedia di WordPress directory. Salah satunya adalah iframe.
iframe memudahkan Anda untuk menyematkan konten dari YouTube, Vimeo dan lainnya dengan menggunakan shortcode. Inilah contoh penggunaan shortcodenya:
Tidak hanya itu, plugin WordPress ini juga memungkinkan Anda melakukan kustomisasi pada konten yang ditampilkan seperti scroll bar, frame border hingga transparansi. Caranya, Anda bisa menambahkan beberapa parameter sebagai berikut:
[iframe frameborder="0"][iframe scrolling="yes"][iframe allowtransparency="true"]WordPress merupakan CMS (Content Management System) yang ramah pengguna. Platform ini memungkinkan Anda untuk menyematkan file dari website lain dengan mudah.
Menggunakan editor terbaru WordPress yaitu Gutenberg, langkah tersebut bisa dilakukan melalui menu embed WordPress.
Inilah cara melakukannya:
Pada halaman WordPress Block Editor, silakan pilih menu tambah, dan pilih menu Embed.
Dari berbagai pilihan, silakan pilih platform yang Anda ingin gunakan. Di contoh ini, kami menggunakan YouTube.
Masukkan tautan video YouTube di kolom yang tersedia, lalu klik Embed.
Setelah proses embedding berhasil, inilah tampilan preview yang muncul di halaman editor Anda.
Anda baru saja belajar cara menggunakan iFrame. Tidak sesulit yang Anda bayangkan, bukan?
iFrame merupakan elemen yang bisa Anda tambahkan pada sebuah halaman HTML. Tujuannya untuk membuat artikel/konten website Anda lebih menarik.
Selain itu, iFrame memiliki banyak kelebihan yaitu membantu Anda menghemat penggunaan storage dan menghindarkan Anda dari pelanggaran hak cipta.
Semoga informasi ini bermanfaat. Jangan ragu untuk selalu membuat beragam konten yang menarik dan sukses selalu untuk Anda.
Source:niagahoster.com
No comments:
Post a Comment