Membuat Page Navigasi Halaman pada Blogspot

Navigasi yang jelas dan mudah merupakan salah satu hal yang dapat membuat pengunjung sebuah situs atau blog menjadi betah, tentu alasannya karena mereka merasa mudah dalam menemukan informasi yang mereka butuhkan. Tips dan trik blogging kali ini adalah mengenai cara membuat nomor halaman pada blogspot. Caranya cukup mudah, hanya perlu melakukan beberapa settingan pada blog dan fitur ini pun sudah jadi. Kawan-kawan tidak perlu mahir dalam Javascript atau bahasa pemrograman lainnya karena script untuk penomoran atau paging blogspot tersebut sudah banyak tersebar secara gratis.

Baiklah, kita langsung aja mulai tips dan trik blog dalam membuat nomor halaman untuk blogspot ini. Langkah-langkahnya adalah:

1. Seperti biasa anda harus login dulu ke dashboard
2. Setelah login, silahkan anda pilih menu "Tata Letak" atau "Layout"
3. Selanjutnya anda klik "Tambah Widget" atau "Add Widget"
4. Cari widget "HTML/Javascript"
5. Langkah selanjutnya anda copy kode di bawah ini lalu paste pada widget "HTML/Javascript" tadi.

Kodenya :

<style>
.showpageArea {padding: 0 2px;margin-top:10px;margin-bottom:10px;
}
.showpageArea a {border: 1px solid #505050;
color: #000000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;
}
.showpageArea a:hover {
font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;
}

.showpageNum a {border: 1px solid #505050;
color: #000000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;

}
.showpageNum a:hover {
font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;

}
.showpagePoint {font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
font-weight: bold;
border: 1px solid #333;
color: #fff;
background-color: #000000;


}

.showpage a:hover {font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;

}
.showpageNum a:link,.showpage a:link {
font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #0066cc;
color: #0066cc;
background-color: #FFFFFF;}

.showpageNum a:hover {font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;
}
</style>



<script type="text/javascript">

function showpageCount(json) {
var thisUrl = location.href;
var htmlMap = new Array();
var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf("/search?updated")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

var pageCount=10;
var displayPageNum=5;
var firstPageWord = 'Home';
var endPageWord = 'Last';
var upPageWord ='Previous';
var downPageWord ='Next';



var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp = post.published.$t.substr(0,10);
var title = post.title.$t;
if(isLablePage){
if(title!=''){
if(post.category){
for(var c=0, post_category; post_category = post.category[c]; c++) {
if(encodeURIComponent(post_category.term)==thisLable){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
}
}//end if(post.category){

itemCount++;
}

}else{
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
itemCount++;
}
}

for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
if(isLablePage){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}

fFlag++;
}

if(p==(thisNum-1)){
html += ' <span class="showpagePoint"><u>'+thisNum+'</u></span>';
}else{
if(p==0){
if(isLablePage){
html = labelHtml+'1</a></span>';
}else{
html += '<span class="showpageNum"><a href="/">1</a></span>';
}
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';
}
}

if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){

if(thisNum>1){
if(!isLablePage){
html = '<span class="showpage"><a href="/">'+ firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
}else{
html = ''+labelHtml + firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
}
}

html = '<div class="showpageArea"><span style="font-size:11px;padding: 2px 4px 2px 4px;margin: 2px 2px 2px 2px;color: #000000;border: 1px solid #333; background-color: #FFFFFF;" class="showpage">Page '+thisNum+' for '+(postNum-1)+': </span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;
html += '<span class="showpage"><a href="'+htmlMap[htmlMap.length-1]+'"> '+endPageWord+'</a></span>';
}

if(postNum==1) postNum++;
html += '</div>';

if(isPage || isFirstPage || isLablePage){
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}

for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}

if(pageArea&&pageArea.length>0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}
}

}
</script>

<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>

Setelah di paste ke widget "HTML/Javascript" tadi, silahkan kawan-kawan simpan widget tersebut di bagian bawah panel "Blog post". Bila kawan-kawan melakukannya dengan benar, maka sekarang, saat halaman blog di refresh, nomor halaman tersebut sudah muncul.

