cara ini saya dapatkan dari sebuah blog atau web abu farhan, ya caranya tidaklah terlalu rumit dan hasilnya pun tidak jelek, ya fungsi dari widget ini adalah untuk membantu seorang pengunjung untuk lebih mempermudah seorang pengunjung untuk melakukan browsing terhadap blog anda selain itu juga bisa plus untuk mempercantik tampilan blog anda ya langsung saja deh daripada ngebaca ocehan saya yang ga bermutu langsung saja ke artikel mengenai Cara membuat page navigation number pada blog
masuk ke bagian edit html template anda kemudian cari kode berikut
]]></b:skin> ( agar lebih mudah gunakan ctrl + f atau f3 )
kemudian sisipkan kode di bawah ini tepat di atas kode ]]></b:skin>
</body>
sisipkan kode dibawah ini tepat di atas kode </body>
simpan dan lihat hasilnya :D semoga bermanfaat
.paginator { margin-top:60px; font-size:1em; } .paginator table { border-collapse:collapse; table-layout:fixed; width:100%; } .paginator table td { padding:0; white-space:nowrap; text-align:center; } .paginator span { display:block; padding:3px 0; color:#fff; } .paginator span strong, .paginator span a { padding:2px 6px; } .paginator span strong { background:#ff6c24; font-style:normal; font-weight:normal; } .paginator .scroll_bar { width:100%; height:20px; position:relative; margin-top:10px; } .paginator .scroll_trough { width:100%; height:3px; background:#ccc; overflow:hidden; } .paginator .scroll_thumb { position:absolute; z-index:2; width:0; height:3px; top:0; left:0; font-size:1px; background:#363636; } .paginator .scroll_knob { position:absolute; top:-5px; left:50%; margin-left:-10px; width:20px; height:20px; overflow:hidden; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnSD0LqE00jqQkQNVFopfyQ8_78eLwVaCtYpPhS1IaO8N7rQO1vgNsJ42kM09mKBlZ_w6aRdwA3-S6oV_me7YdYYXWwmVaJrEGLyc1iI2BaXN2PxQEa5cktA_K-riWXNd2mYh_VC500pc/s1600/slider_knob.gif) no-repeat 50% 50%; cursor:pointer; cursor:hand; } .paginator .current_page_mark { position:absolute; z-index:1; top:0; left:0; width:0; height:3px; overflow:hidden; background:#ff6c24; } .fullsize .scroll_thumb { display:none; } .paginator_pages { width:600px; text-align:right; font-size:0.8em; color:#808080; margin-top:-10px; }setelah itu cari kode
</body>
sisipkan kode dibawah ini tepat di atas kode </body>
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/paginator3000.js' type='text/javascript'></script> <script type='text/javascript'> var home_page="/"; var urlactivepage=location.href; var postperpage=7; var numshowpage=6; </script> <script src='http://scriptabufarhan.googlecode.com/svn/trunk/paginator3000-forblogger-v1.0.0.js' type='text/javascript'/>
simpan dan lihat hasilnya :D semoga bermanfaat
0 comments:
Post a Comment