Cara membuat Link Membesar ketika Sorot

Sebagai contoh coba anda arah kursor anda di sini. Bagaimana ? membesar kah ? nah... jika anda tertarik anda bisa ikuti langkah-langkah di bawah ini :

1. Selalu Login ke blog anda > Layout (tata letak) > Edit HTML
2. cari kode berikut ini yang mirip-mirip dengan ini (pusatkan pencarian pada bagian paling atas).

a:link {
color:$linkcolor;
text-decoration:underline;
font-size:12px;
}

a:visited {
color:$linkcolor;
text-decoration:underline;
font-size:12px;
}

a:hover {
color:#ff0000;
font-size:18px;
text-decoration:underline;
}

Perhatikan bagian font-size: (jika tidak ada anda bisa tambahkan sendiri). kode ini artinya adalah ukuran huruf link anda.

4. Sesuaikan ukurannya yang setiap bagian berarti :

a:link { adalah ukuran asli link
a:visited { adalah ukuran link jika sudah pernah di buka (saya sarankan yang ini samakan dengan yang di atas
a:hover { adalah ukuran link ketika di sorot oleh kursor (anda bisa ubah ukuran jadi lebih kecil / besa)

5. Save Templates.... Mudah kan, SANGAT MUDAH
Jika anda orang yang pinter, kreatif, genius, dll (seperti ehm...) anda bisa utak-atik kode lainnya loh

Selamat mencoba dan jangan lupa tinggalkan comment

Membuat Tampilan Blog berbeda setiap Halaman


Sangat menarik sekali ya jika blog kita berubah penampilan pada setiap halamannya ,awalnya saya hanya sekedar main-main ,lalu saya menemukan cara ini disini.Baiklah saya akan menerangkan secara Step By Step sepertii pada blog ini :

1. Login ke blog anda > Design > Edit HTML

2. Cari kode ]]></b:skin>
3. Letakan kode berikut setelah kode ]]></b:skin>
<style type='text/css'>
<b:if cond='data:blog.url == &quot;URL posting yang tampilannya ingin di bedakan&quot;'>
body {
background:url(http://themes.googleusercontent.com/image?id=1PlcOIpvGMP-0UUOAln6SU3f8a6hBUno7T80yhJ_0O-vGlNgYhk-lCPbst9AtRs5z3OAX) center fixed;
}
#outer-wrapper {
width:870px;background-color:rgba(60, 42, 31, 0.6);
}
#main-wrapper {
width:100%;
}
#footer-wrapper, #sidebar-wrapper {
display:none;
}
#header-wrapper {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUD-mQPzTkP3rsIiYrWMHLU9s-9ZsyMSOH8eSMQZuaATFCPq-AmK9UtjfbmAVtAVjOWjaqFdCrN92SHYjwHTbqcpwQAMczGsLO8LtYvopAZfPfpBCb9BWEPq7lXLtfdWPdyljZnvNPchrw/) center right;
}
.post {
color:white;
}</b:if>
</style>
  • Ganti yang berwarna merah dengan URL/Link posting yang tampilannay ingin di bedakan
  • Lalu ganti yang berwarna biru dengan style templates anda. Anda harus mengerti penulisan style templates jika ingin mengutak-atiknya
4. Save Templates.

Cara memasang Label Animasi/Tag Cloud

Ketika melakukan blogwalking, saya menemukan sebuah widget yang cukup menarik yaitu label animasi atau disebut dengan tag cloud. Label animasi ini mempunyai tampilan yang sangat menarik karena ketika kursor mouse disorot ke area tag cloud tersebut maka labelnya akan berotasi seperti orbit. Sehingga membuat blog kita terasa lebih interaktif.

Label animasi ini mempunyai fungsi yang sama dengan label standar dimana setiap kali kita memberi label pada postingan maka label tersebut secara otomatis akan muncul pada area tag cloud.

Nah bagi anda yang tertarik dengan label animasi ini. Berikut cara pemasangannya:

1. Seperti biasa. Login ke Blogger

2. Klik Download Full Template untuk membackup template anda

3. Setelah itu klik Design -> Edit HTML

4. Cari kode <b:section class='sidebar' id='sidebar' preferred='yes'>