Tapi, berdasarkan pengalaman saya pribadi, script tersebut ada yang bekerja ada pula yang tidak pada template tertentu, jadi kalau ternyata nomor halamannya tidak muncul, ada kemungkinan templatenya tidak cocok. Bila menemukan kasus tersebut, kawan-kawan bisa mencob,a trik yang kedua, yaitu:

Kawan-kawan silahkan masuk pada menu "Template" lalu pilih "Edit HTML". Selanjutnya aktifkan centang pada bagian "Expand widget template". Langkah selanjutnya kawan-kawan silahkan cari kode ]]></b:skin>. Untuk mempermudah proses pencarian, kawan-kawan bisa menggunakan Ctrl + F lalu pada kotak pencarian ketikkan kode ]]></b:skin>. Setelah ketemu, silahkan kawan-kawan copy script berikut lalu paste di atas kode ]]></b:skin> tersebut.

Scriptnya :

/* ----- Page Navigation styles ----- */
.showpageNum a {
padding: 2px 5px;
margin:0 5px;
text-decoration: none;
border:1px solid #ccc;
-webkit-border-radius:3px;-moz-border-radius:3px;
background: #eee;
}
.showpageOf {
margin:0 8px 0 0;
}
.showpageNum a:hover {
border:1px solid #ccc;
background: #ddd;
}
.showpagePoint {
color:#fff;
text-shadow:0 1px 2px #333;
padding: 2px 5px;
margin: 2px;
font-weight: 700;
-webkit-border-radius:3px;-moz-border-radius:3px;
border:1px solid #999;
background: #666;
text-decoration: none;
}

Langkah selanjutnya adalah kawan-kawan cari kode </body>, lalu kawan-kawan copy script berikut dan simpan di atas kode </body> tersebut.

Scriptnya :

<!--Page Navigation Start-->
<script type='text/javascript'>
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=4;
var numshowpage=6;
var upPageWord =&#39;Previous&#39;;
var downPageWord =&#39;Next&#39;;
</script>
<script src='http://ahmad-rifai-tools.googlecode.com/files/pagenavi.js'
type='text/javascript'/>
<!--END Page Navigation -->

Simpan template, dan pekerjaan membuat nomor halaman atau paging pada blogspot pun selesai. Selamat mencoba.

Catatan:

Pada script di atas, terdapat kode "postperpage=4", kode tersebut merupakan setting mengenai jumlah postingan yang ingin ditampilkan dalam setiap halaman, ini harus disesuaikan dengan pengaturan postingan pada blog kawan-kawan yang ada di bagian setting.

Kode-kode lainnya yang berwarna merah dapat kawan-kawan rubah sesuai dengan keinginan kawan-kawan.

Sejarah Komodo

You'll Never Walk Alone - Sekitar 40 juta tahun silam di Asia muncul spesies komodo yang dimulai dengan marga varanus, yang kemudian bermigrasi ke Australia. Selanjutnya 15 juta tahun yang lalu para biawak raksasa ini bergerak menuju wilayah yang dikenal sebagai Indonesia sekarang, karena pertemuan lempeng benua Australia dan Asia Tenggara. Komodo diyakini berevolusi dari nenek moyang Australia sekitar 4 juta tahun yang lampau, dan meluas penyebarannya sampai sejauh Timor.

Ketika tahun 1910 armada kapal Belanda menemukan makhluk misterius yang diduga "Naga" mendiami wilayah Kepulauan Sunda Lesser. Selanjutnya oleh Letnan Steyn Van Hensbroek, seorang penjabat Administrasi Kolonial Belanda di kawasan Flores temuan ini ditindaklanjuti. Pada tahun 1912, Peter A. Ouwens, direktur Museum Zoologi di Bogor mempublikasikan komodo kepada dunia lewat disertasinya. Dalam pemberitaannya, Ouwens memberi saran nama kadal raksasa "Varanus Komodoensis" untuk komodo, sebagai pengganti julukan Komodo Dragon (Komodo Naga). 

