Tips dan Trik Blogspot: Desember 2010

Jumat, 10 Desember 2010

Memasang Profil facebook di blog

Siapa sih yang tidak kenal dengan Facebook? Social network yang satu ini sedang naik daun belakangan ini terutama di Indonesia. Saya yakin kebanyakan dari anda pasti sudah pernah mendengarkannya. Bahkan banyak diantara anda yang sudah mempunyai account disana.

Ketika anda melakukan blogwalking pasti pernah melihat blogger yang memasang profil Facebook di blognya. Ini agar pengunjung mudah untuk menghubunginya dan sekaligus membangun komunitas.

Bagi anda yang memiliki akun di Facebook dan ingin memasang profil Facebook anda di blog. Silahkan ikuti langkah-langkah dibawah ini:

1. Login ke Facebook. Lalu pilih menu Profile

2. Kemudian klik Create a Profile Badge yang terletak dibawah menu "Notes"

3. Klik Create Badge

4. Setting tampilan yang anda inginkan dengan memilih Layout, Format (dibiarkan image saja), dan Items yang mau ditampilkan.

5. Jika sudah klik Save kemudian copy kode HTML yang diberikan lalu pastekan ke blog anda.

6. Selesai.

Selamat mencoba.

Cara pasang taburan bintang pada mouse

Mempercantik atau memperindah tampilan Blog adalah naluri dari setiap blogger, dan jika tampilan blog seorang blogger telah mencapai tahap yang paling indah nantinya juga sang pemilik akan bangga terhadap blognya.Dalam postingan kali ini Shufi akan menjelaskan tentang bagaimana Cara Membuat Cursor Bertabur Bintang.Cursor yang bertabur bintang adalah salah satu cara untuk mempercantik tampilan blog.

karena saat cursor di geser kursor tersebut akan mengeluarkan bintang-bintang. Contohnya Bisa anda lihat pada gambar di atas.

Setelah melihat Contohnya Tertarik gak temen2 untuk membuatnya ?jika tertarik silakan ikuti tutorial Cara Membuat Cursor Bertabur Bintang di bawah ini untuk Membuat Cursor Bertabur Bintang.

1.Login ke blogger.

2.Klik Tatat Letak.

3.Klik Tambah Gadget.

4.Pilih HTML/javascript.

5.Pilih lalu Copy dan paste kode di bawah ini ke dalah kotak HTML/javascript tadi .

Bintang Biru

<script src="http://denisahlan.netau.net/bintang.biru.js" type="text/javascript"></script>

Bintang Hijau

<script src="http://denisahlan.netau.net/bintang.hijau.js" type="text/javascript"></script>

Bintang Merah

<script src="http://denisahlan.netau.net/bintang.merah.js" type="text/javascript"></script>

Bintang Putih

<script src="http://denisahlan.netau.net/bintang.putih.js" type="text/javascript"></script>

Bintang Ungu

<script src="http://denisahlan.netau.net/bintang.ungu.js" type="text/javascript"></script>

6.Kalo sudah selesai jangan lupa click SIMPAN...

7.Selanjutnya silahkan anda lihat hasilnya...

sumber : http://klinik-it.blogspot.com/2010/03/cara-membuat-cursor-bertabur-bintang.html

Memasang Label Cloud Pada Blogspot

Label cloud ini dikembangkan oleh phydeaux3. Sesuai dengan namanya, widget ini berhubungan dengan label sehingga bagi anda yang tidak memasang widget label pada blog anda. Cara ini tidak bisa digunakan.

Untuk label standar blogger, biasanya jumlah postingan yang termasuk dalam kategori tersebut akan tertera dalam bentuk angka yang terletak disampingnya. Tetapi beda dengan label cloud, yang menggambarkan jumlah postingan dalam bentuk ukuran font labelnya. Jadi semakin banyak postingan yang termasuk dalam kategori tersebut semakin besar pula ukuran fontnya. Sehingga terlihat lebih menarik dan tidak monoton. Selain itu, cara ini juga cocok untuk ukuran sidebar yang lebar karena susunannya mengurut ke samping.

Nah bagi anda yang ingin memasang label cloud ini, berikut adalah langkah-langkahnya:

1. Seperti biasa login ke Blogger. Pada menu Layout -> Edit HTML
2. Backup template anda
3. Beri tanda centang pada "Expand Widget Templates"
4. Letakkan kode dibawah ini diatas kode ]]></b:skin>

