About Me

Foto Saya
Belajar-Ilmu
Lihat profil lengkapku

Rabu, 28 Desember 2011

Cara Pasang Button Back Page, Home Page, Next Page Di Blogger Versi Terbaru

Kali ini saya akan membahas tentang Cara Pasang Button Back Page, Home Page, Next Page Di Blogger Versi Terbaru. Jadi anda menggunakan Button ini tidak perlu mengedit template karena Button ini menggunakan CSS3 alias java script tapi bukan JS gan kalo pake JS pasti blog anda loadnya akan lambat karena berat. saya telah memodifikasi Button ini yang asalnya harus mengedit template sekarang tinggal di masukan ke java script. Kalo anda penasaran ikuti Langkah-Langkah di bawah ini :
1. Pertama anda harus terlebih dahulu masuk ke blogger anda
2. Kedua klik Rancangan >> Klik Tamba Gadget >> Setelah tambah Gadget anda pilih Java Script.
3. Copy kode di bawah ini dan masukan ke Java Script

<style>
.buttom{
padding: 8px;padding-top:6px; padding-bottom:6px;
margin-right:3px;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-moz-box-shadow:0px 0px 2px rgba(0,0,0,0.4);
-webkit-box-shadow:0px 0px 2px rgba(0,0,0,0.4);
color:rgba(0,0,0,0.9);
text-shadow:1px 1px 0px rgba(255,255,255,0.8);
border:1px solid rgba(0,0,0,0.5);
background: -webkit-gradient(linear, left top, left bottom, from(#f3f3f3), to(#cccccc));
background: -moz-linear-gradient(top, #f3f3f3, #cccccc);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f3f3f3', endColorstr='#cccccc');
color: #940f04;
background-color:#fff;
}

.buttom a, .buttom:hover {
padding: 8px;padding-top:6px; padding-bottom:6px;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-moz-box-shadow:0px 0px 2px rgba(0,0,0,0.4);
-webkit-box-shadow:0px 0px 2px rgba(0,0,0,0.4);
color:rgba(0,0,0,0.9);
text-shadow:1px 1px 0px rgba(255,255,255,0.8);
border:1px solid rgba(0,0,0,0.5);
background: -webkit-gradient(linear, left top, left bottom, from(#cccccc), to(#f3f3f3));
background: -moz-linear-gradient(top, #cccccc, #f3f3f3);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#f3f3f3');
text-decoration: none;
color:#000;
}
</style>

<script type="text/javascript">
<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='yes'>
<b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'>
<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<p><a class='buttom' expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-newer-link&quot;' expr:title='data:newerPageTitle'>&#8592; Back Page</a></p>
</span>
</b:if>

<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<p><a class='buttom' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + &quot;_blog-pager-older-link&quot;' expr:title='data:olderPageTitle'>Next Page &#8594;</a></p>
</span>
</b:if>

<p><a class='buttom' expr:href='data:blog.homepageUrl'>Home Page</a></p>

</div>
</script>
4. Yang terakhir Save. dan lihat hasilnya

Selamat Mencoba dan Semoga Berhasil.
saya menjamin dengan kode CSS3 nih blog anda loadnya akan lebih cepat dan tempilannya di jamin keren.

0 komentar:

New Template

Popular Posts

Blog Archive

 

New Tutorial

Jika anda menyukai blog ini atau menyukai artikel di blog ini silakan anda berlanggan artikel di blog ini:

Delivered by FeedBurner

Subscribe to Belajar-Ilmu by Email

Follow Us With Facebook

Rahasia Master SEO
© 2010 Belajar-Ilmu
Template by : O-Zone Blogger Abstrak