Tentang Komodo 
Binatang komodo memiliki panjang 3 meter dan berat 90 kg, adalah spesies kadal terbesar di dunia yang kini dinyatakan sebagai salah satu dari 7 keajaiban alam di dunia.

Ukurannya yang besar ini berhubungan dengan gejala gigantisme pulau, yakni kecenderungan meraksasanya tubuh hewan-hewan tertentu yang hidup di pulau kecil terkait dengan tidak adanya mamalia karnivora di pulau tempat hidup komodo dan laju metabolism komodo yang kecil. Karena besar tubuhnya, kadal raksasa ini menduduki posisi predator puncak yang mendominasi ekosistem tempat hidupnya. 

Hewan ini secara alami hanya ditemukan di Pulau Komodo, NTT, Indonesia. Hidup di padang rumput kering yang terbuka, sabana dan hutan tropis. Mereka aktif pada siang hari walaupun kadang-kadang aktif pada malam hari. 

Komodo dapat berlari hingga 20 kilometer per jam pada jarak yang pendek, berenang sangat baik dan mampu menyelam sedalam 4,5 meter serta pandai memanjat pohon menggunakan cakarnya yang kuat. Untuk menangkap mangsa di luar jangkauannya, hewan ini dapat berdiri dengan kaki belakangnya dan menggunakan ekornya sebagai penunjang. 
Untuk tempat berlindung, hewan ini menggali lubang sedalam 1-3 meter dengan tungkai depan dan cakarnya yang kuat. Karena besar tubuhnya dan kebiasaan tidur di dalam lubang, komodo dapat menjaga panas tubuhnya selama malam hari dan mengurangi waktu berjemur pada pagi berikutnya.

Tempat persembunyiannya biasanya berada di daerah perbukitan dengan semilir angin laut, terbuka dari vegetasi. Tempat ini umumnya merupakan lokasi strategis untuk menyergap rusa. 
Komodo dapat menemukan mangsa dengan menggunakan penciumannya yang tajam dan dapat menemukan hewan yang mati atau sekarat pada jarak hingga 9,5 kilometer.


Taman Nasional Komodo   

Pada tahun 1915 pemerintah Belanda akhirnya menetapkan Pulau Komodo sebagai wilayah konservasi alam untuk binatang Komodo. Pada tahun 1986 Taman Nasional Komodo dinyatakan sebagai World Heritage Site (Situs Warisan Dunia) dan Man and Biosphere Reserve (Cagar Biosfer Dunia) oleh UNESCO.

Memiliki total luas sejumlah 1.817 km², di wilayah konservasi ini hidup 2500 ekor komodo yang tersebar di beberapa tempat utama yaitu Pulau Komodo, Pulau Rinca, Pulau Padar dan Gili Motang. Habitat komodo adalah alam terbuka dengan padang rumput savanna, hutan hujan, pantai berpasir putih, batu karang, dan pantai yang airnya jernih. Di kawasan ini, dapat ditemukan binatang lain seperti kuda, banteng liar, rusa, babi hutan jantan, ular, kera, dan berbagai jenis burung. 

Taman Nasional Komodo juga memiliki biota bawah laut yang menakjubkan. Para penyelam menyatakan bahwa perairan komodo merupakan salah satu tempat menyelam terbaik di dunia. Dengan pemandangan bawah laut yang memukau di mana terdapat 385 spesies karang yang indah, hutan mangrove dan rumput laut, juga sebagai rumah bagi ribuan spesies ikan, 70 jenis bunga karang, 10 jenis lumba-lumba, 6 macam paus, penyu hijau, dan berbagai jenis hiu dan ikan pari. 

Lokasi ini dapat dicapai dari Kupang, naik pesawat ke Ende kemudian diteruskan dengan minibus ke kota Labuhan Bajo selama 10 jam perjalanan, setibanya di sana menuju ke Pulau Komodo dengan menggunakan speed boat selama 2 jam.

Itulah Sejarah Komodo. Mohon maaf bila banyak terdapat kekurangan. Semoga bermanfaat.

Sumber : komodokita.org