Membuat Footer 3 kolom Dengan Background

Pada tips Mmepercantik Blog kali ini saya akan menjelaskan cara Membuat Footer 3 Kolom Dengan Background,Baik saya akan memulai langkah-langkahnya


  1. Login ke blogger dan masuk ke Dasbor.
  2. Klik Rancangan, lalu pilih menu Edit HTML (Jangan Centang "Expand Template Widget")
  3. Cari kode ]]></b:skin>
  4. Letakkan kode CSS berikut ini diatas ]]></b:skin>

Cara Membuat Random Post Blog

Pada Tips Mempercantik Blog Kali ini saya Akan Menjelaskan Apa yg Dimaksud Random Post Dan caraPemasangannya di blog...

Yang di maksud dengan Random post adalah menampilkan posting yang ada di blog secara acak. Random post berguna untuk meningkatkan jumlah pageview blog kita sehingga pembaca bisa kita tahan untuk lebih lama membaca isi blog kita, alhasil dapat meningkatkan Pagerank dan nilai Alexa suatu blog.

Berikut cara memasang random post pada blog:

Pertama:
Login ke akun Blog anda--->Tata Letak/rancangan---> edit HTML--> centang Expand Widget dan jangan Lupa Backup templatenya...

Kemudian Cari Kode ]]></b:skin> Dan Copy Paste Kode/script berikut diatasnya

Pada Tips Blogspot Sebelumnya saya sudah Menjelaskan Bagaimana Membuat Link Mengeluarkan Bintang Saat Mouse Menyorotnya?Dan Sekaraang Saya akan Menjelaskan Tentagn Cara Membuat Tombol Home,Back To top,Dan Bottom.Baiklah Saya akan Memulai Langkah langkahnya?

1.Masuk Ke akun Blog Sobat
2.Pada Dasbor Pilih Rancangan-->Edit HTML Dan jangan Lupa Centang Kolo Expand Template Widget
3.Kemudian Cari Kode ]]></b:skin> ( gunakan CTRL F atau F3 untuk memudahkan pencarian )
4.Copy Paste Kode Dibawah Ini Tepat Diatas Kode Tadi

Membuat Teks Area Cantik Di Blog

Cara Memberi Background Pada Judul Posting Blog

Pada Tips Mempercantik blog Atau Pada Tutorial Blog sebelumnya Saya Sudah Menjelaskan Tentang BagaimanaCara Membuat teks area cantik di blog dan Pada artikel kali ini saya akn menjelaskan pada sobat tentang bagaimana Cara Memberi background Pada Judul Posting Blog.Background judul posting bertujuan untuk memperindah judul posting pada blog!..Seperti Punya Saya.
Punya saya juga saya beri background judul postig bertujuan untuk memperindah blog saya.
jika sobat ingin seperti itu mari ikuti langka-langkah berikut:

1.Login Ke akun blog sobat
2.Pilih Rancangan/Tata Letak---> Edit HTML--centang kolom expand template Widget
3.Cari Kode  ]]></b:skin>  (gunakan ctrl f atau F3 agar memudahkan pencarian)
4.Letakan Kode ini dibawahnya Tepa Diatas Kode ]]></b:skin>

Cara Menyisipkan Gambar Pada Judul Posting Blog

Pada Tips Mempercanrik Blog Sebelumnya Saya Sudah Menjelaskan tentang bagaimanacara memberi backgground pada judul posting dan pada artikel kali ini saya akan menjelaskan pada sobat tentang bagaimana cara menyisipkan gambar pada judul posting blog.Seperti judul posting saya,saya sudah sisipkan sebuah image untuk memperindahnya.
jika sobat ingin seperti itu sobat bisa mengikuti langakah-langkah berikut:
1.Login ke akun Blog Sobat
2.Pilih Rancangan/Tata letak kemudian Pilih "EDIT HTML" Dan jangan lupa untuk centang kolom expand template widget
3.Cari Kode seperti ini

Cara Mengganti Tulisan Poskan Komentar pada kotak Komentar Blog