5. Kalau sudah ketemu letakkan kode berikut tepat dibawah kode yang diatas
<b:widget id='Label88' locked='false' title='Tag Cloud' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://halotemplates.s3.amazonaws.com/wp-cumulus-example/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>UnoZoneu by<a href='http://www.unozoneu.co.cc/'>UnoZoneu</a> and <a href='http://www.unozoneu.co.cc'>Herman Blog</a></div>
<script type='text/javascript'>
var so = new SWFObject(&quot;http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;180&quot;, &quot;180&quot;, &quot;7&quot;, &quot;#ffffff&quot;);
// uncomment next line to enable transparency
//so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);
so.addVariable(&quot;tcolor&quot;, &quot;0x333333&quot;);
so.addVariable(&quot;mode&quot;, &quot;tags&quot;);
so.addVariable(&quot;distr&quot;, &quot;true&quot;);
so.addVariable(&quot;tspeed&quot;, &quot;100&quot;);
so.addVariable(&quot;tagcloud&quot;, &quot;<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>&quot;);
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
so.write(&quot;flashcontent&quot;);
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
Angka 180 menunjukkan panjang tag cloud dan angka 180 menunjukkan tinggi tag cloud. Silahkan diganti nilainya sesuai dengan ukuran sidebar template anda.

Sedangkan kode ffffff menunjukkan warna background dari tag clound. Angka menunjukkan warna teks dan angka 33333312 menunjukkan ukuran teks. Silahkan diganti sesuai keinginan.

6. Jika sudah, Klik Save Template. Selesai

Cara membuat Energy Saving Mode

Waktu saya lagi berkunjung ke blog sobat-sobat, saya menemukan hal yang belum saya ketahui, yaitu "Energy Saving Mode" atau juga bisa disebut "Screen Saver". Sebelum sobat mencobanya, coba tinggalkan blog saya ini (tapi jangan di close, cukup pindah ke tab lain) kira-kira 1 menit, dan lihat kembali blog saya..
dan yg akan anda lihat seperti ini ...

Kita langsung saja ke cara-caranya..
  1. Login terlebih dahulu ke Blogger ID Anda.
  2. Masuk ke Tata Letak/Rancangan.
  3. Pilih tab Edit HTML
  4. Klik Download Full Template, untuk membackup template sobat, jika terjadi kesalahan.
  5. Beri tanda centang pada Expand Template Widget.
  6. Cari kode <head>
  7. Copy paste kode di bawah ini persis di atas kode <head>

<!-- save your energy -->
<script language='javascript' src='http://www.onlineleaf.com/savetheenvironment.js' type='text/javascript'></script>
<!-- save your energy end -->

Lalu klik tombol Save Template, dan tunggu beberapa saat sampai Template tersimpan. Dan silakan melihat hasilnya. Semoga bermanfaat, terima kasih...

Membuat Label Blog menjadi Berwarna

Blogspot memang tak asing lagi dimata kita. Sudah berapa lama anda ngeblog? Yap.. pertanyaan itu pasti sering kita terima. Lamanya kita ngeblog membuat kita makin handal dalam berkreasi pada blog yang dipunya.

Postingan kali ini saya akan membahas tentang Membuat Label Blogspot Menjadi Berwarna. Seperti ini :
Yap.. biasanya kan label blogspot normalnya berwarna hitam, sekarang kita akan membuat label blogspot menjadi berwarna. Sepertinya ini aman digunakan karena tidak mengganggu widget ataupun elemen yang lain.

ini dia cara Membuat Label Blogspot Menjadi Berwarna :
1). Buka http://blogger.com/home
2). Klik tata letak
3). Klik Edit HTML
4). Salin (copy) kode ini :


.label-size-1 a {
font-size: 12px;
text-decoration: none;
}
.label-size-2 a {
font-size: 14px;
text-decoration: none;
color:#cd9f01;
}
.label-size-3 a {
font-size: 15px;font-family: Arial, Tahoma, Verdana;text-decoration: none;
}
.label-size-4 a {
font-size: 18px;
font-weight:bold;
text-decoration: none;
color:#ea5a04;
}
.label-size-5 a {
font-size: 24px;
text-decoration: none;
}


.label-size-1 a:hover,
.label-size-2 a:hover,
.label-size-3 a:hover,
.label-size-4 a:hover,
.label-size-5 a:hover { text-decoration:underline }