Cara Membuat / Meletakan Footer di Sisi Kanan atau Kiri Blog

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

bismillaahirrahmaanirrahiim

السَّلاَمُ عَلَيْكُمْ وَرَحْمَةُ اللهِ وَبَرَكَاتُهُ

Assalamu'alaikum warahmatullahi wabarakatuh

Cara Membuat / Meletakan Footer di Sisi Kanan / Kiri Blog - Beberapa hari ini serasa dilema bro!!!  Semangat memposting artikel yang sebelum membara di awal tahun 2012 kini mulai luntur, entah apa yang membuat saya sampai se jenuh ini. Namun hal tersebut coba saya siasati dengan sesuatu ( rahasia ).
setelah sebelumnya memposting artikel tentang Cara Mengetahui Blog Dofollow atau Nofollow, kali ini saya akan coba memposting artikel yang sedikit aneh, yaitu membuat atau meletakkan footer di sisi blog entah itu di sebelah kanan blog, sebelah kiri blog, ataupun tengah. namun khusus pada tutorial ini kita hanya akan membahas tentang cara membuat footer berada di sisi kiri blog atau bisa di bilang sidebar ke duanya. hehehe.

Postingan aneh dengan judul yang aneh pula ini saya posting dengan harapan bisa mengobati rasa bosen ngeblog. sobat yang tertarik untuk ber eksperimen dengan trik ku ini, silahkan ikuti tutorial berikut.

DEMO

1. Log in ke akun blog sobat.
2. Klik Rancangan --> Edit HTML
3. Cari kode yang mirip dengan kode berikut.

#outer-wrapper {
  width: 950px;
  padding:10px;
  text-align:$startSide;
  font: $bodyfont;
  }

4. ganti kode tersebut dengan kode berikut.

#outer-wrapper {
  width: 950px;
margin-left:350px;
  padding:10px;
  text-align:$startSide;
  font: $bodyfont;
  }

( kode di atas hanya ada tambahan pada margin, karena kita membutuhkan space untuk meletakkan footernya.)

5. Ganti  kode footer-wrapper template sobat dengan kode berikut.

/* footer */
#footer {
clear:both;
width:950px;
position:relative;
text-align:left;
color:#000000;
font-family:julee;
background:#252525;
border:1px solid #000000;
margin:0 auto;
padding:0;
}

#footer {
width:300px;
clear:both;
float:center;
line-height:1.6em;
margin:0 auto;
padding:0;
}

.footer-bot {
padding:0px;
}

.footer-bot ul {
color:#222;
margin:0;
padding:0;
}

.footer-bot ul li {
list-style-type:none;
background:;
padding-left:15px;
margin-bottom:8px;
}

.footer-bot a {
color:#222;
text-decoration:none;
}

.footer-bot a:hover {
border-bottom:1px solid #222;
color:#000;
}

#footer-right {
width:250px;
float:left;
padding:5px;
margin-left:15px;
margin-bottom:10px;
background:#ffffff;
border:1px solid #222;
}
#footer-center {
width:250px;
margin-bottom:10px;
float:left;
margin-left:15px;
padding:5px;
background:#ffffff;
border:1px solid #222;
}
#footer-left {
width:250px;
background:#ffffff;
margin-bottom:10px;
padding:5px;
margin-left:15px;
margin-top:10px;
float:left;
border:1px solid #222;
}

6. Kemudian letakkan kode berikut di atas kode ]]></b:skin>.

#trik_tatelu {
position:fixed;_position:absolute;top:0px; background:#000000; left:px;  width:320px;
border:1px solid #000000; height:585px;;overflow:auto;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

7. Letakkan kode berikut di atas kode </body>

<div id='trik_tatelu'>
<div style='font-size:30px;font-family:Felipa;color:#ffffff;'>
<h3><blink>Hai!!!!</blink></h3>
</div>
<div id='footer'>
<div id='foot'>
<b:section class='footer-bot' id='footer-left'>
</b:section>
<b:section class='footer-bot' id='footer-center'>
</b:section>
<b:section class='footer-bot' id='footer-right'>
</b:section>

</div><div style='clear:both'/>
</div>
</div>

8. Klik save.

Perhatian!

1. Sebelum sobat menggunakan trik ini, ada baiknya download terlebih dahulu template blog sobat.
2. Cara ini di anjurkan pada template dengan lebar yang sesuai dengan outer wrapper 950px, untuk lebar kurang dari atau lebih dari 950px, sobat perlu ketelitian dan pengetahuan tentang html. ( bukan newbie ).
3. Trik ini akan menggeser posisi outer wrapper blog sobat.
4. Trik ini saya coba pada template minima yang telah di hilangkan sidebarnya.
5. Mohon sobat atur sebaik mungkin jika setelah jadi hasilnya kurang bagus atau kurang cocok.
6. Semoga cara membuat footer berada di sisi kanan atau kiri blog bisa membantu sobat blogger.

Update Contact :
No Wa/Telepon (puat) : 085267792168
No Wa/Telepon (fajar) : 085369237896
Email : Fajarudinsidik@gmail.com NB :: Bila Sobat tertarik Ingin membuat software, membeli software, membeli source code, membeli hardware elektronika untuk kepentingan Perusahaan maupun Tugas Akhir (TA/SKRIPSI), Insyaallah Saya siap membantu, untuk Respon Cepat dapat menghubungi kami, melalui :

No Wa/Telepon (puat) : 085267792168
No Wa/Telepon (fajar) : 085369237896
Email: Fajarudinsidik@gmail.com

atau Kirimkan Private messanger melalui email dengan klik tombol order dibawah ini :

ٱلْحَمْدُ لِلَّهِ رَبِّ ٱلْعَٰلَمِين

Alhamdulilah hirobil alamin

وَ السَّلاَمُ عَلَيْكُمْ وَرَحْمَةُ اللهِ وَبَرَكَاتُهُ

wassalamualaikum warahmatullahi wabarakatuh

Artikel Cara Membuat / Meletakan Footer di Sisi Kanan atau Kiri Blog, Diterbitkan oleh scodeaplikasi pada Senin, 13 Februari 2012. Semoga artikel ini dapat menambah wawasan Anda. Website ini dipost dari beberapa sumber, bisa cek disini sumber, Sobat diperbolehkan mengcopy paste / menyebar luaskan artikel ini, karena segala yang dipost di public adalah milik public. Bila Sobat tertarik Ingin membuat software, membeli software, membeli source code ,Dengan Cara menghubungi saya Ke Email: Fajarudinsidik@gmail.com, atau No Hp/WA : (fajar) : 085369237896, (puat) : 085267792168.