Download video YouTube

YouTube merupakan situs yang berisi kumpulan video dari member yang menguploadnya ke situs tersebut, tetapi ada satu kekurangan dari YouTube ini yaitu kita tidak bisa mendownload videonya. Bagi sobat blogger yang suka dengan video YouTube tapi tidak bisa mendownloadnya langsung dari situsnya kali ini saya akan memberitahukan bagaimana cara mendownload video dari YouTube, sangat simple dan tidak perlu utak-atik template :p . Mau tahu caranya?

1. Masuk ke situs YouTube ( bukan blogspot lho :p )

Screen Shoot You Tube
2. Setelah masuk pilih video yang di suka sobat blogger.
3. Kemudian copy URl videonya (ambil dari adress barnya)

Screen Shoot
4. Sekarang masuk ke KeepVid dan masukkan URL yang telah di copy tadi ke dalam box download.

Screen Shoot
5. Langkah terakhir adalah pilih jenis kualitas hasil downloadan yang di inginkan sobat blogger.

Screen Shoot
Dan tunggu sampai selesai mendownloadnya, and then silahkan menikmati hasil downloadan video dari YouTube :p . Semoga postingan ini bermanfaat.

Mempercantik area numbering comments

Postingan ini di buat atas permintaan sobat blog saya yaitu kang Riasmaja yang bunyi seperti ini,

Mmmm... kang... tuh tempelen nomer urut komentator diposting juga dunk caranya... pengennn... bagus banget soalnya...

Nah kali ini postingannnya bagaimana kita mempercantik bagian area "numbering comments" yang tentunya juga sudah tidak asing bagi sobat blogger tentang hack numbering comments, kalau mau lihat screnshootnya di bawah ini :

Mau tahu caranya?

Blogger hack ini saya integrasikan dengan blogger hacknya kang Jaloee yaitu "Menambah Numbering-Comments dan Photo-Author pada layout komentar 2 kolom" kalau belum baca silahkan meluncur ke TKP. Kalau sudah baca silahkan aplikasikan ke blog sobat, nah baru kita mulai hack area "numbering comments" nya.
Langkah-langkahnya mempercantik area numbering comments :

1. Seperti biasa login terlebih dahulu ke blogspot, kemudian masuk ke Tata Letak > edit HTML ( saya asumsikan sobat sudah aplikasikan hack dari kang Jaloee-red)

Jangan lupa simpan template lengkapnya, klik Download Template Lengkap!!

2. Centang tanda Expand widget, setelah itu cari kode ini ]]></b:skin> dan masukkan kode di bawah ini di atas kode tersebut :

