Dua Kalkulator Kehamilan Puisi Lucu & Romantis Kalimat/Ungkapan Indah Ucapan Selamat Malam Romantis Kata-2 GalauKoleksi Kata-Kata Gombal Mukio
Download Ringtone Lucu Gokil
Curhat Cewek Tentang Cowok
Punya Pacar vs LDR vs Jomblo
Alat Membuat Tulisan Gaul Alay
Alat Membuat Tulisan Terbalik
Daftar Semua Kategori:X
X
Ramalan Zodiak Hari Ini Kata Mutiara Cinta Kompilasi Lagu Nostalgia Cara Download Video Youtube Status Facebook LucuKumpulan SMS Cinta Romantis

Video Youtube Menampilkan kumpulan video youtube otomatis via keyword sebenarnya mudah, :) namun bagi yang belum tahu caranya tentu saja kesulitan ~x( setengah mati, kalau kemudian menggunakan cara manual, hmmm capek gitu loh, iya enggak? Nah kali ini Warung Bebas kembali membahas belajar ngeblog, dan kali ini memberikan widget menampilkan video youtube cara mudah.

Kalau bingung maksudnya, Anda bisa lihat tampilannya seperti dipostingan Koleksi Trailer Film Harry Potter and the Deathly Hallows, atau di Koleksi Video Lucu Gokil Lengkap Terbaru. Namun dipostingan tadi itu cocoknya untuk theme / template tertentu saja, nah yang kali ini lebih universal, alias bisa dipasang di blog atau situs mana saja dengan template apapun.

Tampilannya bisa Anda lihat DISINI (ada 8 contoh tampilan), untuk memutar masing-masing gambar video tinggal diklik gambar videonya dan akan langsung diputar tanpa reload halaman. Selain itu juga dilengkapi link download, code embed dilengkapi link ke blog kita sendiri (ada setting parameter) untuk tiap video yang sedang aktif di playernya.

Fitur Lengkap:

  1. Menampilkan video via keyword, dengan pilihan match, user, mostviewed, dan tagged, untuk melihat beda dari opsi-opsi tersebut lihat Contoh 1, Contoh 5 , Contoh 6 , Contoh 7 .
  2. Link download video via web ke keepvid.com yang bisa diarahkan ke adf.ly dulu secara otomatis atau program sejenis (misal bc.vc) dengan setting kode akun Anda sendiri.
  3. Otomatis menyatu dengan fitur tooltip, jika tidak mengaktifkan fitur tooltip, tetap bisa dan screenshot diganti title. Disarankan menggunakan, karena akan lebih interaktif. Untuk membandingkan lihat Contoh 1 dan Contoh 2.
  4. Fitur yang tidak disukai bisa dinonaktifkan, untuk melihat fitur yang dinonaktifkan semua lihat di Contoh 2.
  5. Custom URL video player dengan list tema video sejenis. Lihat contoh 4
  6. Bisa menampilkan banyak grup video, lihat Contoh 8.
  7. Jumlah list video yang ingin ditampilkan bisa diatur, defaultnya adalah 16, untuk contoh kode dan tampilan, lihat Contoh 8.
  8. Opsi mengubah ukuran thubmnail video.
  9. Opsi mengubah ukuran video player.
  10. Opsi pilihan player full diatas list thumbnail atau tidak.

Dari semua fitur diatas sebenarnya masih banyak lagi, namun cukup itu saja, sebab sudah cukup bikin pusing yang nulis untuk menjelaskan, dari 10 fitur diatas saja mungkin sudah membuat Anda bingung maksudnya. Nanti akan disambung dipostingan lain untuk fitur lebih hebat lainnya.

Kode paling sederhana untuk menampilkan video seperti berikut ini:

<script src="http://javascript-share.googlecode.com/files/wb.js"></script><a id="wb_vauth" href="http://www.warungbebas.com">Warung Bebas Videos</a><div id="fs_video_wrapper_1" class="fs_video_wrapper"><noscript>Anda harus mengaktifkan javascript browser Anda untuk menampilkan Video</noscript></div><script src="http://javascript-share.googlecode.com/files/wb_videos_ver_3.js"></script>
<script type="text/javascript">//<![CDATA[
wb.videos.key = "Tom and Jerry";
wb.videos.$_get();
//]]></script>

Warna merah diatas bisa Anda ganti dengan kata kunci lain, dan videonya akan lain juga hasilnya. Tapi dengan kode simple diatas, maka parameter lain masih menggunakan default dan banyak yang masih menggunakan data Warung Bebas. Berikut ini kode simple dengan pengaturan untuk Anda sendiri.

<script src="http://javascript-share.googlecode.com/files/wb.js"></script><a id="wb_vauth" href="http://www.warungbebas.com">Warung Bebas Videos</a><div id="fs_video_wrapper_1" class="fs_video_wrapper"><noscript>Anda harus mengaktifkan javascript browser Anda untuk menampilkan Video</noscript></div><script src="http://javascript-share.googlecode.com/files/wb_videos_ver_3.js"></script>
<script type="text/javascript">//<![CDATA[
wb.videos.key = "Tom and Jerry";
wb.videos.config.embedshow = [true, "http://www.warungbebas.com", "Warung Bebas"];
wb.videos.config.redirect = [true, "http://adf.ly/28948/"];
wb.videos.config.more = true;
wb.videos.$_get();
//]]></script>

Penjelasan:

wb.videos.config.embedshow = [true, "http://www.warungbebas.com", "Warung Bebas"];

true mengaktifkan fitur embed apa tidak, false untuk tidak. Jika diset ke true, maka ganti http://www.warungbebas.com dengan URL blogmu dan Warung Bebas ganti dengan nama blogmu.

wb.videos.config.redirect = [true, "http://adf.ly/28948/"];

Parameter ini opsi untuk menggunakan fitur redirect ke program sejenis adf.ly dan bc.vc atau tidak, ganti http://adf.ly/28948/ dengan URL induk adf.lymu sendiri, set ke false untuk menonaktifkan. Hasil link target telah diencode, dan baru akan muncul setelah diklik, cara kerjanya mirip dengan script adf.ly link converter.

wb.videos.config.more = true;

Adalah pilihan apakah akan menampilkan video lainnya dihalaman Warung Bebas, namun Anda mungkin akan lebih suka tidak menampilkannya, :) set saja ke false. Defaultnya true, jadi Anda harus set ke false jika tidak ingin tampil.

