Modifikasi Template Blogspot | Personalisasi Footer Template TheGreyMac Blogger

Salah satu "keasyikan" dari template blogspot adalah kebebasan kita untuk melakukan modifikasi sesuai dengan keinginan dan selera kita sendiri. Seperti pada post kali ini yang personalisasi template TheGreyMac Lasanta Barbara yang default-nya memiliki tiga kolom pada footer. Bagaimana jika ingin dijadikan satu kolom?

Konsep ini sebenarnya sama dengan post sebelumnya yaitu modifikasi footer template Grunge dari sobat Ashtho. Dan post kali ini juga semoga bisa menjawab pertanyaan dari Sobat Blogger Pak Karnadi..

Konsep modifikasi selalu dilakukan dengan dua cara:

• Pengaturan pada elemen CSS
• Pengaturan pada <div>

Dan untuk mengubah footer template TheGreyMac menjadi satu kolom adalah:

• Pengaturan pada elemen css,

#footer{height:325px}
#bottombar{height:265px;width:1000px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-gllO0LBddK4rseO1UENQBDPXWqCL_xJCWFGSfo0e5pMaCn2t3NIwmYKOVYfiAYKhXHFTZ5bRcR2yht6M_K-vAGDASy1Wt1mc_gWvu0etoTIx99lo7AxxjAGmABsOV_jY5iYRT3fUSNLp/s1600/bottom-bg.png) no-repeat top left;margin:0 auto}
#about-wrap{float:left;width:310px;height:225px;margin:15px 0 0 40px}

#share-wrap{float:left;display:inline;height:225px;width:335px;margin-top:15px;}

#bottom-ads{width:240px;display:inline;float:left;margin-top:15px;}

Hapus kode berwarna merah dan rubah kode berwarna hijau sesuai dengan lebar footer [sekitar 920-an pixel]

• Pengaturan pada <div>,

Hapus elemen <div> berikut ini;

<div id='share-wrap' style='margin-left:10px;'>
<b:section class='footercol' id='footerleft2' preferred='yes'/>
<div class='clear'/>
</div>

<div id='bottom-ads' style='margin-left:10px;'>
<b:section class='footercol' id='footerleft3' preferred='yes'/>
</div>
<div class='clear'/>

Demikian moga bermanfaat...dan ditunggu diskusinya kolom komentar untuk berbagi..

Happy blogging!

Read more »

MODIFIKASI FOOTER TEMPLATE GRUNGE

Post kali ini adalah untuk menjawab pertanyaan dari Sobat Ashtho tentang footer template-nya [Grunge template] yang ingin dijadikan satu untuk menempatkan iklan. Dalam hal ini, kita tidak perlu menggunakan script apapun untuk merubahnya, yang diperlukan hanya sedikit modifikasi pada CSS template grunge tersebut.

Berikut langkah-langkahnya:
Masuk kehalaman HTML template kamu. Tidak perlu di expand widget dan selalu backup template kamu sebelum melakukan pengeditan, sekedar untuk jaga-jaga jika gagal.

Selanjutnya cari kode yang terseleksi seperti yang ditunjukkan oleh screenshoot di bawah ini. Jika sudah ketemu , hapus kode tersebut.

Kemudian scrol-down dan hapus juga kode terseleksi seperti pada gambar dibawah.

Kembali keatas lagi dan temukan kode yang tersisa pada footer seperti dibawah ini:

#footer2 {

clear: both;

float:left;

width: 305px;

margin-right: 10px;

text-align: center;

border:;

}

Agar lebar footer sejajar dengan halaman blog, maka lebar footer juga harus sama dengan halaman blog. Rubah width menjadi width: 950px;. Jika sudah selesai, simpan template kamu.

Demikian, moga berhasil dan bermanfaat!

Read more »