Styling Menu Thesis Ver.2 Rock!

Bagi sebahagian pengguna template thesis for blogspot Thesis Ver.2 Rock!, horizontal menu dapat diberi sedikit gaya dengan merubah menu "Home" menjadi icon "Home". Perubahan ini sebenarnya tidaklah mempengaruhi penampilan dari Template Thesis For Blogspot ini, namun icon yang akan ditampilkan akan terlihat kecil karena ukuran horizontal menu yang tidak besar :D

Begitu juga halnya dengan styling fixed menuhorizontal thesis, mungkin pada browser Firefox dan Chrome akan terlihat indah dan rapi dan pada browser lainnya belum tentu akan tersusun indah.

Akan tetapi jika pengguna setia template thesis ingin merubahnya dan memberikan sedikit sentuhan gaya, Kami akan mempersembahkan tutor sederhana ini.

Home Icon Pada Menu Thesis For Blogspot

Untuk merubah menu Home menjadi icon Home, silahkan ikuti trik ini:
1. Edit template dan expand
2. Cari dengan Ctrl+F kode:

<li><a expr:href='data:blog.homepageUrl' style='border-left:1px solid #cccccc;'>HOME</a></li>

 3. Replace dengan kode:

<li><a expr:href='data:blog.homepageUrl' style='border-left:1px solid #cccccc;'><img title="HOME" alt="HOME" style="width:11px;height:11px;" src="http://2.bp.blogspot.com/-Wa_i_AXZHOo/UCwKF1CzzVI/AAAAAAAAB9c/BMamGLN0o2c/s1600/home-icon-16x16.png"/></a></li>

4. Preview dan jika berhasil, Save perubahan yang telah dilakukan.

Home Icon In Thesis For Blogspot

Fixed Style Menu Thesis For Blogspot

Untuk membuat menu horizontal menjadi fixed style (mengikuti scrolling pada browser), silahkan ikuti trik ini:
1. Edit template dan expand
2. Cari dengan Ctrl+F kode ]]></b:skin>
3. Letakkan kode css ini diatasnya:

.menuhorizontal{position:fixed;top:0;background:#ccc;margin-left:15px;margin-top:-20px;}
.menuhorizontal li a{padding:20px 20px 10px 10px;} 
#head{margin-top:32px;}

4. Preview dan jika berhasil, Save perubahan yang telah dilakukan.

Selamat mencoba :D

{ 8 comments.. read them below or add one }

ayam kampung ayam kampung 18 August 2012 at 21:08
salam kenal pa cie, macam mana buat footer mesra seo. Di versi 2 rock tidak ditemukan. Mohon cek lah
MUS LIM MUS LIM 20 August 2012 at 15:28
Untuk template thesisforblogger V2 ini memang tidak disertakan widget pada footer-nya, Pak. Template ini didesain agar mirip seperti template thesis pada Wordpress.

Walau tidak ada widget footer, dijamin template ini bagus untuk dijadikan template blog/website bisnis Ayam Kampung yang Bapak kelola.
Anonymous Anonymous 23 August 2012 at 23:33
Mcm mana nak pindahkan share button di bawah post tu ke bahagian atas selepas Post title.?
MUS LIM MUS LIM 28 August 2012 at 21:27
Apa alasan saudara sehingga nak memindahkan share button tu? heheheh ... :)

caranya mudah saja:

temukan kode ini:
< div style='height:15px; border-top:1px solid #ccc; padding:15px 0px 0px 0px;margin:10px 0 0px 0;'>
< g:plusone size='medium'/>
< div style='float:right;'>
< span class='st_google_hcount' displayText='Google'/>< span class='st_linkedin_hcount' displayText='LinkedIn'/>< span class='st_facebook_hcount' displayText='Facebook'/>< span class='st_sharethis_hcount' displayText='ShareThis'/>< /div>< /div>

cut kemudian paste tepat diatas < data:post.body/>
Mentari Minda Mentari Minda 13 January 2013 at 17:03
letak icon HOME yg baru.......baru nampak hensem :)
syazrin syazrin 30 January 2013 at 15:05
menarik tp sy dh buang tab menu dkt atas tue, hehehehee

Spamming will report.