how to make "Top Tap" on Blogspot?

Posted: May 21, 2009 in Blog Trick and Wiget
*Makesure back up blog anda.

Sedikit Tutorial macamana nak buat Top Tap di Blogspot , kalau wordpress memang dah ada function Top Tap…. 1st Pastikan anda buat back up pada blog anda .. bungai pengrindu xtanggung kalau wiget di blog anda hilang..

  • Pertama masuk halaman Edit HTML, kemudian copy-paste semua kode CSS dibawah ini lalu letakan diatas kode ]]></b:skin>

/*– (Menu/Nav) –*/
#nav{background:#222; height:32px; padding:4px 0 0; margin-bottom:0px}
#nav-left{float:left; display:inline; width:600px}
#nav-right{float:right; display:inline; width:100px}
#nav ul{position:relative; overflow:hidden; padding-left:0px; margin:0; font:1.0em Arial,Helvetica,sans-serif}
#nav ul li{float:left; list-style:none}
#nav ul li a, #nav ul li a:visited{display:block; color:#fff; margin:0 5px; padding:5px 4px; text-decoration:none}
#nav ul li a:hover{color:#800000; background-color:#fff; margin:0 5px; padding:5px 4px}
#nav ul li a.current, #nav ul li a.current:visited, #nav ul li a.current:hover{margin:0 8px; background-color:#fff; color:#fff; padding:5px 7px}

/*– (Search) –*/
#search{background:#f9f9f9 url(http://oom.blog.googlepages.com/search.gif) 6px 2px no-repeat; -moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px; border:1px solid #b3b3b3; float:right; height:25px; margin:0 0px 0 0; width:180px}
* html #search{margin-right:8px}
#search input{font-family:Verdana,Arial,Helvetica,sans-serif; background:transparent; border:0; color:#555; float:left; font-size:12px; margin:5px 0 0; padding:0px 2px 2px 27px; width:140px}

  • Masih pada halaman Edit HTML kemudian cari kode <div id=’outer-wrapper’><div id=’wrap2′> biasanya kode ini terletak di bawah html tag <body> kemudian copy-paste semua kode dibawah ini, dan letakan kodenya dibawah kode diatas.

<div id=’nav’>
<b:section class=’header-tabs’ id=’header-tabs’ preferred=’yes’ showaddelement=’no’>
<b:widget id=’LinkList1′ locked=’true’ title=’Top Tabs’ type=’LinkList’>
<b:includable id=’main’>
<div class=’widget-content’>
<b:if cond=’data:title’/>
<div id=’nav-left’>
<ul>
<li><a href=’/’>Home</a></li>
<b:loop values=’data:links’ var=’link’>
<li><a expr:href=’data:link.target’><data:link.name/></a></li>
</b:loop>
</ul>
</div>
</div>
</b:includable>
</b:widget>
<b:widget id=’HTML3′ locked=’true’ title=’Search’ type=’HTML’>
<b:includable id=’main’>
<div id=’nav-right’>
<form expr:action=’data:blog.homepageUrl + &quot;search&quot;’ id=’searchform’ method=’get’ name=’searchform’>
<b:if cond=’data:title’/>
<div id=’search’>
<input class=’s’ id=’s’ name=’q’ onblur=’if (this.value == &apos;&apos;) {this.value = &apos;Cari artikel disini&apos;;}’ onfocus=’if (this.value == &apos;Cari artikel disini&apos;) {this.value = &apos;&apos;;}’ type=’text’ value=’Cari artikel disini’/>
<input id=’searchsubmit’ type=’hidden’ value=’Search’/>
<data:content/>
</div>
</form>
</div>
</b:includable>
</b:widget>
</b:section>
</div>

Dan Save or Preview dahulu .

*Makesure back up blog anda.

Mr J telah mencubanya sediri ternyata Top Tap berhasil .. jika Bp dapat anda pun dapat..

Salam ceria selalu dari,
Mr. J
www.pengeRindu.com
Subscribe untuk mendapatkan 10 ebook Percuma.

Ingin artikel anda disiarkan sini? senang sahaja Emailkan” sahaja kepada kami.


Didn’t understand in Malay Language? just switch it on your language here.

Bookmark and Share

pengeRindu Fan Club

Dapatkan Artikel terbaru dan 10 ebook Percuma daripada www.pengeRindu.com serta artikel terbaru terus ke email anda. Sila masukkan email anda dibawah:

Penghantaran ditaja oleh FeedBurner

Program SMS Prepaid Terunggul Dari MYeCASH

Add to Google Reader or HomepageSubscribe in NewsGator OnlineAdd to My AOLAdd to netvibesSubscribe in BloglinesAdd to The Free DictionaryAdd to PlusmoSubscribe in NewsAlloyAdd to Excite MIXAdd to netomat HubAdd to fwickiAdd to WebwagAdd to Pageflakes

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s