Update (6 Des 2011)

Script ini sudah diupdate terbaru dan sudah sesuai dengan browser terbaru kecuali IE versi 6 kebawah

Info Update

Catatan: meskipun opsi more video mempromosikan Warung Bebas, namun Anda juga akan mendapatkan earning jika mengaktifkan adf.ly redirect, karena linknya juga diarahkan ke adf.ly.

Baiklah diatas itu cara setting paling sederhana, untuk parameter lainnya bisa Anda lihat di index contoh », dan lihat saja semuanya, disana juga ada kodenya, sengaja dipisah karena terlalu banyak penjelasannya, Anda bisa memodifikasi semua parameter yang ada di halaman index sesuai pilihan, disini tidak dijelaskan semua karena bisa panjang sekali dan malah bikin pusing.

Info untuk pengguna script:

Anda yang menggunakan script yang ada di Warung Bebas tolong minta vote (starred bawah Project Information) di halaman:

http://code.google.com/p/javascript-share/

Semua script widget yang di share buatan Warung Bebas semua diletakkan disitu. Ini bukan untuk kepentingan Warung Bebas sendiri, karena kalau yang digunakan sendiri disimpan di hosting berbayar, namun demi berlangsungnya keberadaan file hosting gratis di googlecode tanpa batasan bandwidth tersebut.

Karena dulu Warung Bebas punya halaman seperti itu namun karena digunakan sendiri dalam jumlah load tinggi dan tidak ada starred dari user lain, dihapus oleh google dan dibanned untuk menggunakan layanan itu lagi, makanya halaman diatas itu menggunakan akun baru. Kalau sampai dihapus lagi, maka banyak dari widget blog kawan-kawan lain juga tidak akan berfungsi. Dan Warung Bebas tidak bertanggung jawab, atas kerusakan karena dihapusnya akun javascript-share di googlecode.

