Minggu, 01 Juli 2012

Cara Memasukan Musik pada Blogger

Sebelumnya mungkin Sobat sudah ada yang tahu tentang posting kali ini. Yaitu Cara Memasang Musik Player pada Blogger. Kali ini saya akan berbagi ilmu untuk sobat yang belum tahu caranya.
Langkah-langkahnya sebagai berikut :

 

  • Dalam tab search music ketik nama band atau lagu yang kita inginkan
  • Setelah itu kita bisa menambahkan judul dan nama band yang ada dengan menekan tombol +,
  • atau Sobat bisa mendengarkannya dulu dengan tombol Play


   

  • Sobat juga bisa menambahkan lagu yang tidak bisa Sobat dapatkan di website ini,dengan menambahkan URL dari website lain atau mengupload dari komputer  


  •  Setelah memasukan playlist lagu, Sobat bisa memilih tampilan yang akan Sobat pergunakan pada blogger sobat


   
  • Kita juga bisa mengubah warna tampilannya di tab Color and Style





  • Pada tab Seting terdapat beberapa setingan yang dapat kita ubah.Seperti berikut:Autoplay artinya ketika pengunjung mengunjungi blog anda, maka lagu akan langsung otomatis di jalankan, kita bisa pilih yes agar otomatis atau No agar pengunjung dapat memilih lagu mereka sendiri
  • Shuffle artinya setiap lagu di mainkan secara Random atau acak sebaiknya di No saja agar pengunjung bisa mendengarkan semua lagu yang ada dari awal hingga akhir.
  • Loop berfungsi bila lagu dalam playlist habis akan otomatis memutar kembali lagu dari awal playlist, jadi kita pilih Yes
  • Privacy bisa anda gunakan agar lagu yang ada masukan tidak bisa di degarkan oleh pengunjung
  • Yang terakhir adalah Volume,biar terdengar jelas sebaiknya di Full aja ya 


  • Setelah itu kita masuk ke tab Save Playlist,di sini kita kita di haruskan memasukan Judul Playlist,Deskripsi,dan genrenya, dan juga Tags yang kita gunakan untuk mempermudah pencarian kembali playlist kita 
 

  •  Klik Save bila semua Deskripsi sudah terisi. 
  •  Bila kita baru pertama kali menggunakan MixPod Sobat akan di minta mendaftar. Isi saja semua kolom seperti yang di perintahkan, lalu klik Sign Up
 

  • Pada halaman ini terdapat beberapa pilihan (sebelah kiri layar) apa kita akan meletakan playlist ini pada Blogger, FaceBook, HiS, Friendster, Myspace dan situs-situs yang lain. Sobat pilih Blogger soalnya kita lagi bahas membuat pada Blogger, kalau di Friendster ntar bikin sendiri aja ya, caranya sama........

 
  • Di bawah tulisan Post Your Playlist To Blogger pada kotak Text Area yang ada terdapat kode HTML, kode ini yang akan kita masukan pada Widget yang ada pada blog kita. Jadi copy semua kode tersebut.
  •  Setelah itu kita Login ke Blogger Sobat.
 Pada dasbor blog kita masuk ke dalam Tab Tata Letak,seperti yang di tampilkan pada gambar di atas.
  • Klik Tab Elemen laman
  • Pada Tab Elemen laman,klik tambah gadget

  • Pilih tambahkan HTML\Java Script
  • Masukan kode yang kita dapatkan dari MixPod pada kotak yang besar, jangan lupa pasang judulnya ya.

Semoga bermanfaat. 
Read More ->>

Cara memasukan Video Youtube Pada Blogger

Hello guys posting lagi nih tentang youtube........

Sudah kenal sama YouTube kan.....?
Saya yakin sobat pasti sudah tahu, siapa sih yang gak kenal sama youtube....?.

Pada kesempatan kali ini saya ingin membahas bagaimana cara memasukkan Video YouTube ke posting di blogger, bukan Cara Download Video YouTube lho......

Bagi sobat yang ingin membuat blogger yang berisi dengan Video YouTube pada khususnya, sudah tentu wajib mengetahui cara memasukkan video youtube pada Blogger.

Sebenarnya Memasukkan Video Youtube ke blogger bukanlah hal yang susah, tapi kalau gak tahu caranya tetap saja susah......

Ok, Langsung saja....


Langkah pertama

Silahkan cari video youtube yang ingin anda masukkan ke posting di situsnya yaitu www.youtube.com

Langkah keDua


Silahkan klik tulisan Embed yang letaknya di sebelah kanan Video tersebut dan silahkan tunggu sampai kode html nya terlihat . Lihat Gambar Berikut.
Cara Memasukkan Video Youtube Ke Posting Blog

Langkah keTiga


Kopi kode html yang sudah di sediakan oleh youtube tadi kemudian paste ke posting blog, ingat pastenya di bagian Edit HTML.

Langkah keEmpat


Letakkan kode html video youtube tersebut di tempat yang anda inginkan, setelah itu silahkan publikasikan Posting tersebut.

Jika anda mengklik Menu Compose (yang bersebelahan dengan Edit HTML itulho), maka video youtube tersebut akan terlihat seperti ini:

Cara Memasukkan Video Youtube Ke Posting Blog
selesai deh, selamat mencoba.
Semoga bermanfaat. 
Read More ->>

Cara memasang Emotikon pada komentar

emoticon blog
Kembali saya memberikan postingan tentang Tutorial Blogger. Sebelumnya juga mengenai Informasi tutorial blogger, sekarang pun sama, karena saya ingin sekali membagi ilmu dengan sobat semua, pokoknya mengenai blogger deh. Sesuai dengan deskripsi blog saya ini, bahwa kita sebagai blogger harus sharing ilmu dengan blogger lain, terutama bagi yang baru belajar blog alias NewBie. Kali ini saya akan memberikan sedikit panduan bagaimana cara untuk memasang emoticon lucu di kotak komentar pada blogger. Meski sudah banyak para blogger senior yang sudah memberikan tutorial ini, saya akan memberikan lagi tapi dalam versi saya sendiri.

Anda bisa lihat gambar-gambar emoticon di blog saya ini, tepat di atas kotak komentar, seperti ini:
emoticon pada komentar blogspot

Anda tertarik untuk memasang pada blogger anda ? Maka, silahkan di baca "step by step" caranya:
  • Login ke akun blogger anda
  • klik Template
  • pilih Edit HTML, Jangan lupa Centang pada Expand Widget Templates.
  • tekan tombol di keyboard, Ctrl+F, kemudian cari kode </body>
  • lalu copy kode berikut:
  • <script src='http://nova13.googlecode.com/files/nova13_plurk_kompres.js' type='text/javascript'/>
  • Kemudian paste-kan di atas kode </body>
  • Jika sudah, Simpan/Save Template.