.bubble1{
background:url(http://subagya.googlepages.com/comment-sobat.png) left top no-repeat;
 width:70px;
 height:45px;
 text-align:center;
 padding-top:40px;
padding-right:value;
 font-size:9px;
 font-family:Verdana, Arial, Helvetica, sans-serif;
 color:#575553;
 float:right;
 margin-right:10px;
}
.bubble2{
background:url(http://subagya.googlepages.com/comment-guwe.png) left top no-repeat;
 width:70px;
 height:45px;
 text-align:center;
 padding-top:40px;
padding-right:value;
 font-size:9px;
 font-family:Verdana, Arial, Helvetica, sans-serif;
 color:#575553;
 float:right;
 margin-right:10px;
}

Kalau mau ambil code di atas klik view plain nanti akan muncul popup code silahkan copy dari situ

3. Kemudian cari kode ini :

<div class='commentphoto' style='margin-top:.5em;'/>
<span class='numberingcomments'>
<a expr:href='&quot;#comment-&quot; + data:comment.id' title='Comment Link'>
<script type='text/javascript'>
CommentsCounter=CommentsCounter+1;
document.write(CommentsCounter)
</script>
</a>
</span>

Hapus kode yang berwarna tebal, setelah itu simpan hasil pekerjaan sobat
4. Sekarang masuk ke inti hacknya, sobat blogger cari kode ini <dd class='comment-footer'> dan masukkan kode ini dibawah ini tepat di bawah kode tersebut :

<div class='bubble1'><span class='numberingcomments'>
<a expr:href='&quot;#comment-&quot; + data:comment.id' title='Comment Link'>
<script type='text/javascript'>
CommentsCounter=CommentsCounter+1;
document.write(CommentsCounter)
</script>
</a>
</span>
</div>


Langkah 4 merupakan hack untuk mengubah tampilan "numbering comments" nya komentar pengunjung blog sobat

5. Sekarang bagian yang punya blog (owner) kita ubah, cari kode di ini <dd class='comment-footer-author'> , kemudian masukkan kode di bawah ini tepat setelah kode tersebut :

<div class='bubble2'>
<span class='numberingcomments'>
<a expr:href='&quot;#comment-&quot; + data:comment.id' title='Comment Link'>
<script type='text/javascript'>
CommentsCounter=CommentsCounter+1;
document.write(CommentsCounter)
</script>
</a>
</span>
</div>


Langkah terakhir simpan hasil pekerjaan sobat dan lihat hasilnya, kalau sukses berarti sobat hwebat, kalau gagal kasihan deeh loooh... kekekekekkeke :p . Btw anyway buzway blogger hack ini sudah saya aplikasikan ke template minima dan hasilnya berhasil, and then satu lagi template dari free downloadan hasilnya juga bagus. Ok, kalau masih bingung silahkan hubungi saya lewat YM, email atau berkomentar di postingan ini. Happy blogging and selamat menunaikan ibadah puasa.

Menampilkan kode HTML/Javascript yang unik di postingan (3)

Sehabis sahur buat posting baru nih sob biar masih refresh ingatan saya, sesuai dengan judulnya "Menampilkan kode HTML/Javascript yang unik di postingan versi 3" (biar lengkap bikin trilogynya-red). Seperti yang sudah saya posting sebelumnya di blog ini,ada banyak cara menampilkan kode HTML/Javascript di dalam postingan, kalau yang belum baca silahkan klik di sini untuk versi 1 dan klik di sini untuk versi 2. Sekarang kita lihat perbedaan masing-masing versinya. Mau tahukan perbedaannya?

Versi 1 :

#rec { margin:20px;padding:20px;}
.hint {
border: 1px solid #4AB7FF;
font-size: 11px;
color: #191919;
background: #BFE5FF url(http://i280.photobucket.com/albums/kk162/mochal_nl_2008/info.gif) no-repeat 5px center;
font-family: Verdana, sans-serif, "Courier New";
line-height: 125%;
margin: 5px 0px 0px;
padding: 12px 12px 12px 40px;
display: block;
font-weight: 400;
width: 85%;
}

Versi 2 :

#rec { margin:20px;padding:20px;}
.hint {
border: 1px solid #4AB7FF;
font-size: 11px;
color: #191919;
background: #BFE5FF url(http://i280.photobucket.com/albums/kk162/mochal_nl_2008/info.gif) no-repeat 5px center;
font-family: Verdana, sans-serif, "Courier New";
line-height: 125%;
margin: 5px 0px 0px;
padding: 12px 12px 12px 40px;
display: block;
font-weight: 400;
width: 85%;
}


Versi 3 :

#rec { margin:20px;padding:20px;}
.hint {
border: 1px solid #4AB7FF;
font-size: 11px;
color: #191919;
background: #BFE5FF url(http://i280.photobucket.com/albums/kk162/mochal_nl_2008/info.gif) no-repeat 5px center;
font-family: Verdana, sans-serif, "Courier New";
line-height: 125%;
margin: 5px 0px 0px;
padding: 12px 12px 12px 40px;
display: block;
font-weight: 400;
width: 85%;
}

Sangat jelas sekali perbedaannyakan, nah sekarang tinggal bagaimana cara membuatnya dan kelebihan dari versi 3 ini.
1. Seperti biasa login terlebih dahulu ke blogspot, kemudian masuk ke Tata Letak > edit HTML

Jangan lupa simpan template lengkapnya, klik Download Template Lengkap!!

2. Masukkan kode ini di bawah <!-- end outer-wrapper -->

3. Kemudian simpan hasil pekerjaan sobat, nah sekarang tinggal bagaimana mengaplikasikannya.
Gunakan tag kode ini setiap ingin memposting kode HTML-an atau CSS,dan javascript atau kalau mau lebih jelas mampir ke sini

<pre name="code" class="css">HTML/CSS/javascript </pre>

Kelebihan dengan memakai metode ini kita tidak perlu lagi memparse/encode kode HTML-annya langsung taruh saja sesuai kode mentahnya, dan kalau mau ambil kodenya klik view plain, terus kalau mau ngeprint klik print.

Ok bro, cukup kayaknya postingan kali ini soalnya saya sudah mengantuk berat nih, and btw anyway buzway happy blogging dan selamat menunaikan ibadah puasa.

Saya dapat ilmu ini dari sini.