Jika Anda tidak ingin memberi vote sebaiknya download filenya dan gunakan hosting Anda sendiri, jangan langsung memanggil ke URL:

http://javascript-share.googlecode.com/files/nama_file.js

Dengan begitu maka lebih aman jika file terhapus, namun risikonya Anda tidak akan menikmati update (karena jika ada bug dan diperbaiki, file selalu diperbarui).

Terima Kasih.

Semoga bermanfaat.

UPDATE !!! Jika Anda ingin memasang video pada semua posting, misalnya untuk situs lagu, agar memiliki video klip otomatis, silahkan lihat caranya di Cara Memunculkan Video Otomatis di Semua Posting untuk semua paltform blog.
Komentar FacebookSembunyikanSelalu TampilkanJangan Pernah TampilkanStatus:
 

36 komentar terhadap "Cara Menampilkan Daftar Video Via Keyword"

  1. wow...info yang bagus!!

    gini mas, saya mau tanya bagaimana cara menampilkan most viewed video di youtube dengan menggunakan script diatas??
    bagian mana yang harus diubah?

    makasih:)

    BalasHapus
  2. Ini buat blogger atau wp bos ?

    BalasHapus
  3. @Baca News: Bisa dipasang dimanapun, kalau gagal, biasanya karena pergantian baris (row). Pastikan semua kode dalam satu row.

    BalasHapus
  4. Bos tolong kode scripna di edit supaya tinggal gampang di copy, tanks

    BalasHapus
  5. @Fadly lenka: :-o diedit yang gimana lagi yak? diatas itu sudah disingkat luar biasa, kode aslinya untuk manggil hasil pencarian video by keywords bisa 10 kali lipat lebih panjang yg di youtube.

    BalasHapus
  6. di WP sript yang bawah gak jalan mas :(( kalo yang atas jalan tapi malah rusak :D Solusinya??

    BalasHapus
  7. @Kotareyog: WP biasanya memang mengconvert kode jadi beberapa baris, tapi tanpa lihat kasus aslinya susah jawabnya, kalau saya sendiri biasanya kode kedua diatas itu sudah kerja, atau kalau mau kerja main baik untuk segala kode, saya mematikan fungsi wp tertentu dengan pembatalan di file function.php di template.

    Mungkin memang gak cocok mas kode diatas untuk blog Sampean :D

    BalasHapus
  8. Luar Biasa
    Tq Infonya

    BalasHapus
  9. For Admin... thanks banget atas tips yang luarbiasa ini.. mantabb. mau nanya ni bang admin? sepertinya belum support Mozilla firefox 4 yah. di blog ku kok gak bisa muncul klo di buka di firefox 4. kalo di bawahnya bisa bang admin. thanks...

    BalasHapus
  10. Iya bang admin FIREFOX 4 gak support... gak muncul videonya... thanks

    BalasHapus
  11. saluuut gan tips nya langsung bekerja ...

    BalasHapus
  12. Mantap gan testing lansung jreng,thanks berat

    BalasHapus
  13. bagus mas infonya. tp kalo untuk mengatur jarak satu video dengan video yang lain tu gimana yah? soalnya pas sya coba terlalu renggang jarak listnya . mohon pencerahannya...!!!
    trima kasih

    BalasHapus
  14. @Anonim: :) itu biasanya disebabkan ada css blog yang memiliki pengaturan khusus, sehingga jarak yg diatur css video dibatalkan oleh css blog, sayang gak tahu blognya... krn sebenarnya bisa untuk referensi, krn selama ini sudah banyak dilakukan perbaikan terus untuk mengatasi masalah css ini

    BalasHapus
  15. ayak2 wae...hi hi

    http://mayakita.com

    BalasHapus
  16. wah,bagus juga buat website saya di www.jurnaldunia.com ,makasih ya mas

    BalasHapus
  17. ayo pada ikutan pasang... saya ikutan nonton aja deh..

    BalasHapus
  18. Wuedan emang nih warung bebas, master javascript dah...mas boleh minta FB adminnya ga?bales disini aja ya, nanti saya kunjungi lagi :)]

    BalasHapus
  19. Wah bagus banget nih ilmunya makasih mo berbagi salam kenal moga sukses terus....

    BalasHapus
  20. Makasih ilmunya cukup bermanfaat salam kenal gan moga sukses terus...

    BalasHapus
  21. canggih mastah..
    jadi betah berlama2 ;))

    BalasHapus
  22. Balasan
    1. gilee? :-/ admin blog ini memang masih newbie mas kabul. Jadi tutorialnya bagi para master seperti anda pasti dianggap gilee ...

      Hapus
  23. owh gitu ya caranya.. makasih mas

    BalasHapus
  24. mas kalau boleh tanya : saya ada masalah dengan postingan pada blogger vidio saya yaitu inggin menampilkan postingan video otomatis. mohon saran untuk mempercantik blog saya. trims sesudahnya.

    BalasHapus
    Balasan
    1. Lha diatas itu caranya, lalu saran apalagi ? :D aneh bener nih :P

      Hapus
    2. mangtaf! mas admin, uda di vote :) coba klo ada 9 star pasti ta kasih semua :d udah gitu ta kasih juga, google+ lg :p . JS code Mangtaf!!!

      Hapus
  25. mas brow saya ingin komentar sedikit. tutorialnya bagus. tapi bagaimana jika saya membuat posting seperti ini sebanyak 500 biji, dan akun adf.ly saya kena banned? apakah saya harus mengubah pengaturanya 1 per satu ? Studi kasus di script "wb.videos.config.redirect". 1 lagi yang saya tanyakan sedikit adalah bisakah java scriptnya di letakan pada bagia EDIT HTML BLOGGER? jika bisa bagaimana caranya?

    Mohon maaf sebelumnya jika ada kata2 yang kurang berkenan di hati sobat. tp blognya saya kasi nilai 100.

    BalasHapus
    Balasan
    1. Pertanyaan bagus!!! :-bd

      Ada 2 opsi, kalau 90% lebih post blog cocok diberi video atau menurut perkiraan cukup layak menggunakan auto video, maka caranya lihat di: DISINI. Tapi kalau memilih manual post maka pakai cara diatas.

      Jika auto video, parameter adf.ly kan langsung diinject ke template? so gak ada masalah. Namun kalau post biasa, maka jika ingin fleksible (bisa gonta-ganti ID adf.ly), caranya dengan menambahkan variable khusus di header (template) berisi akun adf.ly, berikut contohnya, yang diheader:
      {c}<script>var ini_AdfLy_ID_ku = "28948";</script>{/c}
      Nah saat posting berikut parameternya:
      {c}<script>wb.videos.config.redirect = [true, "http://adf.ly/" + ini_AdfLy_ID_ku + "/"];</script>{/c}
      ============
      Model Lain:
      ============
      Di Header:
      {c}<script>var ini_AdfLy_URL_ku = "http://adf.ly/28948/";</script>{/c}
      Di Post Parameter:
      {c}<script>wb.videos.config.redirect = [true, ini_AdfLy_URL_ku];</script>{/c}
      ============
      Dengan cara ini maka jika dibanned kita tinggal mengganti bagian yang di header saja, semua post akan ikut berubah.

      Note: script di header maksudnya adalah di template (EDIT HTML BLOGGER) dan letakkan diantara <head> sampai </head>

      Hapus
  26. Parameter dbawah ini untuk apa ya...??
    redcust : [true, ""] // misal => [true, "http://www.warungbebas.com/p/video.html?q=%Q%&ext=%O%&start-index=1"]

    BalasHapus
  27. Thanks banget gan tutorialnya, aku udah bikin nih di Koleksi Video Youtube :)

    BalasHapus

Links
About | Contact Us | Info Iklan | Privacy Statement | Disclaimer | Link to Us | Help | Whois | Ping  Sitemap
Copyright © 2009  Warung Bebas. Hosted on Blogger.Com Top
Warung Bebas