/* Label Cloud Styles ----------------------------------------------- */ #labelCloud {text-align:center;font-family:arial,sans-serif;} #labelCloud .label-cloud li{display:inline;background-image:none !important;padding:0 5px;margin:0;vertical-align:baseline !important;border:0 !important;} #labelCloud ul{list-style-type:none;margin:0 auto;padding:0;} #labelCloud a img{border:0;display:inline;margin:0 0 0 3px;padding:0} #labelCloud a{text-decoration:none} #labelCloud a:hover{text-decoration:underline} #labelCloud li a{} #labelCloud .label-cloud {} #labelCloud .label-count {padding-left:0.2em;font-size:9px;color:#000} #labelCloud .label-cloud li:before{content:"" !important}

5. Setelah itu, letakkan kode dibawah ini diatas kode </head>

<script type='text/javascript'>
// Label Cloud User Variables
var cloudMin = 1;
var maxFontSize = 20; /* Ukuran maksimal font label*/
var maxColor = [0,0,0]; /* Warna font besar */
var minFontSize = 10; /* Ukuran minimal font label */
var minColor = [179,179,179]; /* Warna font kecil */
var lcShowCount = false;
</script>

6. Lalu cari kode dibawah ini.

<b:widget id='Label1' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>

<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

7. Ganti kode diatas dengan kode dibawah ini

<b:widget id='Label1' locked='false' title='Label Cloud' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>

<div class='widget-content'>
<div id='labelCloud'/>
<script type='text/javascript'>

// Don't change anything past this point --------------
// Cloud function s() ripped from del.icio.us
function s(a,b,i,x){
if(a>b){
var m=(a-b)/Math.log(x),v=a-Math.floor(Math.log(i)*m)
}
else{
var m=(b-a)/Math.log(x),v=Math.floor(Math.log(i)*m+a)
}
return v
}

var c=[];
var labelCount = new Array();
var ts = new Object;
<b:loop values='data:labels' var='label'>
var theName = "<data:label.name/>";
ts[theName] = <data:label.count/>;
</b:loop>

for (t in ts){
if (!labelCount[ts[t]]){
labelCount[ts[t]] = new Array(ts[t])
}
}
var ta=cloudMin-1;
tz = labelCount.length - cloudMin;
lc2 = document.getElementById('labelCloud');
ul = document.createElement('ul');
ul.className = 'label-cloud';
for(var t in ts){
if(ts[t] < cloudMin){
continue;
}
for (var i=0;3 > i;i++) {
c[i]=s(minColor[i],maxColor[i],ts[t]-ta,tz)
}
var fs = s(minFontSize,maxFontSize,ts[t]-ta,tz);
li = document.createElement('li');
li.style.fontSize = fs+'px';
li.style.lineHeight = '1';
a = document.createElement('a');
a.title = ts[t]+' Posts in '+t;
a.style.color = 'rgb('+c[0]+','+c[1]+','+c[2]+')';
a.href = '/search/label/'+encodeURIComponent(t);
if (lcShowCount){
span = document.createElement('span');
span.innerHTML = '('+ts[t]+') ';
span.className = 'label-count';
a.appendChild(document.createTextNode(t));
li.appendChild(a);
li.appendChild(span);
}
else {
a.appendChild(document.createTextNode(t));
li.appendChild(a);
}
ul.appendChild(li);
abnk = document.createTextNode(' ');
ul.appendChild(abnk);
}
lc2.appendChild(ul);
</script>

<noscript>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>
</noscript>
<b:include name='quickedit'/>
</div>

</b:includable>
</b:widget>

8. Kalau sudah, klik Save Template. Selesai

Jika sobat ingin memodifikasi ukuran dan warna font labelnya. Silahkan arahkan perhatian anda pada kode seperti ini

<script type='text/javascript'>
// Label Cloud User Variables
var cloudMin = 1;
var maxFontSize = 20; /* Ukuran maksimal font label*/
var maxColor = [0,0,0]; /* Warna font besar */
var minFontSize = 10; /* Ukuran minimal font label */
var minColor = [179,179,179]; /* Warna font kecil */
var lcShowCount = false;
</script>

Ganti tulisan yang berwarna merah sesuai keinginan. Selamat mencoba..!

Apa manfaat widget follower di blogspot?

Berhubung ada yang menanyakan kesaya apa manfaat follower maka saya akan mencoba menerangkan sedikit disini barangkali masih ada yang belum tahu. Jika dilihat dari penampilannya mungkin ada yang menyangka jika widget ini berfungsi untuk menjaring komunitas atau untuk pemanis blog saja.

Tetapi sebenarnya widget ini dibuat oleh pihak blogger untuk mempermudah kita (pengguna blogger) berlangganan dengan blog lain. Jadi fungsinya hampir sama dengan RSS Feed dimana kita akan mendapat informasi jika blog yang bersangkutan memposting artikel baru. Bedanya antara RSS feed dan Follower adalah jika kita berlangganan melalui RSS feed maka kita hanya akan mendapat notifikasi apabila kita membuka Google Reader, MyYahoo, atau Bloglines (tergantung dimana kita berlangganan). Hal ini tentu kurang efektif bagi anda para blogger yang jarang membuka rss reader yang saya sebutkan diatas. Tetapi jika berlangganan melalui Follower maka anda bisa langsung mendapat notifikasi dari menu Dashboard blogger anda. Sehingga anda tidak perlu kemana-mana cukup login ke blogger anda. Maka anda akan mendapat informasi terkini dari blog yang anda follow. Gmn lebih praktis kan?

Jadi bagi anda yang suka menjadi pertamax (orang yang pertama kali berkomentar) di blog favorit anda. Jangan lupa untuk menfollow blognya. Dijamin gak rugi deh pokoknya

Untuk menjadi follower caranya sangat mudah. Ada beberapa cara yang bisa anda gunakan. Jika blog yang bersangkutan memasang widget Follower maka anda bisa langsung menjadi followernya dengan klik Follow -> Ikuti blog ini.

Tetapi bagaimana jika blog yang bersangkutan tidak memasang widget Follower? Tidak perlu khawatir, anda tetap bisa menfollow blognya dengan cara login ke menu dashboard blogger anda kemudian klik Add yang terletak dibagian bawah menu Dashboard seperti yang ditunjukkan pada gambar dibawah ini.

Setelah itu, masukkan alamat blog yang ingin anda follow, contohnya http://hermanblog.com atau import dari Google reader jika anda sudah pernah berlangganan melalui Google reader sebelumnya. Jika sudah klik Next. Selesai. Sekarang anda bisa segera mendapat informasi terbaru dari blog favorit anda di menu dashboard blogger.

Selamat berlangganan blog favorit anda. Semoga postingan singkat ini bisa menjawab pertanyaan anda.

Memasang musik player pada blog

Bagi anda penggemar musik. Memutar lagu melalui HP, Mp3 player ataupun komputer mungkin sudah biasa. Tetapi bagaimana jika memutar musik melalui blog?

Dengan memasang musik player di blog maka tidak hanya anda tetapi pengunjung blog anda juga bisa menikmati lagu kesayangan anda. Sehingga cara ini sangat cocok bagi anda yang blognya berisi tentang musik atau bagi anda yang ingin mempromosikan lagu pribadi.

Ada banyak layanan seperti ini yang tersedia di internet. Dari sekian banyak layanan yang ada. Menurut saya ada 2 musik player yang cukup bagus yakni Musik-live dan eSnips. Kedua musik player ini masing-masing memiliki kelebihan dan kekurangannya. Sehingga silahkan anda tentukan sendiri mana yang lebih bagus.

1. Musik-Live

Kelebihan:
- Lagu sudah tersedia, tinggal pasang
- Banyak model skin yang bisa anda pilih

Kelemahan:
- Tidak bisa upload lagu sendiri

2. eSnips

Kelebihan:
- Bisa upload lagu dari komputer
- Tersedia lagu yang bisa anda putar

Kelemahan:
- Hanya 2 model skin yang bisa dipilih
- Tampilannya kurang menarik

Nah itulah kelebihan dan kelemahannya masing-masing. Silahkan anda tentukan mana yang lebih cocok dengan kebutuhan anda. Agar lebih jelas anda bisa lihat demo Musik-live disini dan eSnips disini.

Kalau sudah menentukan musik player kesukaan anda, berikut adalah langkah-langkah pemasangannya:

A. Musik-Livet.Net

1. Kunjungi http://musik-live.net/ lalu klik Skin Mp3 Player
2. Pilih tampilan player yang anda inginkan. Untuk melihat tampilannya klik Preview Skin
3. Copy kode dalam kolom 'Embed code' lalu buka blogger. Klik menu Design -> Page Elements
4. Paste kode tersebut ke menu HTML/ Javascript
5. Selesai.

Diatas adalah cara memasang musik player dengan lagu yang telah disediakan. Jika anda ingin memilih sendiri lagunya. Berikut caranya:

1. Pada halaman Musik-Live, cari lagu favorit anda dengan kotak pencari.
2. Lalu klik Play & Embed code untuk menampilkan kodenya
3. Copy kodenya lalu paste ke menu HTML/ Javascript blogger anda. Selesai

Catatan:
Cara ini hanya bisa untuk memutar 1 lagu saja. Jika anda ingin memutar banyak lagu maka gunakan eSnips.

