Tutorial Menambah Galeri Video di CMS Balitbang dengan Bantuan Youtube

Salam Hangat Selalu

Apakabar teman-teman sekalian? Saya harap dalam keadaan sehat selalu.Amin.

Mudah-mudah sharing kali ini bisa bermanfat dan bisa dipahami,kalo ada yang kurang jelas bisa tanya via YM saya (arisddg31@yahoo.co.id).

Baiklah kita mulai aja yach. He he he.

Dalam tuturial kali ini dibagi menjadi 3 bagian:

  1. Menambahkan file-file functions sampai menambahkan databasenya kedalam website cms balitbang dan jangan kuatir untuk file-filenya serta databasenya sudah saya siapakan tinggal didownload aja.
  2. Menambah Menu & Profil dan Mengatur hak akses admin.
  3. Cara menambah/menginput video baru dan menambah modul video untuk dipasang di halaman depan.

TAHAP PERTAMA

Menambahkan file-file dan database pendukung

Langkah-langkahnya sebagai berikut:

Menambahkan database dbvideo.sql ke database cms352

Import database dbvideo.sql yang sudah saya sertakan di folder galeri video versi 352 ke database cmsbalitbang352 yaitu database cms yang akan ditambahkan galeri video.Di dalam database tersebut ada 2 tabel yaitu t_video dan t_videokategori

Bagi yang belum tahu cara importnya bisa ikuti langkah2 berikut ini;

  • Untuk yang dilocalhost buka di  localhost/phpmyadmin, sedangkan untuk yang di hosting melalui Cpanel (http://www.namasekolah.sch.id/cpanel).
  • Cari databasenya  -> klik import  -> cari database dbvideo.sql yang telah anda download sebelumnya  -> klik tombol Go.

Upload/Copy Folder beserta file didalamnya ke folder cms352(untuk yang di localhost)  dan public_html (untuk yang di hosting). Untuk Filenya sudah saya siapkan tinggal didownload aja(he he he), sedangkan filenya terdiri dari:

1) Folder admin

admin.php

2) Folder html

index.php

3) Folder functions

functions_info.php

fungsi_video.php

functions.php

4) Folder images

video

Oh ya, untuk upload ke hosting bisa melalui cpanel atau lebih mudah menggunakan FileZilla, jika ada file yang sama tinggal ditimpa/replace kan aja. Warning!!! Bagi yang folder adminnya sudah diganti, sebelum mengupload untuk merename folder admin yang akan diupload dengan nama yang sama dengan folder admin website anda.

Catatan: untuk menghindari hal yang tidak diinginkan silahkan rename file-file dibawah ini

  • admin.php menjadi admin2.php
  • functions_info.php menjadi functions_info2.php
  • functions.php menjadi functions2.php

Maaf ya kalo penjelasannya kurang memuaskan he he he.

Ini akhir dari tahap pertama

 

Gambar Tampilan Awal Galeri Video

gb1

Tampilan Awal Galeri Video terdapat Video Terbaru yang secara default saya atur 9 Video terbaru dan rekan-rekan bisa mengatur berapa banyak video terbaru yang akan ditampilan di fungsi_video.php dibagian function video() yaitu: dibagian yang dilingkari dan tercetak tebal 0,9 tinggal diganti dengan angka yang diinginkan misalnya 3, 6, 9, 12 dst.


if ($kode==''){

$col = 3;

$g = mysql_query("SELECT * FROM t_video ORDER BY id DESC LIMIT <b>0,9</b>");

$video .="<table width='100%' cellspacing='0' cellpadding='0' border='0' ><tr bgcolor='#420C4F'><td><h3>&nbsp;Video Terbaru</h3></td></tr></table>";

$video .="<center>";

$video .="<table bgcolor='#0D030F'><tr>";

Menu Pilih Kategori digunakan untuk mengelompokan video berdasarkan kategori tertentu.

Gambar Tampilan Putar Video

 tampilan video galeri

Dibagian Putar Video Terdapat Video yang akan diputar, Video terkait berdasarkan kategori dan komentar dengan bantuan FB comment, serta share via fb, tweet, google.

TAHAP KEDUA

Menambah Menu & Profil

Agar menu galeri video tampil di bagian sub menu Fitur, kita harus menambahkan menu baru.

Langkah-langkahnya sebagai berikut:

1) Login Admin anda melalui http://www.namasekolah.sch.id/admin

2) Setting Admin -> Menu & Profil -> Tambah Profil kemudian akan muncul form tambah profil seperti gambar dibawah ini