Pada Tips Blogspot Sebelumnya Saya Sudah Menjelaskan Tentang Bagaimana Cara Menyisipkan Gambar Pada Judul Posting. Dan Pada Trik Blogspot Kali ini saya akan menjelaskan pada Anda Tentang Bagaimana cara mengganti tulisan  Poskan Komentar pada kotak komentar blog.Seperti Kotak Komentar yg saya miliki itu sudah saya rubah tulisan poskan komentar dengan kata-kata saya sendiri,kalau sobat idak percaya,.sobat lihat sendiri kotak komentar saya.
Sobat ingin mengganti Tulisan Poskan Komentar dengan kata kata yg sesuai keinginana sobat sendiri!
Mari Ikuti Langkah Langkah Berikut:

1.Login Ke akun Blog Sobat
2.Pilih Rancangan/Tata Letak--->Edit Html
3.Centang Kolom Expand Template
4.Cari Kode berikut ini

Menghilangkan Garis Bintik-bintik Jejak Link

Pada Tutorial Blog Sebelumnya Blog Sharing Ilmu Pengetahuan , Sudah Menjelaskan Pada Sobat Tentang Bagaimana Cara Memabuat Efek Animasi Blur Otomatis Di Blog.Dan Pada Tutorial Blog Kali Ini Juga Saya Akan Menjelaskan Pada Sobat Semua Tentang Bagaimana Cara Menghilangkan Garis Bintik-bintik Jejak Link. Artikel Ini Bertujuan Agar Jejak Link Pada Blog/Web Yg Berupa Bintik-bintik Dan Juga Border,Menghilang Di Blog/Web Sobat .Dan Artikel Ini Untuk Memperindah Blog Sobat Semua.

Maksud Jejak Link Iyalah Ketika Sobat Mengklik Salah Satu Link Yg Ada Di Blog/Web Menimbulkan Jejak Berupa Bintik-bintik.Contohnya Adalah Di Blog Sobat Yg Belum Di Beri Css Yg Digunakan Untuk Menghilangkan Jejak Bintik-bintik Tersebut, Pasti Akan Menimbulkan Garis Bintik-bintik Seperti Border Dotted.
Cara Menghilangkan Garis Bintik-Bintik Jejak Link,Ialah Dengan Cara Menambahkan Beberapa Css...

Y Udah Sob Saya Akan Memulai Langkah Langkahnya:

Rounded Corner | Membuat Sudut menjadi Tumpul

Pada Tutorial Blog Sebelumnya Blog Sharing Ilmu Pengetahuan Sudah Menjelaskan Pada Sobat Smua Tentang Bagaimana Cara Menghilangkan Garis Bintik-bintik Jejak Link.Dan Pada Tutorial Yg Sama Juga Yaitu Tutorial Blog Saya Akan Menjelaskan Pada Sobat Semua Tentang Bagaimana Cara  Membuat Sudut  Menjadi Tumpul Atau Juga Disebut Rounder Corner.
Tentu Sobat Semua  Pernah melihat di sudut-sudut blog kelihatan tumpul? Nah, itu dinamakan "rounded corner". Sebelum melangkah lebih jauh, kita perlu membatasi ruang lingkup kajian trik blogger kali ini. Rounded corner yang akan kita diskusikan bersama adalah membuat sudut menjadi tumpul tanpa gambar (rounded corner no image).
Kemudian bentukkan rounded corner dari kode CSS ini akan nampak, apabila kamu menggunakan browser Firefox, Chrome, dan Safari. Ngomong-ngomong soal tumpul, asal jangan dikaitkan dengan pikiran, lho. Ayo, kita keroyok Tutorial blogger tentang membuat rounded corner :


Full rounded corner :

Cara Baru Membuat Daftar Isi Jquery Accordion Di Blog

Sebelumnya Blog Sharing Ilmu Pengetahuan Sudah Memberikan Pada Sobat Artikel Tentang 125 Template Keren Untuk Blog Dan Wordpress.Dan Pada Tutorial Blog Kali Ini Saya Akan Menjelaskan Pada Sobat Tentang BagaimanaCara Baru Membuat Daftar Isi Model Jquery Accordion.Mengapa Saya Katakan Cara Baru ? Karna Saya Sudah Memodifikasi Daftar Isi Tersebut..Yg Tadinya Mempunyai Background Berwarna Abu-abu Dan Bacgkround Activenya Berwarna Orange, Dan Sekarang Saya Sudah Memodifikasinya Menjadi background Yg Berwarna Hitam Dan Background Active Yg BerwarnaMerah,Sesuai Dengan Template Saya Ini.Jika Sobat Belum Tau Seperti Apa?Sobat Bisa Melihatnya Disini.Daftar Isi Blog Ini Bertujuan Agar Memudahkan Pengunjung Blog Kita Dengan Mudah Melihat Semua Isi Yg Ada Di BlogSobat,Tanpa Susah Payah Mencarinya.Daftar Isi Ini Saya Dapatkan Dari Abu Farhan,Yg Saat Ini Sudah Saya Pecah
Belah..ahahaahah..kaya piring aja,pecah belah,Maksud Saya Sudah Saya Pisahkan Antara CSS Nya DenganScriptnya.

Agar Dapat Memudahkan Sobat Untuk Mengeditnya Sesuai Dengan Keinginan Sobat.
Bila Sobat Tertarik Dengan Daftar Isi Ini ..Sobat Bisa Mengikuti Sejenak Langkah-Langkah Berikut Ini:

Memasng status Plurk di Blog

Pada Tips Blogspot Sebelumnya saya Sudah Menjelaskan tentang Bagaimana Cara Memasang Nomor urut Pada Kotak Komentar Blog.Dan Pada Tips Blogspot kali ini juga Saya Akan Menjelaskan Pada Sobat Tentang Cara Memasang Status Plurk Di blog.
Plurk.com adalah situs jejaring sosial yang menurut saya itu bagus. Cara kerja plurk dipertimbangkan hampir sama dengan situs jejaring sosial lainnya yaitu twitter.com yang saling share dengan cepat. Plurk (plurk) dan Twitter (Tweet), akan tetapi plurk lebih unggul sedikit sebab plurk mempunyai fasilitas Chatting room. Disamping fasilitas chatting, ada juga fasilitas lainnya antara lain dapat membagi status plurk sobat kemana saja dengan sebuah Script. Misalkan sobat mau meletakan di sidebar blog.
Berikut Langkah-Langkah untuk mendapatkan Script tersebut kedalam blog.

Buku tamu Otomatis

Pada Tutorial Blog Sebelumnya Saya Sudah Menjelasakan Tentang Bagaimana Cara Memasang Status Plurk di Blog.Dan Pada Tutorial Blog Kali ini Saya Akan Menjelaskan Pada Sobat Tentang Cara Membuat Buku Tamu Blog Tanpa Di Klik Terbuka.
Seperti Buku Tamu Blog Yg Ada Di Sharing ILmu Pengetahuan Tanpa Perlu Di Klik Terbuka..? Bila Sobat Ingin Buku Tamu Yg Seperti Itu Sobat Bisa Mengkuti Langkah-Langkah Berikut.

1. Login Ke Akun Blog Sobat
2. Pilih Rancangan/Tata Letak 
3. Tambah Gadget/Add Gadget Pilih HTML JAVA SCRIPT
4. Masukan Script Berikut Di dalamnya

<style type="text/css">
#gb{
position:fixed;
top:20px;
z-index:+1000;
}* html #gb{position:relative;}

.gbtab{
height:150px;
width:50px;
float:left;
background:url('http://i1042.photobucket.com/albums/b429/Farix_2010/Chatting.png') no-repeat;
}

.gbcontent {
float:left;
border:1px solid #BB0000;
-moz-border-radius-bottomleft:10px;
-webkit-border-radius-bottomleft:10px;
-o-border-radius-bottomleft:10px;
-khtml-border-radius-bottomleft:10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-topleft: 10px;
background: #000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhRcSQdNGARilLAhXJQF8PlbZBup-zLkN5ISJhyIr3QSL2y67uL7-xcn_pULxkBToVceMcWgAG9byAX7jFBbvNRaIfmZqrz7Na6V-ii1wrvng8LdoTq_r0VZ8swZ4E-u6VQFUmMdN2SlHHH/s1600/api.gif) no-repeat bottom;
padding:10px;
}

</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 51-w) : moveGB(30-w, 0);
gb.opened = !gb.opened;
}function moveGB(x0, xf){

var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 25 ? 25 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 5);}
}</script>

<div id="gb">
<div class="gbtab" onmouseover="showHideGB()"> </div>

<div class="gbcontent">
<center>
Letakan Script Buku tamu sobat Disini
<br />
<div style="text-align:center">
<a onclick="showHideGB()" class="tips-fade" title="klik untuk tutup chattingbox">
<center><hr /><img src="http://i1042.photobucket.com/albums/b429/Farix_2010/CloseComment-1.png" /><hr /></center>
</a>

</div>
</center></div>
<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (50-gb.offsetWidth).toString() + "px";
</script></div>

  5. Ubah Kata Letakan Script Buku tamu sobat Disini Dengan Script Buku Tamu Sobat
  6.Simpan Dan Lihat Hasilnya

Cara memasang Efek Salju di blog

Pingin turun salju pada blog anda agar terlihat lebih hidup dan cool (baca: keren)? Baik, maka anda perlu memasang efek salju di blog anda.

Untuk memasang efek salju, caranya sangat mudah:

Cara memasang Toolbar Canggih (Wibiya)

Pada Tutorial Blog Sebelumnya saya Suda Menjelaskan Pada Sobat Tentang Cara Membuat Buku Tamu Blog Tanpa Di Klik Terbuka Dan Pada Tips dan Trik Kali Ini Juga Saya akan Menjelaskan Tentang Cara Memasang Toolbar Canggih Wibiya pada blog.. juga cara membuat toolbar wibiya berada di blogpsot anda Seperti Di blog saya Yg Berjudul Sharing Ilmu Pengetahuan,juga memasang Toolbar Wibiya.tapi Yg Pertama Saya Akan Menjelaskan Apa Yg Dimaksud Toolbar Wibiya Tersebut.
Wibiya - salah satu website yang menyediakan fasilitas free toolbar untuk blog Anda, toolbar dari wibiya ini sangat canggih. Fitur dari toolbar wibiya ini diantaranya : pencarian langsung, who's online, live video, translate, timeline, Bermacam-macam Facebook widget, twitter, youtube, Live chat  dan foto sharing kamu. Hmmm canggih bukan toolbar ini? Untuk demonya silakan lihat blog ini bagian bawah yang melayang, ada tools yang berisi pencarian, who's online, facebook, live chat dll.

Setelah Sobat Mengetahui Tentang Toolbar Wibiya Apakah Sobat Ingin Pasang Ini Di  Blogger Sobat? Nah dibawah ini Ada Langkah-Langkah Cara Pemasangannya:

warna warni saat mouse menyorotnya Dengan Css

Assalamualaikum Wr.Wb .. Pada Tutorial Blog Sebelumnya Blog Sharing Ilmu Pengetahuan sudah Menjelaskan Pada Sobat Semua Tentang Bagaimana cara membuat widget tersembunyi dengan css3.Pada Tutorial Blog Kali ini .. Saya akan Menjelaskan  Pada Sobat Semua Tentang Bagaimana Cara membuat menu warna-warni saat mouse menyorotnya. Nah Maksud dari 'menu warna-warni saat mouse menyorotnya' ialah menu yg Pada Saat Mouse  kita Sorotkan Ke Menu tersebut.., Menu itu akan Berubah-ubah warnanya nah contoh menunya ialah Menu Yg Ada Di Blog ini, Tepatnya dibagian atas blog ini..Menu ini Membuatnya Tidaklah Sulit,Karna Saya Sudah Membuat Menu yg ini yg Simpel Cara Pemasangannya yaitu saobat tinggal menaruhkan kode di bawah <body> saja... Nah Jika Sobat Tertarik Terhadap Menu Tersebut..

Mari Sobat Ikuti Langkah-langkah Berikut.. :

1. Login Ke akun Blogger sobat
2. Pada Dasbor pilih RANCANGAN + EDIT HTML dan jagan lupa untuk mencentang kolom expand template widget
3. Masuka KOde Berikut  Dibawah kode <div id='outer-wrapper'>

<style type='text/css'>#menubar {position: fixed;top:0px;z-index: 1000;background:-moz-linear-gradient(top,#1F2326,#000);background: -webkit-gradient(linear, left top, left bottom, from(#1F2326), to(#000));box-shadow:-2px -2px 8px #FF0000, 2px 2px 20px #FF0000;-moz-box-shadow:-2px -2px 8px #FF0000, 2px 2px 20px #FF0000;-webkit-box-shadow:-2px -2px 8px #FF0000, 2px 2px 20px #FF0000;-moz-border-radius:5px;-webkit-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;width:988px;margin: 0;padding: 0;height:30px;}#menu {width:988px;height:30px;position:relative}#menu ul {padding:0;margin:0;list-style:none;position:absolute;left:0;top:0;width:988px;height:30px;z-index:10}#menu ul li {float:left;padding-bottom:4px}#menu ul li#li1 {padding:0}#menu li a {display:block;text-transform:capitalize;height:20px;float:left;color:#fff;text-decoration:none;line-height:20px;padding:0 10px;font-family:kristen itc;font-size:13px;border-right:1px solid #FF0000;margin:3px 0 0;}#menu li a:hover {color:#ff0000;white-space:nowrap;}#menu li a.current {color:#ffffff;}#menu li a:hover.current {color:#ffffff;}#menu li a:hover b {display:block;width:988px;height:30px;position:absolute;left:0; top:0;z-index:-1;-moz-border-radius:5px;-webkit-border-radius: 5px;-khtml-border-radius: 5px;border-radius: 5px;}#menu li#li1 a:hover b {background: #D11717 -moz-linear-gradient(top,#000,#D11717);background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#D11717));}#menu li#li2 a:hover b {background-image: -moz-repeating-linear-gradient(20deg,rgb(255,0,0),rgb(100,0,0) 50px, rgb(255,0,0) 100px);background: -o-repeating-linear-gradient(20deg,rgb(255,0,0),rgb(100,0,0) 50px, rgb(255,0,0) 100px);background: -webkit-repeating-linear-gradient(20deg,rgb(255,0,0),rgb(100,0,0) 50px, rgb(255,0,0) 100px);}#menu li#li3 a:hover b {background: -moz-linear-gradient(top,#AF0000,#6B0000);background: -webkit-gradient(linear, left top, left bottom, from(#AF0000), to(#6B0000));}#menu li#li4 a:hover b {background: #D11717 -moz-linear-gradient(top,#D11717,#000);background: -webkit-gradient(linear, left top, left bottom, from(#D11717), to(#000));}#menu li#li5 a:hover b {background:-moz-linear-gradient(top,#001C5A,#000);background: -webkit-gradient(linear, left top, left bottom, from(#001C5A), to(#000));}#menu li#li6 a:hover b {background: #244007 -moz-linear-gradient(top,#244007,#000);background: -webkit-gradient(linear, left top, left bottom, from(#244007), to(#000));}#menu li#li7 a:hover b {background: #51A104 -moz-linear-gradient(top,#51A104,#000);background: -webkit-gradient(linear, left top, left bottom, from(#51A104), to(#000));}#menu li#li9 a:hover b {background:-moz-linear-gradient(top,#029BC5,#000);background: -webkit-gradient(linear, left top, left bottom, from(#029BC5), to(#000));}#menu li#li8 a:hover b {background: #40071F -moz-linear-gradient(top,#40071F,#000);background: -webkit-gradient(linear, left top, left bottom, from(#40071F), to(#000));}</style>

<div id='menubar'>
<div id='menu'>
<ul>
<li id='li1'><a href='#'><b/>Home</a></li>
<li id='li2'><a href='#'><b/>About Me</a></li>
<li id='li3'><a href='#' ><b/>Daftar Isi</a></li>
<li id='li4'><a href='#'><b/>Masuk</a></li>
<li id='li8'><a href='#'><b/>Daftar</a></li>
<li id='li5'><a href='#'><b/>My Facebook</a></li>
<li id='li9'><a href='#'><b/>My Twitter</a></li>
<li id='li7'><a href='#'><b/>Kode Warna</a></li>
</ul>
</div>
</div>

   4 .Ubah Tanda # dengan Url yg Sobat inginkan dan Ubah KOde yg Berwarna MERAH dengan Judul Yang Sobat Inginkan
  5 . SIMPAN Dan Lihat Hasilnya.. :D