Ini belum selesai, jika anda ingin menampilkan emoticon yang anda pasang script-nya tadi, karena untuk memberi tahu kepada calon komentator blog anda bahwa di blog anda bisa di isi emoticon.
  • Car lagi kode <p class='comment-footer'>, serta kode <b:if cond='data:post.embedCommentForm'>
  • copy kode berikut, lalu paste tepat di antara kode di atas. lebih detailnya di bawah kode <p class='comment-footer'> dan di atas kode <b:if cond='data:post.embedCommentForm'>
  • <p><b>Pasang emoticon dibawah ini dengan mencantumkan kode di samping kanan gambar.</b></p> <b><img src="http://statics.plurk.com/4f01bac8a707e5450307f97065ec0fa7.gif" />
    :a:
    <img src="http://statics.plurk.com/65271ac2126706bc09d31ff67c525d67.gif" />
    :b:
    <img src="http://statics.plurk.com/fcd28d7d78ec1f828c76930fa63270e6.gif" />
    :c:
    <img src="http://statics.plurk.com/3385896779bf1c13188bf92ca516878e.gif" />
    :d:
    <img src="http://statics.plurk.com/bac8c8392f7ca8f5ac74612be4d08b74.gif" />
    :e:
    <img src="http://statics.plurk.com/d1a6f08507b126ec6a215e6a2372e8bb.gif" />
    :f:
    <img src="http://statics.plurk.com/373cd2f23dab7528d4875170d13d64f7.gif" />
    :g:
    <img src="http://statics.plurk.com/e8ed6c7eed76d2acd9dbf469f29fbec2.gif" />
    :h:
    <img src="http://statics.plurk.com/aabbc82c2b0dc72bfbce2f82c97a95e8.gif" />
    :i:
    <img src="http://statics.plurk.com/35b16fc25623670e41c2be6bf8ac38c7.gif" />
    :j:

    <img src="http://statics.plurk.com/843739a95294fd0bf4c958840b46408f.gif" />
    :k:
    <img src="http://statics.plurk.com/b0b0596acce9ffc1f2a27548aa642eaf.gif" />
    :l:
    <img src="http://statics.plurk.com/1c890273544559b17f090d09238fa763.gif" />
    :m:
    <img src="http://statics.plurk.com/95e69aa508d4bb435706b9db0a610dad.gif" />
    :n:
    <img src="http://statics.plurk.com/db4c4a7d141fdcaca4d4b11f8fb360db.gif" />
    :o:
    <img src="http://statics.plurk.com/bb1e3fed482959a00013f7f1efcc17a0.gif" />
    :p:
    <img src="http://statics.plurk.com/e49c8ae965452550c98fc7f99741ae0d.gif" />
    :q:</b>
  • Anda juga bisa menganti kalimat yang berwarna biru di atas dengan kata-kata anda sendiri.
  • Jika sudah, Save Template.
  • Selesai.
Mudah bukan? kini anda sudah bisa menggunakan emoticon tersebut di blog anda. Jadi berkomentar akan terasa berwarna jika ada gambar emoticon yang mewakili perasaan anda.

Sekian dulu, selamat mencoba Postingan saya ini.
Semoga bermanfaat.
Read More ->>

Cara membuat efek gelembung saat kursor digerakan


Cara Membuat Efek Gelembung - Efek Bubble Pada Cursor Blogger
Pada tutorial blogger kali ini saya akan menuliskan panduan cara bikin efek gelembung atau membuat efek bubble pada cursor bloggger.

Dengan menggunakan script yang akan saya sertakan di bawah nanti, cursor blog blogger teman akan mengeluarkan gelembung-gelembung atau bisa juga di sebut bubble.

Sebelum saya menuliskan caranya, saya ingin menegaskan bahwa ini hanya salah satu cara untuk mempercantik atau menghias blog kita, dan sifatnya tidak wajib, karena mungkin saja ini bisa memperberat loading blog teman.

Mari kita mulai panduan membuat efek bubble ini.

Di sini saya akan menuliskan 2 cara yang bisa kita lakukan agar cursor blog kita bisa mengeluarkan gelembung.

Cara Pertama
1. Klik Tata Letak
2. Klik Tambah Gadget / Add A Gadget

3. Pilih Gadget Html/JavaScript
4. Masukkan Efek Gelembung (Bubble) di dalamnya
    (jangan lupa klik Edit HTML ya, letaknya di sebelah kanan atas kolom isian).
5. Simpan.

Cara Kedua
1. Klik menu seperti ini


2. Klik menu / tulisan Template
3. Klik menu Edit HTML
4. Klik tulisan / menu Lanjutkan
5. Beri centang pada Expand Template Widget

6. Pasang script efek gelembung / bubble sebelum kode </head>
7. Simpan.
Berikut script Efek Gelembung / Efek Bubble yang harus di pasang, silakan pasang script berikut sesuai tutorial yang sudah saya tuliskan di atas:
<script type="text/javascript" src="http://www.freewebs.com/p.js"></script><script type="text/javascript">
// <![CDATA[
var colours=new Array("#cc0000", "#cc0000", "#cc0000", "#cc0000", "#cc0000"); // colours for top, right, bottom and left borders and background of bubbles
var bubbles=100; // maximum number of bubbles on screen

var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var bubb=new Array();
var bubbx=new Array();
var bubby=new Array();
var bubbs=new Array();

window.onload=function() { if (document.getElementById) {
var rats, div;
for (var i=0; i<bubbles; i++) {
rats=createDiv("3px", "3px");
rats.style.visibility="hidden";

div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.top="1px";
div.left="0px";
div.bottom="1px";
div.right="0px";
div.borderLeft="1px solid "+colours[3];
div.borderRight="1px solid "+colours[1];

div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.top="0px";
div.left="1px";
div.right="1px";
div.bottom="0px"
div.borderTop="1px solid "+colours[0];
div.borderBottom="1px solid "+colours[2];

div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.left="1px";
div.right="1px";
div.bottom="1px";
div.top="1px";
div.backgroundColor=colours[4];
div.opacity=0.5;
if (document.all) div.filter="alpha(opacity=50)";

document.body.appendChild(rats);
bubb[i]=rats.style;
}
set_scroll();
set_width();
bubble();
}}


function bubble() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<bubbles; c++) if (!bubby[c]) {
bubb[c].left=(bubbx[c]=x)+"px";
bubb[c].top=(bubby[c]=y)+"px";
bubb[c].width="3px";
bubb[c].height="3px"
bubb[c].visibility="visible";
bubbs[c]=3;
break;
}
}
for (c=0; c<bubbles; c++) if (bubby[c]) update_bubb(c);
setTimeout("bubble()", 40);
}

function update_bubb(i) {
if (bubby[i]) {
bubby[i]-=bubbs[i]/2+i%2;
bubbx[i]+=(i%5-2)/5;
if (bubby[i]>sdown && bubbx[i]>0) {
if (Math.random()<bubbs[i]/shigh*2 && bubbs[i]++<8) {
bubb[i].width=bubbs[i]+"px";
bubb[i].height=bubbs[i]+"px";
}
bubb[i].top=bubby[i]+"px";
bubb[i].left=bubbx[i]+"px";
}
else {
bubb[i].visibility="hidden";
bubby[i]=0;
return;
}
}
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sleft;
x=(e)?e.pageX:event.x+sdown; }

window.onresize=set_width;
function set_width() {
if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (typeof(self.innerHeight)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
else {
swide=800;
shigh=600;
}
}
window.onscroll=set_scroll;
function set_scroll() {
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height;
div.style.width=width;
div.style.overflow="hidden";
return (div);
}
// ]]>
</script>
Keterangan:
  • Kode #cc0000", "#cc0000", "#cc0000", "#cc0000", "#cc0000 adalah kode warna gelembung, silakan ganti dengan warna yang kamu mau, agar lebih mudah menemukan kode warna yang kamu inginkan silakan cari di Daftar Kode HTML Warna / Kode Warna.
  • Kode 100 adalah jumlah maksimal gelembung yang akan keluar, silakan ganti angka 100 dengan angka / jumlah gelembung yang kamu suka.

Nah itulah tutorial cara membuat efek gelembung / efek bubble pada cursor di blogger.
Selamat mencoba.

Semoga bermanfaat. 
Read More ->>

Cara memasukan button twitter pada blogger


Kali ini, --Cly First--mau share cara memasukan Button Twitter animasi untuk di pasang pada blogger, seperti pada blogger saya ini, langsung saja untuk langkahnya :

  • yang pertama kita kunjungi beberapa animasi twitter disini, dan muncul  tampilannya seperti ini :

  • kemudian kita bisa pilih beberapa button animasi twitter yang kita sukai kemudian klik Get Button, kemudian muncul tampilan seperti gambar di bawah
  • Setelah muncul gambar diatas, kemudian kita tinggal masukan ID twitter sobat, kemudian klik Apply Your Twitter To The Code, kemudian tinggal Copy kode yang dibawahnya dan Paste pada Blogger Sobat
  • Kemudian cara memasukan pada blogger anda, langkahnya :
  1. Login ke blogger
  2. Kemudian pilih Tata Letak --->Tambah Gadget--->HTML/JavaScript
  3. Paste code yg tadi telah di copy
  4. Klik Simpan Dan selesai dech.......
Semoga bermanfaat. 
Read More ->>

Popular Posts