gb1

3) Isikan ke dalam form tambah profil seperti contoh dibawah ini

Judul : Galeri Video

Menu Utama : Fitur

Tampilkan : Tampilkan

Link : index.php?id=video

Target: Self

Urut : 9

untuk data diatas hanya contoh bisa dirubah sesuai dengan keinginan, yang tidak boleh dirubah bagian link harus seperti itu, sedangkan bagian konten/isi biarkan kosong

Mengatur Hak Akses Admin

Agar program berjalan dengan benar harus ada pengaturan di bagian hak akses admin untuk mengatur siapa saja yang mempunyai hak akses untuk penambahan Galeri Video tersebut. Karena keterbatasan pengetahuan saya he he he maklum newbi dan biar lebih aman tapi agak sedikit ribet menjelaskannya tapi saya coba untuk menjelaskannya mudah-mudahan dapat dipahami.

Langkah-langkahnya sebagai berikut:

1)             Login Admin anda melalui http://www.namasekolah.sch.id/admin

2)             Klik Setting Admin -> Tambah Admin , akan muncul form tambah admin seperti gambar dibawah ini

gb2

3)             Dalam Form diatas tidak semua hak akses ditampilkan,sedangkan yang akan kita tambahkan merupakan top admin yang mempunyai hak akses penuh.Oleh karena itu ikuti langkah demi langkahkanya dengan berurutan jangan sampai ada yang terlewat. Isi semua prosedurnya dan jangan lupa untuk checklist di bagian checklist semua dan Simpan.

4)             Klik Setting Admin ->Lihat Admin

5)             Pilih user Admin yang akan diEdit hak aksesnya -> klik Edit. akan muncul gambar seperti dibawah ini

gb3

6)             Checklist di bagian Checklist semua agar mempunyai hak akses penuh kemudian klikm simpan.

9)             Logout dan Login lagi dengan user admin yang telah diedit.

10)        Sekarang secara otomatis kalo klik menu Fitur akan ada satu sub menu baru yaitu Galeri Video.

Wah ribetkan???!!! Mudah2an dapat dimengerti he he he. Sebetulnya ada cara yang lebih praktis yaitu dari databasenya,Cuma takut ada kesalahan makanya saya bikin yang manual aja. Mungkin ada yang mau menambahkan ditunggu sharingnya.

 ======= Ini akhir dari tahap kedua ==========

Kalo sudah berhasil ayo kita lanjut ke bagian berikutnya, let’s go guys!!!

TAHAP KE TIGA

Menambah/menginput video baru dan menambah modul video untuk dipasang di halaman depan    

Secara garis besarnya untuk menambah video baru hampir sama kayak menambah galeri foto, karena memang sourcenya saya copykan dari galeri foto.Bedanya Cuma saya edit sana sini biar sesuai dengan yang saya inginkan (he he he) mungkin rekan-rekan semua juga bisa meniru gaya saya he he he.Maap untuk para pengembang kalo saya lancang mengotak-atik cmsnya dan belum ijin,tapi tenang saya tidak akan menghilangkan copyrightnya, disamping itu tujuannya jelas bukan untuk pribadi tapi untuk semua pengguna cms dan demi kemajuan bersama.

Biar tidak bertele-tele diberikut ini akan saya jelaskan secara rinci untuk langkah-langkahnya:

A.   Menambah/menginput video baru

1) Login Admin anda melalui http://www.namasekolah.sch.id/admin

2) Klik menu Fitur, lalu pilih Galeri Video.

gb4

Gambar Daftar Kategori Video

3) Untuk menambah kelompok katagori video, klik Tambah Kategori, lalu isi Kategori dan Tanggal lalu Simpan.

4) Dan untuk menambah Video pada Kategori tertentu klik pada kolom Tambah Video. Akan muncul form isian seperti di bawah, isi data dengan lengkap.

gb5

Gambar Tampilan Pengisian Galeri Video

Untuk bagian Kode isikan kode video dari Youtube yang ada di share -> embed dan edit kode tersebut, hapus semua tanda kutip dua (“). Untuk menghilangkan tanda kutip dua (“) bisa di edit di notepad , tekan Ctrl+H untuk mereplace tanda tersebut. Seperti contoh dibawah ini:

Kode Asli dari Youtube sebelum diedit.

gb4 

