Author: admin

Semua orang sudah tau tentang SoundCloud, dari orang awam yang menyebut situs musik online, para maniak Android akan menyebut alat pemutar musik.Tapi menurut Wikipedia SoundCloud adalah sebuah platform distribusi suara secara online yang memungkinkan kolaborasi, promosi, dan distribusi dari rekaman suara.

Pada kesempatan ini Admin akan memberikan contoh embed audio SoundCloud dengan mudah. Jika kamu lagi cari-cari tutorial memasang audio dari SoundCloud di website, silahkan ikuti langkah-langkah berikut. Untuk meng-Embed audio dari SoundCloud ada dua cara yang dapat kamu gunakan, yaitu:

1. Menggunakan HTML5 <iframe> seperti yang digunakan oleh situs SondCloud.
2. Costum audio player dengan elemen <audio> dan atau JavaScript.

Cara pertama cocok digunakan buat kamu yang suka dengan cara instan. Tapi jangan salah, walaupun hanya menggunakan elemen <iframe> tapi kita dapat mengontrol audio tersebut menggunakan JavaScript.

DEMO

Kode SoundCloud di atas memiliki parameter sebagai berikut:

Kamu juga bisa menggunakan elemen <audio> jika itu yang kamu inginkan. Maka akan menjadi seperti dibawah ini.

DEMO

Jika kamu mulai bosan dengan tampilan default dari elemen <audio> tenang saja, mungkin artikel yang satu ini bermanfaat “Beberapa JavaScript library untuk memutar Video atau Audio di website”.

Berikut ini Admin akan memberikan contoh embed audio SoundCloud menggunakan JavaScript library. Cara ini tentu agak rumit, tapi setidaknya ini akan lebih baik untuk orang-orang anti mainstream. Ada dua tahap yang harus dikerjakan. Pertama kita buat elemen pemutar audio. Selanjutnya mengontrol element pemutar audio tersebut dengan JavaScript library. Bingung? dibawah ini contohnya.

Mungkin link berikut ini dapat membantumu untuk membuat pemutar audio sesuai selera MediaElement.js. Selamat mencoba… Semoga berhasil.

Cara embed video YouTube responsive, lebih efisien dan tidak berat. Ketika Anda meng-embed setiap video YouTube pada website menggunakan IFRAME standar, Anda mungkin akan terkejut jika mengetahui berapa banyak berat beban website Anda akan bertambah pada halaman yang ada videonya tersebut. Halaman website setidaknya harus men-download sekitar 0,5 MB (552 KB) resource tambahan (CSS, Javascript dan gambar) untuk rendering pemutar video (video player) buatan YouTube dan file tersebut akan di download meskipun para pengunjung tidak memutar video YouTube tersebut, duh mubazir banget kan..

Video yang di embed membuat halaman website menjadi berat dan browser pengunjung juga akan perlu untuk membuat beberapa permintaan (request) HTTP untuk merender video player YouTube. Ini tentu akan meningkatkan waktu loading keseluruhan halaman web Anda sehingga mempengaruhi skor kecepatan halaman (misalnya jika di cek dengan Google Speed Insight atau Pingdom). Kelehaman lain jika kita embed dengan cara standar adalah video tersebut tidak akan responsive, jadi jika dibuka pada layar yang lebih kecil kemungkinan video tersebut akan merusak tampilan website Anda, karena video tidak otomatis mengikuti lebar layar.

Load video player Youtube ketika dibutuhkan saja

Google Plus menggunakan solusi yang cukup cerdas untuk mengurangi waktu yang dibutuhkan muatan awal video player YouTube dan kita dapat menggabungkan pendekatan yang sama pada website kita.

Daripada mengembed video player YouTube secara keseluruhan, Google+ menampilkan hanya gambar thumbnail dari video YouTube dan menempatkan ikon “Play” diatas gambar video tersebut sehingga tampak seperti sebuah pemutar video.

Ketika pengunjung menekan tombol “Play”, thumbnail video diganti dengan pemutar video YouTube standar dengan autoplay di set menjadi 1, sehingga video langsung dimainkan. Dengan cara ini maka sumber daya tambahan yang dibutuhkan oleh video player YouTube tersebut hanya akan diambil ketika user memang ingin menonton video, jika tidak maka resource tidak akan dimuat.