B. eSnips

1. Kunjugi http://www.esnips.com/. Untuk bisa memanfaatkan fasilitasnya anda harus signup terlebih dahulu. Jika sudah, sign-in ke akunnya.

2. Klik Upload Files lalu klik Select Files

3. Pilih lagu yang mau anda putar lalu pilih folder dimana anda mau memyimpan lagunya. Pastikan folder yang anda pilih adalah bersifat Public. Karena kalau Private anda tidak bisa menambahkan lagunya kedalam playlist.

4. Jika sudah klik Upload Now

5. Tunggu hingga proses upload selesai.

6. Jika sudah klik menu Folder. Pilih folder dimana anda menyimpan menyimpan lagunya

7. Pilih lagu-lagu yang ingin anda pasang dengan cara klik Add to quicklist

8. Jika sudah, scroll ke bagian atas halaman lalu klik Create playlist widgets

9. Pilih skin yang anda inginkan. Lalu copy kodenya yang ada pada kotak.

10. Buka blogger. Paste kodenya pada menu HTML/ Javascript lalu klik Save

11. Selesai. Silahkan lihat hasilnya.

Jika ukurannya tidak pas anda bisa mengatur ukurannya dengan mengedit nilai width-nya pada kodenya masing-masing. Selamat mencoba..

Fiuhh..

. Akhirnya selesai juga hasil eksperimen selama 3 hari.

Memasang Widget Google Translate pada blog

Sesuai dengan namanya. Widget ini berfungsi untuk menerjemahkan bahasa yang satu ke bahasa yang lain. Dengan memasang widget ini, maka pengunjung yang berasal dari negara lain juga bisa menikmati konten diblog anda. Selain itu, anda juga bisa memanfaatkan widget ini untuk belajar bahasa asing lho. Menarikkan?

Sebenarnya google translate ini sudah pernah saya bahas pada beberapa waktu yang lalu. Namun karena widget ini sudah mengalami perubahan yaitu menggunakan icon-icon bendera sehingga tampilannya menjadi lebih menarik.

Contohnya seperti ini yang dibuat oleh mad tomatoe

dan ini yang dibuat oleh kang rohman

Oleh sebab itu, pada postingan ini saya ingin membahas kembali dengan menyajikan widget buatan saya sendiri. Seperti yang dibawah ini

Widget ini saya buat dengan mengganti icon bendera yang berbentuk seperti pin dan diberi sedikit efek shadow sehingga hasilnya menjadi seperti diatas. Semoga tidak terlalu mengecewakan.

Bagi anda yang tertarik, silahkan copy kode dibawah ini.

Untuk Google Translate 2 baris. Gunakan kode dibawah ini:

Untuk Google Translate 3 baris. Gunakan kode dibawah ini:

1. Kalau sudah, buka kotak HTML/ javascript lalu pastekan kodenya kedalam kotak.

2. Klik Save. Selesai. Silahkan lihat hasilnya.

Jika anda merasa letaknya kurang pas dengan kolom sidebar anda. Anda bisa menyesuaikan jaraknya dengan mengganti nilai 0 pada padding-left. Semakin tinggi nilainya semakin lebar jaraknya. Dan jika anda ingin mengganti icon benderanya dengan icon lain. Silahkan ganti tulisan bewarna merah dengan alamat url icon anda.

Selamat mencoba. Semoga bermanfaat..

Memasang status yahoo messenger di blog

Dengan memasang status Yahoo Messenger di blog anda maka pengunjung dapat dengan berinteraksi dengan anda karena ketika anda sign in di Yahoo messenger maka status YM akan berubah menjadi

sehingga pengunjung bisa tau jika anda sedang online pada saat itu. Dan begitu juga sebaliknya jika anda sign out dari Yahoo messenger maka statusnya akan berubah menjadi

Menarik kan? Nah bagi anda yang ingin memasangnya. Berikut caranya:

1. Login ke Blogger. Klik Design -> Page Elements

2. Klik Add a Gadget -> HTML/ Javascript

3. Copy kode dibawah ini lalu pastekan kedalam kotak

<a href="ymsgr:sendIM?yahooid"> <img src="http://opi.yahoo.com/online?u=yahooid&m=g&t=1&l=us"/>
</a>

Keterangan:
Ganti tulisan yang dicetak tebal dengan yahoo id anda.
Angka 1 bisa anda ganti dengan angka lain. Silahkan ganti angka sesuai dengan status Yahoo messenger yang ada pada tabel dibawah ini. Pilih yang anda suka yach.. hehe..