Setelah dihilangkan tanda kutip dua (") menjadi
gb5

Oh ya harus diketahui karena video ini masih menggunakan bantuan mbah Youtube (he he he) maka sebelum menambahkan video baru, video yang akan di tambahkan diupload dulu ke Youtube. Untuk proses uploadnya rekan-rekan harus mendaftar dulu di Youtube kemudian Login baru bisa mengupload videonya.Setelah selesai upload pilih Share/Bagikan dan pilih embeb untuk mencopy Kodenya yang digunakan untuk pengisian Kode yang telah dijelaskan diatas. CATATAN! Untuk ukuran videonya bisa diatur melalui widht dan heightnya. untuk kuran yang disarankan adalah widht=450 height=367.

  • Untuk File gambar sediakan gambar yang sesuai dengan video yang akan ditambahkan.Pilih file dengan klik tombol Browse/telesuri, format file jpg.Ukuran file tidak lebih dari 200 kbyte. Kemudian klik tombol Simpan.
  1. Untuk menghapus data, berilah tanda check (R) pada data yang akan dihapus (bisa lebih dari satu), kemudian klik tombol hapus.

B.   Menambah modul video dihalaman depan

Karena Galeri video masih tersembunyi di bagian menu Fitur -> Galeri Video, maka sebaiknya kita buat satu buah modul untuk menampilkan Galeri Video terbaru di depan halaman website.Sedangkan untuk modulnya juga sudah saya persiapkan tinggal didownload aja(he he he), rekan-rekan cukup menambahkan modul tersebut di halaman depan website pada posisi tengah.

Untuk langkah-langkahnya sebagai berikut.

1) Login Admin anda melalui http://www.namasekolah.sch.id/admin

2) Klik Setting Admin -> Posisi Menu Modulgb6

Gambar Tampilan Tambah Posisi Modul

3) Tambah Posisi Menu, akan muncul form isian seperti di bawah, isi data dengan lengkap.

gb7

Gambar Tampilan Form Isian Tambah Posisi Modul

  • Untuk Judul Menu, Posisi Menu, Kategori dan  Urut isi sesuai dengan kebutuhan, Untuk file Script Fungsi klik Telusuri  cari file modul (videodepan.php) di folder galeri video versi 352.

4) Kemudian klik Simpan

download full script video galeri di bawah ini

download_button

Tutorial ini digunakan untuk tujuan pendidikan,bila ada penulisan script dan tutorial yang salah mohon kritik dan saran yang membangun, maklum masih newbi dibidang Web.

About arisddg31

Saya seorang guru TIK di SMA Negeri 3 Kota Sukabumi asal dari Kota Wates Jogjakarta