Biasanya kode embed untuk sebuah video YouTube adalah seperti berikut ini, Anda bisa menentukan tinggi dan lebar dalam pixel, serta terdapat juga ID unik dari video YouTube tersebut.

<iframe width="320" height="180" 
     src="http://www.youtube.com/embed/iWZM7dNTokY">
</iframe>

Cara embed video YouTube secara responsive tanpa menambah waktu loading

Kita akan sedikit membuat perubahan pada load video YouTube secara on-demand ini karena kita ingin membuatnya lebih responsive (menyesuaikan ukuran layar, selain itu kode embed IFRAME nya hanya akan ditambahkan ketika pengujung melakukan klik pada tombol “Play” yang ada diatas gambar thumbnail.

Anda bisa copy-paste potongan script berikut ini dimana saja Anda ingin memunculkan video YouTube di halaman website Anda. Jangan lupa untuk mengganti VideoID dengan ID video YouTube yang Anda inginkan. Kode CSS dan Javascript ditambahkan ke template secara terpisah. Selain itu Anda juga tidak perlu untuk mengatur tinggi dan lebar video karena dengan ini maka secara otomatis lebarnya akan mengikuti layar dan tingginya akan menyesuaikan secara proporsional.

<div class="youtube-container">
	<div class="youtube-player" data-id="iWZM7dNTokY"></div>
</div>

Anda dapat copy-paste beberapa blok video dengan ID video YouTube berbeda-beda maupun sama dalam satu halaman. Kodenya akan tetap sama namun hanya berbeda pada bagian VideoID saja.

Javascript

Fungsi Javascript ini akan melakukan scanning halaman website untuk mengembed video YouTube. Apabila ditemukan, maka akan menambahkan gambar thumbnail yang sesuai dan juga menambahkan event onclick yang akan menyulap video thumbnail menjadi video YouTube yang autoplay.

<script>
(function() {
    var v = document.getElementsByClassName("youtube-player");
    for (var n = 0; n < v.length; n++) {
        var p = document.createElement("div");
        p.innerHTML = JWTubeThumb(v[n].dataset.id);
        p.onclick = JWTubeIframe;
        v[n].appendChild(p);
    }
})();
 
function JWTubeThumb(id) {
    return '<img class="youtube-thumb" src="http://i.ytimg.com/vi/' + id + '/hqdefault.jpg"><div class="play-button"></div>';
}
 
function JWTubeIframe() {
    var iframe = document.createElement("iframe");
    iframe.setAttribute("src", "http://www.youtube.com/embed/" + this.parentNode.dataset.id + "?autoplay=1&autohide=2&border=0&wmode=opaque&enablejsapi=1&controls=0&showinfo=0");
    iframe.setAttribute("frameborder", "0");
    iframe.setAttribute("id", "youtube-iframe");
    this.parentNode.replaceChild(iframe, this);
}
</script>

CSS

Buka file CSS dari website Anda dan tambahkan potongan script CSS berikut ini. Jika Anda tidak memiliki file CSS terpisah, maka Anda juga dapat menambahkan kode ini di tag HTML tepatnya sebelum tag </head> pada template Anda.

.youtube-container { display: block; margin: 20px auto; width: 100%; max-width: 600px; border:1px solid #000; }
.youtube-player { display: block; width: 100%; /* assuming that the video has a 16:9 ratio */ padding-bottom: 56.25%; overflow: hidden; position: relative; width: 100%; height: 100%; cursor: hand; cursor: pointer; display: block; }
img.youtube-thumb { bottom: 0; display: block; left: 0; margin: auto; max-width: 100%; width: 100%; position: absolute; right: 0; top: 0; height: auto }
div.play-button { height: 72px; width: 72px; left: 50%; top: 50%; margin-left: -36px; margin-top: -36px; position: absolute; background: url("http://i.imgur.com/TxzC70f.png") no-repeat; }
#youtube-iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }

Motode ini akan mengurangi ukuran halaman web Anda sekitar 300-500 KB dan membuat website Anda lebih mobile-friendly karena .

Hasil dan Demo

Dengan cara tersebut beban awal yang di load website akan lebih ringan karena hanya akan melakukan request awal ke server sebanyak 3 kali untuk mengambil gambar dan file HTML. Coba bandingkan Gambar 2 dengan Gambar 1, terlihat dengan cara ini resource yang di load hanya 39,3 KB, sedangkan sebelumnya 552 KB. Sangat menghemat resource dan membuat waktu load website jadi lebih cepat tentunya

DOWNLOAD SCRIPT

Sumber: www.jurnalweb.com

ID di isi dgn:
id=topsongs (Top Songs)
id=topalbums (Top Albums)
id=topmusicvideos (Top Music Videos)
id=newreleases (New Releases)
id=justadded (Just Added)
id=Featured Albums (Featured Albums)

<?php
$itunes = json_decode(file_get_contents('http://170.130.18.37/itunes?id='.$_REQUEST['id']), true);
       if ( $itunes != null ) {          
       foreach ($itunes as $i) {
echo '<img src="'.$i['image'].'" width="40" height="40" alt="'.$i['name'].'"/> <a title="'.$i['name'].'" href="search?q='.urlencode($i['artist']).'+'.urlencode($i['name']).'">'.$i['artist'].' - '.$i['name'].'</a><br/>
By: <a title="'.$i['title'].'" href="search?q='.urlencode($i['artist']).'">'.$i['artist'].'</a><br/>';
   }
}
?>

Ni yang lagi cari ssl , saya ada referensi situsnya. Berikut adalah situs yang menyediakan ssl gratis :

1. Clouflare
2. StartSSL
3. Nanti menyusul kalo nemu yang lain hehe

Sekian bos.

Semoga bermanfaat

Oke langsung saja.

1. Terlebih dahulu sebuah buatlah folder backup pada user yg bersangkutan
2. Kemudian buatlah script untuk backup database MySQL. Disini saya tuliskan script lengkap yang telah saya buat dan nanti akan saya jelaskan satu persatu.

1. Simpan script tersebut dan berilah nama backup.sh
2. Upload dan letakkan file tersebut pada direktori /bin pada cPanel.
3. Ubah permission nya menjadi 755.
4. Masuk ke Cron Jobs, pada menu Add New Cron Job, kemudian setting waktu yang diinginkan untuk melakukan backup.
5. Pada form Command, masukkan perintah

sh /home/user/bin/backup.sh

1. Klik tombol “Add New Cron Job”.
2. Untuk mencoba apakah script yang kita buat berjalan atau tidak, sebaiknya setting waktu waktu eksekusi di Cron Jobs tadi menjadi “Every Minute”, nanti jika script nya sudah berjalan dengan lancar baru ubah lagi sesuai dengan yang diinginkan.

Penjelasan Script

tanggal=`date '+%Y%m%d_%H%M%S'`;

Adalah variabel yang mengambil tanggal pada waktu script di eksekusi, sehingga nama database akan selalu berbeda, sesuai dengan tanggal dan jam backup.

path="/home/user/backup";

Folder dimana database hasil backup akan di simpan.

find $path/ -mtime +2 -type f -exec rm -rf {} \;

Script diatas berfungsi untuk mencari file di dalam folder $path (/home/user/backup) yang mempunyai umur lebih dari 2 hari dari sekarang. Jika file yang dimaksud ditemukan, kemudian file tersebut di delete. Silahkan ubah +2 sesuai dengan kebutuhan anda.

sleep 30;

Digunakan untuk menunggu waktu delete dan waktu backup, supaya tidak berbarengan. 30 adalah dalam detik. Mungkin script ini tidak diperlukan jika database yang didelete kecil atau sedikit. Tapi jika database yang akan didelete besar dan banyak, sebaiknya script ini ditambahkan supaya tidak terlalu memberatkan server.

mysqldump -u userdb -ppassdb namadb | gzip > $path/namadb_$tanggal.gz

mysqldump adalah perintah untuk melakukan backup pada database MySQL. Gantilah userdb, passdb dan namadb sesuai dengan user, password dan database anda. gzip digunakan untuk melakukan kompresi database. Anda juga diperbolehkan untu menggunakan jenis kompresi lain seperti zip, rar dll.