Cara Menyembunyikan Footer Pada Blog

Mendesain template blog sama halnya dengan mendesain sebuah rumah. Baik buruknya tampilan rumah dan template blog tergantung pada cita rasa seni dan selera kita masing-masing. Ada arsitek yang beranggapan rumah dengan eksterior minimalis itu bagus. Tetapi, ada juga yang tidak sependapat dan cenderung lebih suka dengan gaya modern.

Begitu juga dengan template blog. Ada blogger yang suka dengan tampilan footer pada templatenya, tetapi ada juga yang tidak suka dengan tampilan footer. Footer merupakan elemen dari sebuah template blog yang letaknya di bagian paling bawah. Biasanya terdiri dari satu, dua, tiga, hingga empat kolom.

Nah, bagi kita yang tidak suka adanya tampilan footer padahal blog kita saat ini ada tampilan footernya, kita dapat menghilangkannya dengan cara penambahan sedikit kode HTML pada edit HTML template kita.

Cara untuk menyembunyikan footer pada blog milik kita dapat kita lihat sebagai berikut:

Pertama, masuk ke dalam akun blogger kita masing-masing.
Klik rancangan.
Klik edit HTML.
Klik/centang expand template widget.
Cari kode berikut.

]]></b:skin>

Setelah itu, tambahkan kode ini tepat di atasnya.

.footer-outer{display:none;}

Klik simpan dan selesai.

Keterangan:

1. Tekan tombol Ctrl+F pada keyboard untuk mempermudah pencarian kode HTML yang kita inginkan.
2. Download template blog terlebih dahulu sebagai backup apabila kita mengalami kegagalan saat proses editing berlangsung.
3. Cara ini tidak menghapus kolom pada footer, tetapi menyembunyikan tampilannya pada halaman blog.

Penyebab tidak disukainya adanya tampilan kolom footer pada blog kita ada beragam. Mungkin bisa disebabkan karena selera individu itu sendiri, tampilan footer yang tidak sinkron dengan template secara keseluruhan, footer tidak lagi dibutuhkan karena semua pernak-pernik blog yang digunakan sudah ditampung dalam sidebar, dan alasan lainnya.

Sebenarnya tanpa menghapus kolom footer itu sendiri juga footer tidak akan muncul pada tampilan desain blog saat dibuka di browser asal kita tidak menempatkan widget dalam footer tersebut. Akan tetapi, kadang juga ada template yang masih meninggalkan frame dari footer meskipun sebenarnya footer tersebut tidak diisi oleh widget sama sekali.

Read more »

Membuat Menu di Bawah Header pada Blogspot

Salam Blogger, kali ini saya akan membahas bagai mana cara memasang menu di bawah header dan berikut adalah langkah-langkahnya.
1. Login di blogger dengan ID blog sobat
2. Klik menu Layout
3. Klik Tab Edit HTML
Selanjutnya Anda cari kode dibawah ini, untuk mempermudah pencarian silahkan gunakan CTRL+F 

<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol' showaddelement='no'>
<b:widget id='HTML1' locked='false' title='' type='HTML'/>
</b:section>
</div>

Anda ubah kode showaddelement='no' menjadi  showaddelement='yes' , kalau sudah klik simpan ya
Setelah yang pertama sudah disimpan, sekarang klik Page elements / Elemen Laman> Tambah Gadget > HTML/Javascript , copy kode dibawah ini,simpan dan letakan tepat dibawah header. 

<a href="http://madhigokil.blogspot.com " class="navigation">HOME</a>
<a href="http://madhigokil.blogspot.com " class="navigation">CONTACT</a>
<a href="http://madhigokil.blogspot.com " class="navigation">BUKU TAMU</a>
<a href="http://madhigokil.blogspot.com " class="navigation">FACEBOOK</a>
<a href="http://madhigokil.blogspot.com " class="navigation">TWITER</a>
<a href="http://madhigokil.blogspot.com " class="navigation">DOWNLOAD</a>
<a href="http://madhigokil.blogspot.com " class="navigation">LAIN-LAIN</a>
<a href="http://madhigokil.blogspot.com " class="navigation">CHATTING</a>

*Alamat url diatas silahkan sesuaikan dengan blog Anda.