Posted on Maret 26, 2013, in CMS Balitbang, Tutorial. Bookmark the permalink. 36 Komentar.

  1. kalau ikut tutorialnya, di menu adminnya ada yang hilang yaitu member komunitas, bagimana solusinya ?

    • itu karena hak akses untuk admin tersebut tidak terceklist semua, solusinya silahkan login sebagai top admin yang mempunyai hak akses penuh, kemudian edit hak akses admin yang tidak muncul member komunitasnya, yaitu melalui Setting Admin -> Lihat Admin -> cari admin yang akan diedit -> klik tombol edit -> cecklist semua hak aksesnya -> klik tombol save

  2. pada bagian Fitur, sub menu Gallery Videonya tidak mau munculya padahal sudah di ceklis Gallery Videonya.

    • coba mas ikuti lagi langkah2 hak aksesnya takut ada yang kelewat, setelah membuat admin baru, terus edit admin tersebut, lalu logout, setelah itu login dengan admin yang baru tadi,sedangkan diadmin yang lama pasti tidak akan muncul

      • sudah sy lakukan, malah sy coba buat admin baru tapi blom berhasil juga….

      • kalo yang dimaksud sub menu yang ada di front page, itu coba lihat tahap 2 dari tutorial menambah menu dan profil, itu memang sengaja tidak saya buatkan di databasenya langsung, jadi harus ditambahkan melalui menu dan profil di bagian admin

      • bukan yg di front page. tapi yang di backend admin. disub menu fitur > video gallery msh tdk muncul. harusnya kan sdh muncul di admin baru. pdahal sudah di ceklist semua..

      • pastikan semua file2 terutama file admin.php yang ada di folder admin sudah dicopykan, terus pastikan database dbvideo.sql sudah diimport ke database, dan silahkan ulangi lagi langkah mengatur hak akses,
        1) buat admin baru -> kemudian edit admin baru tersebut dengan hak akses penuh dengan menceklist semua hak akses dan pastikan di hak akses tersebut sudah muncul hak akses gallery video.
        2) setelah membuat admin baru tidak otomatis galleri video tersebut muncul, kalo ingin muncul logout dulu setelah itu login lagi denan admin yang baru

  3. Pak saya mau tanya galeri video yang dari bapak kan ada komentar fbnya. Nah yang jadi pertanyaan saya mau menganti itu dengan faebook punya sekolah atau dihilangkan sama sekali. Bisakah?? Kalau bisa bagaimana caranya??

    • Silahkan buka file fungsi_video.php yang ada di folder functions lihat baris ke 38 – 40 seperti di bawah ini

      $video .="<HR><H3>KOMENTAR</H3></HR>";
      		  $video .="<div id='fb-root'></div><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'></script><fb:comments href='http://sman3kotasukabumi.sch.id/html/index.php?id=tampil&kode=$row[idkategori]&kd=$row[id]' num_posts='2' width='500' colorscheme='dark'></fb:comments>";
      		  $video .="</td>";
      

      bagian jadi sintaknya seperti ini

      $video .="<HR><H3>KOMENTAR</H3></HR>";
      		  $video .="<div id='fb-root'></div><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'></script><fb:comments href='http://namasekolah.sch.id/html/index.php?id=tampil&kode=$row[idkategori]&kd=$row[id]' num_posts='2' width='500' colorscheme='dark'></fb:comments>";
      		  $video .="</td>";
      

      kalo tidak ingin ada komentar fb tinggal dihapus script tersebut atau cukup dikasih tanda keterangan biar nanti bisa digunakan kembali

  4. gak bisa di play videonga kenapa ya.. seperti ini http://smpnmunjul.net78.net

  5. admin.php malah tidak bisa di akses…blank semua.
    apa ini khusus template SMA y pak?

  6. mo.kasih mang cek tutorialnyo gek aku cubo dulu…salam dulur dari palembang

  7. pak, bagai mana cara agar komentar fb yang sudah ada waktu upload video tidak muncul lagi,,,

  8. Upload Video muncul pesan
    403 Forbidden

    Access to this resource on the server is denied!
    Powered By LiteSpeed Web Server
    LiteSpeed Technologies is not responsible for administration and contents of this web site!

  9. Pak saya mau tanya .. saya sudah mengikuti cara di atas dari tahap pertama sampai akhir tetapi ada kendala di bagian fitur nya malah tidak keluar di bagian Fitur > Galeri Videonya tidak ada. kira2 ada yang kurang apa ya? terima kasih

  10. Terimakasih pak atas bantuannya…

  11. videodepan.php nya tidak ada pa

  12. Kalau Permasalahan kayak Gini
    ” Table ‘stikeskj_portalkjp.t_videokategori’ doesn’t exist”
    Kesalahan Di mana Gan, Mohon Bantuannya…

  13. Hak akses admin kok member komunitasnya hilang padahal dulu waktu awal2 buat galeri muncul.. mohon solusinya padahal dh membuat hak akses terceklist smuanya…

    • untuk pengembangan cms balitbang versi 3.5.2 ke atas saya lihat memang masih ada beberapa yang belum fix salah satunya untuk hak akses admin, karena saya bukan salah satu pengembang saya belum bisa kasih solusi, coba colek pak Dody salah satu pengembangnya atau pak ansari shaleh

  14. link downloadnya ngk bisa di download pak

  15. Assalamu’alaikum wr.wb.
    Salam kenal pak, saya seorang guru dari SMAN 4 Pekanbaru, sama2 K2 sperti bapak yang lagi nunggu2 SK. saya sekarang ini lagi coba kembangkan Website sekolah saya http://www.sman4pku.sch.id , pengennya juga ada fitur galeri videonya, setelah saya baca – baca tutorial dari bapak, kayaknya sip banget, tapi pas saya coba download, link downloadnya mati pak,, mohon bantuan Bapak, terima kasih sebelumnya

  16. Tidak bisa di download pak

  17. link download mati pak , mohon dibenarkan.trimakasih

  18. pak cara edit member guru agar username tidak sama semua itu bagai mana? terimaksih

  19. cara unruk mengedit username untuk member guru bagai mana pak, sebelumnya saya sudah mencoba tetapi tetep belum bisa juga

  20. SDN Gandaria Selatan 01

    Permisi pak jika ingin tampilan video ya di front page menjadi sperti slide header gemana ya pak ?

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s

%d blogger menyukai ini: