Membuat Page Navigation Berbeda

Text Resizer: Click for Resizer

Alhamdulillah... Akhirnya Selsai juga tugas-tugasku.. Setelah beberapa hari ini capek banget mengerjakan tugas.. hehehe.. Cape n jadi lupa posting dech sama jalan-jalan keblog sobat... Yufs.. Mulai blogging lagi, oh ya kali ini aku akan share ilmu kepada sobat tentang membuat page navigation berbeda setelah sebelumnya membahas tentang Membuat Page Number Navigasi Halaman. Kali ini kita membahas page navigation lagi. Tapi untuk page navigation yang kita bahas ini sedikit berbeda dengan page navigation sebelumnya. untuk contohnya bisa sobat lihat pada gambar dibawah ini.

Bagaimana sobat tertarik??? Untuk membuatnya caranya cukup simple koq,hanya saja sobat mengikuti langkah-langkah dibawah ini dengan teliti. insya allah tutorial ini akan berhasil.

Untuk membuatnya ikuti langkah-langkah dibawah ini.

• Seperti biasa. Login dahulu ke akun blogger sobat.

• Setelah itu klik Tata Letak - Edit HTML dan centang kotak Expand Template Widget.

• Jangan lupa untuk klik Download Template Lengkap untuk jaga-jaga.

• Kalau sudah, cari kode <b:include name='nextprev'/> lalu ganti dengan kode berikut:

<b:if cond='data:blog.pageType == "index"'>
<style type="text/css">
.blogpager {
font-size:16px;
color: #060;
font-weight:bold;
padding:0px 4px;
}
</style>

<div align="center" style="margin:5px;">
<form action="#" name="pager20">
<span id="vwg-pager-first"></span> <span id="vwg-pager-prev"></span> <input name="showingpage" onfocus="this.select()" value="init..." type="text" size="4" title="Enter page number that You want to go" />/<input size="4" type="text" name="pagestotal" disabled="disabled" value="init..." /> <input type="button" onclick="checkpager()" value="Go" /> <span id="vwg-pager-next"></span> <span id="vwg-pager-last"></span>
</form>
</div>
<script type="text/javascript">

var blogID = "IDblogsobat";
var home_page = "http://namablogsobat.blogspot.com/";
var pager_max_main = 1;

var pager_first_text = "First";
var pager_last_text = "Last";
var pager_prev_text = "Prev";
var pager_next_text = "Next";


</script>
<script src="http://www.freewebs.com/anhvo/blogger/blogger_pager_script_v20.js"
type="text/javascript"></script>
</b:if>

• Selanjunya ganti kode yang berwarna merah dengan id blog sobat. Untuk melihat id blog sobat silahkan lihat pada adress pada browser seperti pada gambar dibawah.

• Ganti http://namablogsobat.blogspot.com/ Dengan URL Blog Sobat

• Ganti ukuran huruf  dan backround  sesuaikan dengan template anda. Untuk kode warna bisa dilihat disini 

• Langkah terakhir Simpan Template

Semoga berhasil......

Artikel Terkait:

Blogger Trick

• Cara Membuat Tab View Blog
• Cara Membuat Form Kontak Saya (Contact Me Form)
• Memperpanjang Domain .CO.CC Dengan Gratis
• Mengubah Domain Blogspot menjadi .CO.CC
• Modifikasi Tampilan Pencarian Judul Posting Blog
• Hasil Pencarian Hanya Menampilkan Judul Posting
• Auto Read More Untuk Blogger
• Cara Membuat Page Number Navigasi Halaman
• Memasang Sharing is Sexy di Blog

Ditulis oleh : Arga Anggriawan | BLOG : This Is My Art
Dalam Judul : Membuat Page Navigation Berbeda
Dalam Kategori : Blogger Trick
Saya hanyalah blogger pemula yang ingin belajar dan berbagi dengan sahabat, Semua artikel blog ini bersumber dari pengalaman saya dari dunia blogger.