Hal ketiga adalah supaya menu itu menimbulkan efek warna sehingga menjadi kelihatan menarik.

Klik Tata Letak > Edit HTML , cari kode </b:skin> , agar mudah gunakan tombolCTRL+F
Copy kode dibawah ini dan letakan tepat diatas kode  </b:skin> kemudian simpan.

a.navigation {
background: #3333ff ;
color: #ffffff;
margin: 1px;
padding: 2px;
border-width: 0;
text-transform: uppercase;
text-decoration: none;
font-weight: bold;
}
a.navigation:hover {
background: #333333;
color: #ffffff;
text-decoration: none;
}

Perhatikan kode yang berwarna biru adalah warna tombol dan efek hover dan bisa dirubah sesuka hati Anda.Dan yang berwarna merah adalah jarak antara tombol satu dengan lainnya, silahkan Anda sesuaikan sesuai selera.

mudah bukan, selamat mencoba...
Sumber....http://www.madhi.web.id

Read more »

Cara Memasang Iklan Melayang-Layang di Blog (Blogspot)

Oke sobat, langsung ke TKP aja ya...

1. Masuk ke blogger

2. Buka design/Rancangan

3. Pada Page Element, pilih tempat, lalu klik "Add A Gadget" dan pilih HTML Javascript

4. Masukkan kode berikut,

<style type="text/css">

#gb{

position:fixed;

top:10px;

z-index:+1000;

}

* html #gb{position:relative;}

.gbcontent{

float:right;

border:2px solid #ffffff;

background:#ffffff;

padding:10px;

}

</style>

<script type="text/javascript">

function showHideGB(){

var gb = document.getElementById("gb");

var w = gb.offsetWidth;

gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);

gb.opened = !gb.opened;

}

function moveGB(x0, xf){

var gb = document.getElementById("gb");

var dx = Math.abs(x0-xf) > 10 ? 5 : 1;

var dir = xf>x0 ? 1 : -1;

var x = x0 + dx * dir-100;

gb.style.top = x.toString() + "px";

if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}

}

</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">

<div style="text-align:right">

<a href="javascript:showHideGB()">

klik salah satu iklan untuk keluar.:[Close][Klik 1x]:.

</a>

</div>

<center>

Masukan Kode iklan Text ataupun banner sobat disini

</center>

<div style="text-align:right">

<a href="http://bunli.blogpspot.com">

</a>

</div>

<script type="text/javascript">

var gb = document.getElementById("gb");

gb.style.center = (20-gb.offsetWidth).toString() + "px";

</script></div></div>

Ganti tulisan berwarna biru dengan kode iklan sobat.

5. Setelah itu klik save/simpan dan lihat hasilnya.
selesai, mudah bukan.. semoga bermanfaat.

Sumber...http://www.madhi.web.id

Read more »

Cara Mudah Pasang Metarobot Pada blog

Oke sobat, kali ini saya akan membahas tentang metarobot, mau tau gimana cara pasang metarobot di blog? caranya sangat mudah kok. hehe

Meta adalah elemen atau tag dalam bahasa pemrograman HTML atau XHTML yang dipakai untuk mengaplikasikan metadata  dalam suatu halaman web dan biasanya diletakan pada bagian antara <head> dan </head>. Tag meta ini dapat dipakai juga untuk menyatakan deskripsi/keterangan dari suatu halaman web dan untuk menjelaskan mengenai kata kunci (keyword) yang terkait pada blog.

Berikut langkah-langkahnya:

Cara pemasangan :

1. Login Blogger, masuk ke Layout / Tata Letak

2. Klik Edit HTML, beri chek pada Expand Template Widget

3. Copy kode dibawah dan letakan tepat dibawah kode <head>

4. Simpan Template

<meta content='isi dengan deskripsi blog Anda' name='description'/> 

<meta content='isi keyword sesuai dengan materi blog' name='keywords'/> 

<meta content='INDEX,FOLLOW, all' name='robots'/>

<meta content='index, follow' name='googlebot'/>                                              

<meta content='nama anda ' name='author'/>

Mudah kan? semoga bermanfaat..

Sumber......http://www.madhi.web.id

Read more »