Membahagi footer kepada 3 bahagian

Seperti mana yang diketahui kebanyakan template untuk blog mempunyai hanya satu columns pada  footer.Ia menyebabkan kita tidak boleh meletakkan lebih widgets pada ruangan tersebut.Dengan membuat ruangan footer kepada tiga bahagian,maka lebih  banyak widgets seperti Recent Posts, Recent Comments,Archives dan iklan dapat dimasukkan.Membuat footer sebegini pada blogspot adalah amat mudah dengan hanya mengikuti langkah dibawah ini:

Nota:sebelum anda mengedit template adalah disarankan supaya membuat salinan template terlebih dahulu dengan mengklik Download Full Template pada halaman Layout--- Edit HTML
Pindahkan widget yang ada pada footer pada mana mana side bar atau bahagian yang lain.

1.Pada Design pilih edit HTML
2.cari kod berikut

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

(Nota:pada sesetengah template selain dari footer-wrapper anda mungkin jumpa footer  atau footer-section)


1.Tukarkan kesemua bermula dari  <div> ke </div> dengan kod berikut:

<div id='footer'>
<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
<p>
<hr align='center' color='#5d5d54' width='90%'/></p>
<div id='footer-bottom' style='text-align: center; padding: 10px;'>
<b:section class='footer' id='col-bottom' preferred='yes'>
</b:section>
</div>
<div style='clear:both;'/>
</div>

2.Kemudian save template anda.

Catat Ulasan

14 Comments:

uchiha berkata...
Teknik Buat Blog

boleh jg info'y...
akn saya cobaa... hehee :D

~~su manje~~~ berkata...
Teknik Buat Blog

mampir sahabat

..:akyn:.. berkata...
Teknik Buat Blog

kenapa xjmpe kod uh??

yahaya berkata...
Teknik Buat Blog

@..:akyn:..ada satu baris pada bahagian bawah template.gantikan dan preview terlebih dahulu sebelum save

cikPuanRAihah berkata...
Teknik Buat Blog

xbole

||aLeaSaRa|| berkata...
Teknik Buat Blog

salam..bro.tq kite dh bjaya buat 3 footer tp mcm mn kite nk cantikkan biar semua banner,terletak cantik dlm kotak mcm bro buat ni?skrg banner contest/award bersepah.ada banner tu tak da kod html susah kite nk adjust weight/height utk bg sama saiz.

yahaya berkata...
Teknik Buat Blog

@||aLeaSaRa||tgk tutorial cara susun imej pada sidebar

cikpuanhady berkata...
Teknik Buat Blog

tak berjayalah buat..nape yer? tak error tapi tak keluar apa2..bila drag bloglist ke, bloglist tu tak stay kat situ..

pls help..

Jom skodeng :Ada blog lebih dari satu?

:: Zanna :: berkata...
Teknik Buat Blog

tq~~ berjaya apply dlm blog.. ^.^

deqlis berkata...
Teknik Buat Blog

salam, deqlis nk buat utk blog deqlis tp tak jadi lah...cari wording footer-wrapper pun tak jumpa nie... hrp leh bantu

teng

alamindawa berkata...
Teknik Buat Blog

nice post, i try it now.........!

Elina berkata...
Teknik Buat Blog

salam,
macam mana lak nak tukar 3 colunm kepada 2 column je ? boleh tolong tak ? lg 1, my blog ada double blog post le. x caye cuba scroll bawah .. camne nak delete ??

yahaya berkata...
Teknik Buat Blog

@Elina
2 footer cuba guna template designer..pergi ke design--template designer--layout--footer..
masalah double posting ni ada tutorialnya..cari artikle masaalah double posting..

kinvanburton berkata...
Teknik Buat Blog

gan,mau nanya nich...
blog saya kok ada scrollnya di bawah halaman browser,
apa penyebabnya ya??
mohon petunjuk dan pencerahannya ya gan...
by:
http://kinvanburton.blogspot.com/