Cara Mengganti Page Navigasi Bernomor Error dengan Yang Baru dan Keren

Cara Mengganti Page Navigasi Bernomor Error dengan Yang Baru dan Keren


Ketika mengganti template blog dengan tampilan yang baru, kita memang sebaiknya tidak terlalu banyak merubah pengaturan dan tampilan yang ada agar blog berkinerja lebih baik sekaligus untuk menghargai dan menghormati sang pembuat template. Namun jika kita memakai template agak lama yang belum diupdate, adakalanya kita jumpai suatu fitur yang mungkin bermasalah atau sudah tidak bekerja karena script sudah usang atau tidak dipakai lagi.

Kalau sudah demikian, maka solusinya kita mesti memperbaiki atau menggantinya agar fungsi dari fitur tersebut bekerja kembali seperti yang diharapkan.

Seperti yang terjadi pada blog saya ini, pada awalnya saya tidak sadar jika fitur page navigasi bernomor yang berada di bawah beranda (home) blog saya ini bermasalah. Saya menemukan hal ini saat membukanya lewat mobile dan ternyata halaman nomer yang ditampilkan error. Halaman memang kadang berganti namun nomor dipilih kembali di angka satu alias halaman pertama. Meski begitu, saat diakses lewat web ternyata tampilannya normal-normal saja alias berfungsi dengan baik.

Mendapati hal ini, saya pun berencana untuk memperbaiki masalah yang muncul pada versi mobile ini. 

Sebelum memperbaikinya, saya kembali cermati terlebih dulu pada tampilan web dan menemukan masalah lain. Ternyata tampilan navigasi bernomor pada versi web ini dibatasi pada halaman tertentu sehingga halaman nomor navigasi untuk postingan-postingan lama menjadi tidak muncul.

Melihat fenomena ini, saya pun tidak jadi memperbaikinya, tapi akan saya ganti dengan page navigasi bernomor yang baru. Sekarang, tampilan navigasi bernomor di blog ini telah normal dengan tampilan baru yang keren. 

Page navigasi bernomor

Jika anda mengalami hal serupa atau ingin mengganti page navigasi bernomor di blog anda, pada kesempatan kali ini saya akan berbagi cara untuk menggantinya dengan tiga tampilan keren di bawah ini.

Sudah saya coba, ketiganya berfungsi dengan baik pada versi web dan mobile, serta tampilan halaman unlimited. Anda bisa memilih salah satu di antaranya untuk diterapkan di blog anda sesuai dengan selera.

Adapun cara menggantinya, silahkan ikuti langkah-langkah berikut ini. 

 1. Buka akun blogger anda.

2. Pilih menu tema dan klik edit html.

3. Silahkan backup template lebih dulu.

4. Cari kode script yang terpasang untuk page navigasi bernomor di dalam template dan kemudian hapus.

Kode ini biasanya terdiri dari script dalam CSS dan html. Ciri-cirinya biasanya bertuliskan pagenavi atau blog pager. Untuk blog pager kadang merupakan default template sehingga kalau ragu biarkan saja.

5. Setelah kode yang ada sebelumnya telah dihapus, sekarang tinggal pemasangan untuk script halaman bernomor yang baru.

Ada tiga pilihan tampilan yang bisa anda coba di bawah ini. Silahkan pilih sesuai selera.

Versi Pertama


buatan arlina
pilihan warna gelap dan terang

Tampilannya keren dan ada pilihan untuk warna gelap dan terang. Script buatan Arlina ini bisa anda pasang dengan cara mencari kode </head> di dalam template blog anda. Setelah ketemu, pilih salah satu kode berikut ini dan letakkan di atasnya:

Background Gelap


<b:if cond='data:blog.pageType != &quot;item&quot;'> <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <style type='text/css'> /* Page Navigation */ #blog-pager{background:#2d3141;clear:both;width:auto;padding:22px;line-height:normal;position:relative;display:block;text-align:left;overflow:visible;margin:20px 0 5px 0} .showpage a,.showpageNum a,.showpagePoint,.showpageOf{background:rgba(255,255,255,.1);display:inline-block;font-size:13px;color:rgba(255,255,255,.8);padding:5px 10px;margin:0 2px 0 0;border-radius:2px;transition:all .3s} .showpage a:hover,.showpageNum a:hover,.showpagePoint:hover{background:rgba(0,0,0,0.2);color:#fff;position:relative;} .showpagePoint{background:#70c3eb;color:#fff;z-index:200;position:relative;} @media screen and (max-width:640px) { #blog-pager {padding:12px;} .showpage a,.showpageNum a,.showpagePoint,.showpageOf{margin:0 2px 2px 0}} @media screen and (max-width:320px) { .showpage a,.showpageNum a,.showpagePoint,.showpageOf{padding:3px 6px}} </style> </b:if> </b:if>

Background Terang

<b:if cond='data:blog.pageType != &quot;item&quot;'> <b:if cond='data:blog.pageType != &quot;static_page&quot;'> <style type='text/css'> /* Page Navigation */ #blog-pager{background:#fff;clear:both;width:auto;padding:22px;line-height:normal;position:relative;display:block;text-align:left;overflow:visible;margin:20px 0 5px 0} .showpage a,.showpageNum a,.showpagePoint,.showpageOf{position:relative;background:#fff;display:inline-block;font-size:13px;color:rgba(0,0,0,.8);padding:5px 8px;margin:0 4px 0 0;box-shadow:0 1px 4px 1px rgba(0,0,0,0.1);border-radius:2px;transition:all .3s} .showpageNum a:before{content:'';position:absolute;top:0;bottom:0;left:0;right:0;box-shadow:inset 0 -2px 2px rgba(0,0,0,0.02);transition:box-shadow 0.5s} .showpage a:hover,.showpageNum a:hover,.showpagePoint:hover{background:rgba(0,0,0,0.03);color:#333;position:relative;} .showpagePoint{background:#2980b9;color:#fff;} @media screen and (max-width:640px) { #blog-pager {padding:12px;} .showpage a,.showpageNum a,.showpagePoint,.showpageOf{margin:0 2px 2px 0;box-shadow:0 1px 2px 1px rgba(0,0,0,0.1);}} @media screen and (max-width:320px) { .showpage a,.showpageNum a,.showpagePoint,.showpageOf{padding:3px 6px}} </style> </b:if> </b:if>

Setelahnya, copy kode berikut ini dan letakkan sebelum kode </body>

<b:if cond='data:blog.pageType == &quot;index&quot;'> <script type='text/javascript'> /*<![CDATA[*/ var postperpage=5;var numshowpage=5;var upPageWord ='Prev';var downPageWord ='Next';var urlactivepage=location.href;var home_page="/"; /*]]>*/ </script> <script src='https://cdn.jsdelivr.net/gh/Arlina-Design/redvision@master/unlipage.js' type='text/javascript'/> </b:if>

Versi Kedua


Navigasi dari CB

Versi kedua ini saya dapat dari blog CB. Tampilannya hitam putih dan minimalis sehingga cukup mudah digunakan. Cara pemasangannya silahkan cari kode </style> atau ]]></b:skin> dan letakkan kode berikut ini di atasnya:

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}
.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{padding: 5px 10px;margin-right:5px; color: #000; background-color:#fff;border:2px solid #ccc;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#222;text-decoration:none;color: #fff;}
#blog-pager .showpage, #blog-pager, .pagecurrent{font-weight:bold;color: #ccc;}
 .showpageOf{display:none!important}
#blog-pager .pages{border:none;-webkit-box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);-moz-box-shadow:0px 5px 3px -1px rgba(50, 50, 50, 0.53);box-shadow: 0px 5px 3px -1px rgba(50, 50, 50, 0.53);}

Selanjutnya cari kode </body> dan pastekan kode berikut ini di atasnya:

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
  /*<![CDATA[*/
    var perPage=6;
    var numPages=6;
    var prevText ='◄';
    var nextText ='►';
    var urlactivepage=location.href;
    var home_page="/";
  /*]]>*/
</script>
  <script>
  /*<![CDATA[*/
    var noPage;var currentPage;var currentPageNo;var postLabel;pagecurrentg();function looppagecurrentg(pageInfo){var html='';pageNumber=parseInt(numPages/2);if(pageNumber==numPages-pageNumber){numPages=pageNumber*2+1}pageStart=currentPageNo-pageNumber;if(pageStart<1)pageStart=1;lastPageNo=parseInt(pageInfo/perPage)+1;if(lastPageNo-1==pageInfo/perPage)lastPageNo=lastPageNo-1;pageEnd=pageStart+numPages-1;if(pageEnd>lastPageNo)pageEnd=lastPageNo;html+="<span class='showpageOf'>Page "+currentPageNo+' of '+lastPageNo+"</span>";var prevNumber=parseInt(currentPageNo)-1;if(currentPageNo>1){if(currentPageNo==2){if(currentPage=="page"){html+='<span class="showpage"><a href="'+home_page+'">'+prevText+'</a></span>'}else{html+='<span class="displaypageNum"><a href="/search/label/'+postLabel+'?&max-results='+perPage+'">'+prevText+'</a></span>'}}else{if(currentPage=="page"){html+='<span class="displaypageNum"><a href="#" onclick="redirectpage('+prevNumber+');return false">'+prevText+'</a></span>'}else{html+='<span class="displaypageNum"><a href="#" onclick="redirectlabel('+prevNumber+');return false">'+prevText+'</a></span>'}}}if(pageStart>1){if(currentPage=="page"){html+='<span class="displaypageNum"><a href="'+home_page+'">1</a></span>'}else{html+='<span class="displaypageNum"><a href="/search/label/'+postLabel+'?&max-results='+perPage+'">1</a></span>'}}if(pageStart>2){html+='... '}for(var jj=pageStart;jj<=pageEnd;jj++){if(currentPageNo==jj){html+='<span class="pagecurrent">'+jj+'</span>'}else if(jj==1){if(currentPage=="page"){html+='<span class="displaypageNum"><a href="'+home_page+'">1</a></span>'}else{html+='<span class="displaypageNum"><a href="/search/label/'+postLabel+'?&max-results='+perPage+'">1</a></span>'}}else{if(currentPage=="page"){html+='<span class="displaypageNum"><a href="#" onclick="redirectpage('+jj+');return false">'+jj+'</a></span>'}else{html+='<span class="displaypageNum"><a href="#" onclick="redirectlabel('+jj+');return false">'+jj+'</a></span>'}}}if(pageEnd<lastPageNo-1){html+='... '}if(pageEnd<lastPageNo){if(currentPage=="page"){html+='<span class="displaypageNum"><a href="#" onclick="redirectpage('+lastPageNo+');return false">'+lastPageNo+'</a></span>'}else{html+='<span class="displaypageNum"><a href="#" onclick="redirectlabel('+lastPageNo+');return false">'+lastPageNo+'</a></span>'}}var nextnumber=parseInt(currentPageNo)+1;if(currentPageNo<lastPageNo){if(currentPage=="page"){html+='<span class="displaypageNum"><a href="#" onclick="redirectpage('+nextnumber+');return false">'+nextText+'</a></span>'}else{html+='<span class="displaypageNum"><a href="#" onclick="redirectlabel('+nextnumber+');return false">'+nextText+'</a></span>'}}var pageArea=document.getElementsByName("pageArea");var blogPager=document.getElementById("blog-pager");for(var p=0;p<pageArea.length;p++){pageArea[p].innerHTML=html}if(pageArea&&pageArea.length>0){html=''}if(blogPager){blogPager.innerHTML=html}}function totalcountdata(root){var feed=root.feed;var totaldata=parseInt(feed.openSearch$totalResults.$t,10);looppagecurrentg(totaldata)}function pagecurrentg(){var thisUrl=urlactivepage;if(thisUrl.indexOf("/search/label/")!=-1){if(thisUrl.indexOf("?updated-max")!=-1){postLabel=thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"))}else{postLabel=thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"))}}if(thisUrl.indexOf("?q=")==-1&&thisUrl.indexOf(".html")==-1){if(thisUrl.indexOf("/search/label/")==-1){currentPage="page";if(urlactivepage.indexOf("#PageNo=")!=-1){currentPageNo=urlactivepage.substring(urlactivepage.indexOf("#PageNo=")+8,urlactivepage.length)}else{currentPageNo=1}document.write("<script src=\""+home_page+"feeds/posts/summary?max-results=1&alt=json-in-script&callback=totalcountdata\"><\/script>")}else{currentPage="label";if(thisUrl.indexOf("&max-results=")==-1){perPage=20}if(urlactivepage.indexOf("#PageNo=")!=-1){currentPageNo=urlactivepage.substring(urlactivepage.indexOf("#PageNo=")+8,urlactivepage.length)}else{currentPageNo=1}document.write('<script src="'+home_page+'feeds/posts/summary/-/'+postLabel+'?alt=json-in-script&callback=totalcountdata&max-results=1" ><\/script>')}}}function redirectpage(numberpage){jsonstart=(numberpage-1)*perPage;noPage=numberpage;var nameBody=document.getElementsByTagName('head')[0];var newInclude=document.createElement('script');newInclude.type='text/javascript';newInclude.setAttribute("src",home_page+"feeds/posts/summary?start-index="+jsonstart+"&max-results=1&alt=json-in-script&callback=finddatepost");nameBody.appendChild(newInclude)}function redirectlabel(numberpage){jsonstart=(numberpage-1)*perPage;noPage=numberpage;var nameBody=document.getElementsByTagName('head')[0];var newInclude=document.createElement('script');newInclude.type='text/javascript';newInclude.setAttribute("src",home_page+"feeds/posts/summary/-/"+postLabel+"?start-index="+jsonstart+"&max-results=1&alt=json-in-script&callback=finddatepost");nameBody.appendChild(newInclude)}function finddatepost(root){post=root.feed.entry[0];var timestamp1=post.published.$t.substring(0,19)+post.published.$t.substring(23,29);var timestamp=encodeURIComponent(timestamp1);if(currentPage=="page"){var pAddress="/search?updated-max="+timestamp+"&max-results="+perPage+"#PageNo="+noPage}else{var pAddress="/search/label/"+postLabel+"?updated-max="+timestamp+"&max-results="+perPage+"#PageNo="+noPage}location.href=pAddress}

  /*]]>*/

</script>

</b:if>

</b:if>

Versi Ketiga


Navigasi saya pasang

Masih dari blog CB, tampilan navigasi bernomor ini keren dan lebih lengkap. Pemasangannya sama seperti cara sebelumnya yakni cari kode </style> atau ]]></b:skin> dan letakkan kode berikut ini di atasnya:

#blog-pager{clear:both;margin:30px auto;text-align:center; padding: 7px;}

.blog-pager {background: none;}
.displaypageNum a,.showpage a,.pagecurrent{font-size: 14px;padding: 5px 12px;margin-right:5px; color: #666; background-color:#eee;}
.displaypageNum a:hover,.showpage a:hover, .pagecurrent{background:#000000;text-decoration:none;color: #fff;}
#blog-pager .pagecurrent{font-weight:bold;color: #fff;background:#000000;}
.showpageOf{display:none!important}
#blog-pager .pages{border:none;}

Selanjutnya letakkan kode berikut ini sebelum kode </body>

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
/*<![CDATA[*/
var perPage=7;
var numPages=6;
var firstText ='First';
var lastText ='Last';
var prevText ='« Previous';
var nextText ='Next »';
var urlactivepage=location.href;
var home_page="/";
/*]]>*/
</script>
<script>
  /*<![CDATA[*/
    if (typeof firstText == "undefined") firstText = "First";
    if (typeof lastText == "undefined") lastText = "Last";
    var noPage;
    var currentPage;
    var currentPageNo;
    var postLabel;
    pagecurrentg();
    function looppagecurrentg(pageInfo) {
        var html = '';
        pageNumber = parseInt(numPages / 2);
        if (pageNumber == numPages - pageNumber) {
            numPages = pageNumber * 2 + 1
        }
        pageStart = currentPageNo - pageNumber;
        if (pageStart < 1) pageStart = 1;
        lastPageNo = parseInt(pageInfo / perPage) + 1;
        if (lastPageNo - 1 == pageInfo / perPage) lastPageNo = lastPageNo - 1;
        pageEnd = pageStart + numPages - 1;
        if (pageEnd > lastPageNo) pageEnd = lastPageNo;
        html += "<span class='showpageOf'>Page " + currentPageNo + ' of ' + lastPageNo + "</span>";
        var prevNumber = parseInt(currentPageNo) - 1;
        //Iccsi was here, doing magic
        if (currentPageNo > 1) {
   if (currentPage == "page") {
     html += '<span class="showpage firstpage"><a href="' + home_page + '">' + firstText + '</a></span>'
   } else {
     html += '<span class="displaypageNum firstpage"><a href="/search/label/' + postLabel + '?&max-results=' + perPage + '">' + firstText + '</a></span>'
   }
  }
    if (currentPageNo > 2) {
            if (currentPageNo == 3) {
                if (currentPage == "page") {
                    html += '<span class="showpage"><a href="' + home_page + '">' + prevText + '</a></span>'
                } else {
                    html += '<span class="displaypageNum"><a href="/search/label/' + postLabel + '?&max-results=' + perPage + '">' + prevText + '</a></span>'
                }
            } else {
                if (currentPage == "page") {
                    html += '<span class="displaypageNum"><a href="#" onclick="redirectpage(' + prevNumber + ');return false">' + prevText + '</a></span>'
                } else {
                    html += '<span class="displaypageNum"><a href="#" onclick="redirectlabel(' + prevNumber + ');return false">' + prevText + '</a></span>'
                }
            }
        }
if (pageStart > 1) {

            if (currentPage == "page") {

                html += '<span class="displaypageNum"><a href="' + home_page + '">1</a></span>'

            } else {

                html += '<span class="displaypageNum"><a href="/search/label/' + postLabel + '?&max-results=' + perPage + '">1</a></span>'

            }

        }

        if (pageStart > 2) {

            html += ' ... '

        }

        for (var jj = pageStart; jj <= pageEnd; jj++) {

            if (currentPageNo == jj) {

                html += '<span class="pagecurrent">' + jj + '</span>'

            } else if (jj == 1) {

                if (currentPage == "page") {

                    html += '<span class="displaypageNum"><a href="' + home_page + '">1</a></span>'

                } else {

                    html += '<span class="displaypageNum"><a href="/search/label/' + postLabel + '?&max-results=' + perPage + '">1</a></span>'

                }

            } else {

                if (currentPage == "page") {

                    html += '<span class="displaypageNum"><a href="#" onclick="redirectpage(' + jj + ');return false">' + jj + '</a></span>'

                } else {

                    html += '<span class="displaypageNum"><a href="#" onclick="redirectlabel(' + jj + ');return false">' + jj + '</a></span>'

                }

            }

        }

        if (pageEnd < lastPageNo - 1) {

  html += '...'

        }

        if (pageEnd < lastPageNo) {

            if (currentPage == "page") {

                html += '<span class="displaypageNum"><a href="#" onclick="redirectpage(' + lastPageNo + ');return false">' + lastPageNo + '</a></span>'

            } else {

                html += '<span class="displaypageNum"><a href="#" onclick="redirectlabel(' + lastPageNo + ');return false">' + lastPageNo + '</a></span>'

            }

        }

        var nextnumber = parseInt(currentPageNo) + 1;

        if (currentPageNo < (lastPageNo - 1)) {

            if (currentPage == "page") {

                html += '<span class="displaypageNum"><a href="#" onclick="redirectpage(' + nextnumber + ');return false">' + nextText + '</a></span>'

            } else {

                html += '<span class="displaypageNum"><a href="#" onclick="redirectlabel(' + nextnumber + ');return false">' + nextText + '</a></span>'

            }

  }

  if (currentPageNo < lastPageNo) {

   //Iccsi was here, doing magic

   if (currentPage == "page") {

     html += '<span class="displaypageNum lastpage"><a href="#" onclick="redirectpage(' + lastPageNo + ');return false">' + lastText + '</a></span>'

   } else {

     html += '<span class="displaypageNum lastpage"><a href="#" onclick="redirectlabel(' + lastPageNo + ');return false">' + lastText + '</a></span>'

   }

        }
var pageArea = document.getElementsByName("pageArea");

        var blogPager = document.getElementById("blog-pager");

        for (var p = 0; p < pageArea.length; p++) {

            pageArea[p].innerHTML = html

        }

        if (pageArea && pageArea.length > 0) {

            html = ''

        }

        if (blogPager) {

            blogPager.innerHTML = html

        }

    }


    function totalcountdata(root) {

        var feed = root.feed;

        var totaldata = parseInt(feed.openSearch$totalResults.$t, 10);

        looppagecurrentg(totaldata)

    }

    function pagecurrentg() {

        var thisUrl = urlactivepage;

        if (thisUrl.indexOf("/search/label/") != -1) {

            if (thisUrl.indexOf("?updated-max") != -1) {

                postLabel = thisUrl.substring(thisUrl.indexOf("/search/label/") + 14, thisUrl.indexOf("?updated-max"))

            } else {

                postLabel = thisUrl.substring(thisUrl.indexOf("/search/label/") + 14, thisUrl.indexOf("?&max"))

            }

        }

        if (thisUrl.indexOf("?q=") == -1 && thisUrl.indexOf(".html") == -1) {

            if (thisUrl.indexOf("/search/label/") == -1) {

                currentPage = "page";

                if (urlactivepage.indexOf("#PageNo=") != -1) {

                    currentPageNo = urlactivepage.substring(urlactivepage.indexOf("#PageNo=") + 8, urlactivepage.length)

                } else {

                    currentPageNo = 1

                }

                document.write("<script src=\"" + home_page + "feeds/posts/summary?max-results=1&alt=json-in-script&callback=totalcountdata\"><\/script>")

            } else {

                currentPage = "label";

                if (thisUrl.indexOf("&max-results=") == -1) {

                    perPage = 20

                }

                if (urlactivepage.indexOf("#PageNo=") != -1) {

                    currentPageNo = urlactivepage.substring(urlactivepage.indexOf("#PageNo=") + 8, urlactivepage.length)

                } else {

                    currentPageNo = 1

                }

                document.write('<script src="' + home_page + 'feeds/posts/summary/-/' + postLabel + '?alt=json-in-script&callback=totalcountdata&max-results=1" ><\/script>')

            }

        }

    }

    function redirectpage(numberpage) {

        jsonstart = (numberpage - 1) * perPage;

        noPage = numberpage;

        var nameBody = document.getElementsByTagName('head')[0];

        var newInclude = document.createElement('script');

        newInclude.type = 'text/javascript';

        newInclude.setAttribute("src", home_page + "feeds/posts/summary?start-index=" + jsonstart + "&max-results=1&alt=json-in-script&callback=finddatepost");

        nameBody.appendChild(newInclude)

    }


    function redirectlabel(numberpage) {

        jsonstart = (numberpage - 1) * perPage;

        noPage = numberpage;

        var nameBody = document.getElementsByTagName('head')[0];

        var newInclude = document.createElement('script');

        newInclude.type = 'text/javascript';

        newInclude.setAttribute("src", home_page + "feeds/posts/summary/-/" + postLabel + "?start-index=" + jsonstart + "&max-results=1&alt=json-in-script&callback=finddatepost");

        nameBody.appendChild(newInclude)

    }


    function finddatepost(root) {

        post = root.feed.entry[0];

        var timestamp1 = post.published.$t.substring(0, 19) + post.published.$t.substring(23, 29);

        var timestamp = encodeURIComponent(timestamp1);

        if (currentPage == "page") {

            var pAddress = "/search?updated-max=" + timestamp + "&max-results=" + perPage + "#PageNo=" + noPage

        } else {

            var pAddress = "/search/label/" + postLabel + "?updated-max=" + timestamp + "&max-results=" + perPage + "#PageNo=" + noPage

        }

        location.href = pAddress

    }

  /*]]>*/

</script>

</b:if>

</b:if>

Pada masing-masing script di atas, sesuaikan pengaturan jumlah artikel dan jumlah nomor yang ditampilkan (ditandai warna merah) dengan tampilan blog anda. 

6. Jika sudah dipilih dan diterapkan ke dalam template, silahkan simpan kembali template anda.

Kalau tampilan masih bermasalah, buka template anda kembali. Di bawah deretan kode setelah <b:includable id='main' var='top'>, cari kode berikut ini:

<b:include name='nextprev'/>

atau mungkin

<b:if cond='data:blog.pageType == "index"'> <b:include name='pagenavi'/> <b:else/> <b:if cond='data:blog.pageType == "archive"'> <b:include name='pagenavi'/> <b:else/> <b:if cond='data:blog.homepageUrl != data:blog.url'> <b:include name='pagenavi'/> </b:if> </b:if> </b:if>

Atau mungkin kode sejenis dengan fungsi sama. Ganti kode tersebut dengan kode berikut ini (atau sesuaikan):

<b:if cond='data:blog.pageType == "index"'> <b:include name='nextprev'/> <b:else/> <b:if cond='data:blog.pageType == "archive"'> <b:include name='nextprev'/> <b:else/> <b:if cond='data:blog.homepageUrl != data:blog.url'> <b:include name='nextprev'/> </b:if> </b:if> </b:if>

Agar bisa bekerja juga pada tampilan halaman label, silahkan cari kode berikut ini di dalam template:

expr:href='data:label.url'

Ganti semua yang ada dengan kode di bawah ini:

expr:href='data:label.url + &quot;?&amp;amp;max-results=5&quot;'

Keterangan: Nomor (warna merah) disesuaikan dengan pengaturan di atas (jumlah artikel ditampilkan).

Demikian Cara Mengganti Page Navigasi Bernomor Error dengan Yang Baru dan Keren. Semoga bemanfaat.

Selengkapnya
7 Wisata Jelajah Goa di Kabupaten Purworejo

7 Wisata Jelajah Goa di Kabupaten Purworejo


Goa adalah lubang alami atau rongga bawah tanah yang terbentuk melalui sistem percelahan, rekahan, atau aliran sungai yang membentuk suatu lintasan aliran sungai bawah tanah. Sebuah Goa biasanya terdapat pintu masuk, lorong dan ruangan yang bisa ditelusuri dan dijelajahi oleh manusia.

Memiliki wilayah berupa pegunungan, Kabupaten Puworejo juga mempunyai beberapa wisata goa yang siap menanti petualangan anda. Beberapa goa berikut ini berada di wilayah yang tidak begitu jauh lokasinya sehingga anda bisa menelusuri sepuasnya. Berdasarkan data yang kami peroleh, berikut informasinya. 

1. Goa Seplawan


Goa Seplawan
via njogja.co.id

Goa ini merupakan salah satu tujuan wisata unggulan di Kabupaten Purworejo. Berada di kawasan pegunungan yang masuk wilayah Desa Donorejo, Kecamatan Kaligesing, panorama alam di sekitar goa Seplawan ini terasa sangat sejuk. Saat berada di pintu masuk, kita akan disambut oleh replika arca emas dari Dewa Siwa dan Dewi Parwati. Dahulu memang pernah ditemukan kedua patung Dewa Dewi tersebut di goa ini.

Selain bernilai sejarah, goa Seplawan menyajikan sensasi petualangan seru menyusuri goa alam yang begitu eksotis. Di dalamnya dijumpai stalagtit dan stalagmit serta ornamen-ornamen di dinding goa yang begitu menawan sehingga sayang untuk anda lewatkan. 

2. Goa Anjani 


Goa anjani
via explorekabupatenpurworejo.blogspot.com

Meski masih belum begitu populer, Goa Anjani adalah salah satu tempat wisata alam menarik di Kabupaten Purworejo. Goa yang cantik, alami dan menakjubkan ini berada berada di Dusun Somoroto, Desa Tlogoguwo Kecamatan Kaligesing. Berada di lereng bukit, terdapat sungai kecil sepanjang jalur penelusuran goa anjani yang merupakan sumber mata air Curug Tawing yang masih satu kawasan dengan goa ini.

Objek wisata tersembunyi ini menyajikan suasana keindahan goa yang mempunyai lorong horisontal sedalam kurang lebih 1000 meter siap menantang anda untuk menjelajahinya. Di dalamnya, kita juga bisa menikmati isi dalam goa seperti stalaktit dan stalakmit yang indah dan menawan.

3. Goa Sikantong


Goa Sikantong
via inibaru.id

Berada di puncak gugusan Perbukitan Menoreh, goa Sikantong siap menyapa anda untuk segera menjelajahinya. Memiliki lintasan sepanjang 1,5 km, obyek wisata yang berada di Desa Donorejo, Kecamatan Kaligesing ini menawarkan petualangan seru dengan berbagai rute menantang.

Pemandangan di dalamnya juga begitu indah sehingga anda tidak akan merasa lelah berjalan sembari menikmati isi dalam goa. Mata anda akan dimanjakan dengan keindahan stalagtit dan stalagmit di dalamnya. Sekitar 40 menit penyusuran, kita akan sampai di ujung goa. Puas menjelajahi goa, kita bisa bersantai sembari menikmati Sikantong Robusta, minuman kopi hitam khas tempat ini. 

4. Goa Nguwik


Goa nguwik
via magmagama.wordpress.com

Masih di desa Donorejo, Kecamatan Kaligesing, goa Nguwik dengan penoramanya juga siap untuk anda susuri. Selain menyajikan keindahan khas goa, tempat ini juga menyimpan sejarah masa lampau karena pernah ditemukan fosil-fosil berusia sekitar 900 ribu tahun. Fosil-fosil yang ditemukan yaitu fosil rusa, kudanil, serta badak.

Goa Nguwik memiliki lintasan sepanjang 220 meter dengan mulut goa tidak terlalu besar. Di dalamnya banyak dijumpai kelelawar berterbangan di langit-langit goa. Dengan penerangan belum terlalu sempurna, anda mesti hati-hati saat menjelajahi isi dalam goa ini. Meski begitu, pemandangan di dalamnya cukup mengagumkan dengan adanya stalagtit dan bebatuan-bebatuan unik yang siap memanjakan mata anda.

5. Goa Gong


Goa Gong
via kebudayaan.kemdikbud.go.id

Berada di sebuah perbukitan pada ketinggian 49 mdpl, goa Gong menyimpan nilai sejarah tinggi sejak zaman purbakala. Untuk menuju tempat ini, kita harus melewati jalan terjal dan licin dengan kemiringan hampir 80 derajat karena masih alami berupa tanah liat. Goa yang berlokasi di Desa Kesawen, Kec. Pituruh ini memiliki dua bilik dan satu ruang utama yakni perut gua. Tepat di bagian perut terdapat sebuah altar berbahan marmer yang oleh warga dipercaya dulunya menjadi tempat bertapa seorang sakti.

Di dalam Situs Goa Gong ini juga terdapat sebuah fragmen lingga yang menyatu dengan yoni. Selain bernilai sejarah, goa Gong juga merupakan wisata potensial jika dikelola dengan baik. Berdiri di bibir gua ini, kita bisa menikmati pemandangan alam luar bisa indahnya. 

6. Goa Lawang dan Silumbu


Goa Lawang dan Silumbu

Kedua situs goa ini terletak di Desa Kali Glagah, Kecamatan Kemiri. Goa Lawang berada di dataran rendah, sedangkan Goa Silumbu berada di atas bukit. Diperkirakan kedua situs ini dibangun pada sekitar abad 8 Masehi (pada masa Hindu). Seperti pada ulasan goa sebelumnya, Goa Lawang juga mempunyai nilai sejarah tinggi dengan ditemukannya fragmen lingga dan yoni.

Goa Lawang sendiri terdiri dari tiga buah Gua dan dibuat dari padas yang dipahat. Sedangkan goa Silumbu yang berada di atas bukit ternyata juga mempunyai keterkaitan dengan goa lawang. Kedua goa ini menyimpan sejarah kehidupan pada zaman itu. Tidak hanya kaya akan nilai sejarah, di kedua tempat ini kita juga bisa menikmati pemandangan indah di dalam dan sekitar goa. 

7. Goa Lawa


Goa Lawa
via screenshot youtube: Cah nDeso

Mungkin banyak dijumpai nama Goa Lawa di beberapa wilayah khususnya di pulau Jawa. Secara umum, lawa berarti kelelawar sehingga goa lawa artinya goa yang juga menjadi sarang dari para kelelawar. Tempat wisata menyusuri lubang bumi bernama goa lawa juga ditemukan di Kabupaten Purworejo tepatnya di Desa Bendosari, Kecamatan Gebang.

Meski belum begitu banyak informasi mengenai tempat wisata ini, namun goa anugerah alam ini memiliki potensi yang layak untuk dikembangkan. Berbagai kegiatan juga telah digalakkan agar pengelolaan objek wisata baru ini dapat berjalan secara maksimal dan berkelanjutan. Selain itu, penambahan fasilitas juga diperlukan sehingga wisatawan tertarik untuk berkunjung ke tempat ini.

Demikianlah 7 Wisata Jelajah Goa Mengagumkan di Kabupaten Purworejo. Semoga bermanfaat.

Selengkapnya
Mengatasi Munculnya Notifikasi Penghasilan Anda Beresiko Karena Masalah ads.txt

Mengatasi Munculnya Notifikasi Penghasilan Anda Beresiko Karena Masalah ads.txt


Sebenarnya sudah banyak artikel yang membahas tentang hal ini jika anda mencari solusi untuk mengatasi munculnya notifikasi "Penghasilan anda berisiko - anda perlu memperbaiki beberapa masalah file ads.txt untuk.. dst" di akun adsense anda.

Masalah ini memang umum dialami oleh setiap publisher adsense, bahkan pengaturan yang sudah betul pun masih kerap mendapati notifikasi ini. Meski sudah banyak dibahas, saya ingin ikut kiranya meramaikan pembahasan ini sehingga semoga ikut kebagian kunjungan dari para penayang adsense saat mengalami masalah serupa.

Mengatasi Ads.txt

Menurut pengertiannya, ads txt adalah inisiatif dari Interactive Advertising Bureau Tech Lab (IAB) yang bertujuan untuk mempromosikan dan meningkatkan transparansi dalam program periklanan. Hal ini juga bertujuan untuk memastikan bahwa inventaris iklan digital kita dijual melalui penjual resmi untuk mencegah penjualan kepada pihak palsu demi melindungi pihak pengiklan yang beriklan di situs kita.

Jadi bisa dipahami bahwa ini merupakan langkah Google untuk melindungi pengiklan dan penerbit iklan dari segala kecurangan dan penyalahgunaan atas hal ini. 

Setelah memahami apa itu ads.txt, sekarang kita beralih kepada cara mengatasi masalah ads.txt yang muncul di beranda akun adsense kita.

Bagi yang sudah cukup lama menjadi publisher adsense, mungkin hal ini tidak menjadi masalah alias gampang saja diatasi. Tapi bagi para pemula baru penayang adsense, pastinya ada rasa panik dan bingung ketika mendapati notifikasi seperti ini pada akun adsensenya.

Sebagai sesama publisher adsense yang sebetulnya juga tergolong belum begitu lama, pada artikel saya kali ini saya hendak ikut berbagi mengenai solusi untuk memecahkan problem ini. 

Bagaimana cara mengatasinya?. Solusinya yaitu dengan mengaktifkan ads.txt di blog kita. Adapun penerapannya sebagai berikut:

1. Buka kembali akun adsense anda. 

2. Pada notifikasi tersebut, kita bisa mempelajarinya lebih dulu dengan klik PELAJARI LEBIH LANJUT, atau langsung saja klik pada tulisan PERBAIKI SEKARANG. 

Pilih perbaiki

3. Setelah itu, anda bisa membacanya lebih dulu atau silahkan langsung pilih download yang ada di bawah tulisan. 

Pilih download

4. Setelah file tersebut didownload, buka file berekstensi atau format txt tersebut dan salin tulisan di dalamnya:

Kode ads txt

Keterangan: tulisan diblok merah merupakan pub ID adsense setiap publisher yang secara otomatis tertera di sana. 

Kalau tidak sempat mendownloadnya, anda bisa pakai kode di bawah ini:

google.com, pub-9XXXXXXXXXXXXXXX, DIRECT, f08c47fec0942fa0


Ganti yang berwarna merah dengan pub ID akun adsense anda. 

5. Langkah berikutnya silahkan masuk ke akun blogger anda dan pilih menu setting (setelan). Selanjutnya pilih lagi pada Search Preferences. 

6. Lihat pada pilihan Monetization. Di bagian custom ads.txt, silahkan klik edit. 

7. Aktifkan custom ads.txt content dengan memilih "Ya", dan pastekan kode tulisan yang disalin tadi ke dalam kolom tersedia. 

Masukkan ads.txt pada pengaturan blogger

8. Terakhir klik simpan perubahan (save changes). 

Selamat, anda sudah berhasil mengatasi persoalan ini. Pada beberapa kasus, biasanya ada yang sudah menerapkan pengaturan ini namun tetap mendapat notifikasi masalah ads txt ini sehingga mungkin gerah dibuatnya. Jika sudah demikian, pastikan ads.txt di blog anda sudah aktif dengan cara mengeceknya melalui browser dengan mengetikkan link berikut ini:

https://alamatbloganda.com/ads.txt

Keterangan: Ganti tulisan berwarna merah dengan alamat blog anda. 

Jika kemudian muncul ads.txt blog anda, berarti tidak ada masalah. Anda bisa abaikan saja notifikasi yang muncul kembali.  Kalau anda dibuat risih karenanya, mungkin bisa coba untuk mencopot terlebih dulu pengaturan pada custom ads.txt content selama kira-kira tiga hari dan kemudian pasang kembali. Demikian. Semoga bermanfaat.

Selengkapnya
Cara Memperbaiki Posisi Gambar Postingan Blog Tampilan Mobile

Cara Memperbaiki Posisi Gambar Postingan Blog Tampilan Mobile


Saat memutuskan untuk mengganti tema blog, saya sempat mencoba beberapa template untuk saya pilih menjadi tampilan blog saya yang baru. Dengan memasangnya pada blog saya satunya yang memang sering saya jadikan tempat belajar otodidak untuk memahami beberapa fungsi kode pada template blog, saya coba memilih mana kiranya yang paling cocok untuk dipasang di blog saya ini. Beberapa template ini saya unduh dari tema-tema gratisan (bukan bawaan blogspot) yang banyak dibagikan oleh para blogger terpercaya sehingga aman dipakai tanpa efek samping berbahaya bagi blog. 

Sebenarnya semua template tersebut memiliki tampilan bagus-bagus dan punya kelebihan masing-masing, baik dari segi SEO, Responsive dan kecepatan loadingnya.

Namun dari mencobanya satu persatu dan mengamati tampilan pada blog, ada beberapa saya menemukan tampilan gambar pada postingan blog versi mobile yang membuat saya kurang sreg karena gambar tidak berada di tengah alias salah satu sisinya mepet ke pinggir layar. Mungkin ada di antara anda pembaca sekalian yang mengalami masalah seperti ini. Contoh tampilannya seperti berikut ini:

Posisi gambar kurang sedap

Perlu diketahui bahwa tampilan gambar tidak rata alias mepet ke samping layar ini biasanya hanya terjadi pada halaman postingan blog, sementara pada halaman beranda (home), tampilan gambarnya tidak ada masalah.

Dan perlu diketahui pula bahwa masalah ini juga hanya terlihat pada tampilan layar mobile (hp), sementara jika diakses lewat komputer (web) atau dibuka lewat tablet, tampilan gambarnya sudah betul alias rata tengah dan terlihat rapi. Namun jika diubah ke layar versi mobile, tampilan gambar tersebut tiba-tiba posisinya berubah menjadi tidak rata.

Sebenarnya bagi yang kurang jeli, hal ini tidak begitu kentara. Namun saat dicermati saat mengakses lewat seluler, tampilan gambar ini terlihat kurang nyaman sehingga mesti diperbaiki. Terlebih pengakses blog pada zaman sekarang banyak juga berasal dari kalangan pengunjung via handphone, atau bahkan lebih banyak pengaksesnya lewat seluler sehingga tampilan blog responsive dan mobile friendly juga harus diupayakan dan diutamakan agar blog kita semakin ramah bagi pengguna mobile dan disukai oleh semua kalangan pengunjung. 

Posisi gambar menjadi betul
posisi gambar diperbaiki

Bagaimana cara memperbaikinya? Berikut solusi dari saya untuk anda terapkan jika mengalami masalah seperti ini. 

1. Buka akun blogger anda. 

2. Pilih menu tema dan klik edit html. 

3. Backup template terlebih dulu jika perlu. 

4. Letakkan kode simpel berikut ini di area CSS template blog anda. 

.post-body img {display: block;float:center;width:300px;height:auto;}

Keterangan: ukuran 300px bisa anda ubah dan sesuaikan dengan ukuran pada blog anda, atau kalau bingung biarkan saja.

Sebenarnya, anda bisa saja meletakkan kode tersebut pada area global script CSS template blog anda. Namun jika ingin secara spesifik perbaikan pada versi mobile saja yang memang bermasalah, anda bisa terlebih dahulu mencari lokasi penempatan script CSS untuk ukuran responsive layar mobile yang ada pada template tersebut. Untuk mencari tahu bisa dilihat dengan mencari kode seperti berikut ini:

@media screen and (max-width:xxxpx) { ... 

Hal ini juga perlu diperhatikan karena pada kasus tertentu seperti yang pernah saya temui saat mencoba beberapa template, penerapan kode ini di area CSS global justru tidak bekerja, atau mungkin berhasil memperbaiki masalah pada tampilan mobilenya, namun tampilan versi webnya justru berubah menjadi tidak rata alias tampilan gambar gantian bermasalah.

Agar tidak terjadi hal demikian, maka tentukan dulu secara spesifik ukuran responsive untuk layar mobile pada area CSS template anda. Dari beberapa yang saya temui ternyata ukurannya berbeda-beda. Ada yang pakai max-width:384px, ada max-width:960px, dan mungkin ada lagi ukuran-ukuran lainnya. 

Untuk menentukannya anda bisa mencobanya satu persatu ukuran tersebut agar menemukan yang tepat. Misal untuk percobaan anda memilih ukuran @media screen and (max-width:384px), maka letakkan kode dari saya di atas setelahnya, sehingga menjadi seperti berikut ini:

@media screen and (max-width:384px) { .post-body img {display: block;float:center;width:300px;height:auto;} .......dst

5. Silahkan simpan kembali template blog anda. 

Jika setelah dicoba akses via mobile, tablet, dan web ternyata posisi gambar postingan masih bermasalah, maka pilih ukuran responsive lainnya. Coba satu persatu dengan penerapan seperti di atas sampai menemukan yang tepat. Setelah mendapati tampilan gambar pada postingan sudah sempurna sesuai yang diinginkan baik untuk versi mobile, tablet dan web, maka itulah penempatan yang anda cari. Demikian. Semoga bermanfaat.

Update! Cara termudah dan tidak perlu ribet mencari kode ukuran responsive. Ukuran gambar akan menyesuaikan dengan lebar postingan. Silahkan gunakan kode di bawah ini dan letakkan di dalam area CSS global. Bisa juga anda letakkan di atas kode ]]></b:skin> atau </style>. Berikut kodenya:

.post-body img {display:block;width:100%;height:auto;}

Selengkapnya
Cara Mengintegrasikan Kotak Pencarian Dengan Hasil Pencarian dari Google Custom Search

Cara Mengintegrasikan Kotak Pencarian Dengan Hasil Pencarian dari Google Custom Search


Setiap fitur kelengkapan pada blog tentunya mempunyai fungsi penting nan diperlukan sehingga mesti diperhatikan keberadaannya. Kotak pencarian atau penelusuran (Search Box) adalah satu di antaranya. Mesin untuk mencari sesuatu di dalam isi blog ini memang cukup penting keberadaannya, karena fungsinya untuk memudahkan pengunjung jika hendak mencari suatu bahasan, baik itu berhubungan dengan artikel yang sebelumnya dia baca atau ingin mengetahui lebih lanjut bahasan apa saja yang ada di blog kita dengan melihat beberapa konten isi blog kita. 

Banyak tutorial cara membuat kotak pencarian untuk bisa dipasang di blog dengan berbagai bentuk tampilan disesuaikan dengan selera anda. Atau mungkin bagi anda pemakai template blog tertentu, sudah tersedia fitur pencarian ini sehingga anda tidak perlu repot-repot membuatnya secara mandiri.

Namun selain kotak pencarian hasil buatan dimana banyak dibagikan tutorialnya, ada satu fitur penelusuran dari Google yang bisa dipasang di blog kita yakni Google Custom Search (GCS) atau Google Custom Search Engine (CSE). 

Dengan beberapa kelebihannya, banyak blogger menyarankan penggunaan fitur google pencarian khusus ini. Di antara beberapa kelebihannya yaitu karena hasil pencarian lebih relevan dan lebih lengkap dibanding fungsi dari pencarian biasa.

Terlebih lagi bagi Publisher Google AdSense, anda juga dapat dengan mudah memonetasi blog anda dengan kotak penelusuran khusus ini. Nantinya, iklan AdSense akan ditampilkan di halaman hasil pencarian saat terbuka. Jika anda tertarik hendak membuat GCS ini, silahkan anda bisa kunjungi di https://cse.google.com/cse/

Bagi yang sudah membuatnya, mungkin ada yang kurang sreg dengan tampilan kotak penelusuran GCS saat telah dipasang. Entah itu berhubungan dengan template atau karena hal lain, biasanya tampilannya tidak rapi sehingga kurang sedap dipandang. Di sisi lain, kita mempunyai kotak penelusuran lain dari template atau buatan dengan tampilan keren tapi hasil pencariannya terlalu singkat, monoton dan biasa saja.

Oleh karenanya, pada postingan kali ini saya akan berbagi pengetahuan dari apa yang baru saja saya praktekkan yaitu cara mengintegrasikan Kotak Pencarian dengan Hasil Pencarian dari Google Custom Search (GCS). 

pencarian google khusus

Untuk mengikuti tutorial ini, saya asumsikan bahwa anda sudah membuat dan memasang widget Google Custom Search Engine (CSE) di Blog anda. Sebetulnya memang telah tersedia mesin pencari dengan tampilan standar tertentu dari kita mendaftar GCS ini. Namun jika anda tidak begitu menyukai tampilan kotak penelusuran dari GCS ini, anda bisa mengintegrasikannya dengan kotak pencarian lain di template blog anda atau widget kotak penelusuran anda.

Jika sudah terintegrasi, anda bisa menghapus widget (kotak telusur) dari Google Custom Search yang terpasang sebelumnya karena fungsinya sudah tergantikan oleh kotak pencarian yang sudah terintegrasi.

Sebagai buktinya, anda bisa melihat kotak penelusuran di blog saya. Kotak penelusuran pada blog saya ini memang murni bawaan template, tapi ketika anda mengetikkan keyword pencarian di fitur tersebut, hasil pencarian akan beralih kepada hasil pencarian dari Google Custom Search.

Hasil pencariannya pun menjadi lebih lengkap, bisa dimonetisasi, dan kotak pencarian tetap terlihat keren karena sesuai dengan keinginan. Hal ini juga berlaku bagi kotak pencarian dari tutorial yang ada. Bagaimana cara mengintegrasikan atau dengan kata lain menambahkan fungsi Google Custom Search pada Search box?, ikuti langkah-langkah berikut ini: 

1. Buka akun blogger anda. 

2. Pilih tema klik edit html. 

3. Untuk jaga-jaga kalau error silahkan backup terlebih dulu template. 

4. Cari kode html dari kotak penelusuran untuk diintegrasikan dengan hasil pencarian dari GCS. 

5. Jika sudah ketemu, langkah berikutnya yaitu mengeditnya. 

Masing-masing kode untuk search box ini memang berbeda-beda, tetapi susunan kode pembuatannya hampir sama sehingga bisa dipahami dengan mudah untuk mengeditnya. Sebagai contoh saya tampilkan punya saya berikut ini. 

html search box

Beberapa kode untuk search box ini mungkin ada yang lebih panjang, namun fungsi utamanya sama sehingga anda tidak perlu bingung dibuatnya. Perhatikan kode pada template saya di bawah ini

<div class='serching'><form action='/search?q='><input class='serch' name='q' placeholder='Cari...' title='Cari Tulisan di Sini' type='text'/><button class='serchg' type='submit'> GO </button><span style='clear: both;display:block'/></form></div>

  • Perhatikan yang ditandai warna merah "<form action='/search?q='>", atau kode sejenis pada blog anda mungkin seperti ini:
<form action='http://www.google.com/search' method='get' target='_blank'>
  
Ganti kode tersebut dengan kode berikut ini:

<form action='URL postingan Search Results' id='cse-search-box'>

Keterangan: Ganti tulisan berwarna merah dengan URL postingan hasil pencarian (pada halaman statis) dari Google CSE yang sudah terpasang di blog anda. 

  • Setelah itu, tambahkan lagi tepat di bawahnya kode berikut ini:

<input type='hidden' name='cx' value='partner-pub-008XXXXXXXXXXXXXXXXXX:xxxxxxxxxx' />
<input type='hidden' name='cof' value='FORID:10' />
<input type='hidden' name='ie' value='ISO-8859-1' />

Keterangan: ganti tulisan ditandai warna merah dengan Search engine unique ID (GCS) anda. Untuk mencarinya buka kembali https://cse.google.com/cse/ dan lihat pada pilihan dasar-dasar:

ID GSC


  • Sehingga setelah semua ditambahkan, hasil lengkapnya menjadi berikut ini:

<div class='serching'><form action='https://bloganda.com/p/hasil-pencarian_65.html' id='searchform' target='_blank'>
<input name='cx' type='hidden' value='008XXXXXXXXXXXXXXXXXX:xxxxxxxxxx'/>
<input name='cof' type='hidden' value='FORID:10'/>
<input name='ie' type='hidden' value='ISO-8859-1'/><input class='serch' name='q' placeholder='Cari...' title='Cari Tulisan di Sini' type='text'/><button class='serchg' type='submit'> GO </button><span style='clear: both;display:block'/></form></div>

6. Silahkan simpan kembali template anda. 

Sekarang kita bisa lihat hasilnya dengan mengetesnya pada kotak pencarian. Hasil pencarian pun telah terintegrasi dengan hasil pencarian dari Google Custom Search.

Oya karena fungsinya sudah tergantikan, anda bisa hapus saja widget search box dari GCS yang sebelumnya terpasang di blog anda. Demikian. Selamat mencoba. 

Selengkapnya
7 Destinasi Wisata Curug (Air Terjun) Keren di Purworejo (Bag. Kedua)

7 Destinasi Wisata Curug (Air Terjun) Keren di Purworejo (Bag. Kedua)


Membahas tentang air terjun memang tidak ada habisnya. Sering kali sulit untuk bisa menggambarkan keindahan panorama air terjun yang cantiknya bak surga tersembunyi di tengah-tengah hutan belantara.

Air terjun atau biasa disebut Curug adalah formasi geologi dari arus air yang mengalir melalui suatu formasi bebatuan dan jatuh ke bawah dari ketinggian. Seperti halnya yang ada di Kabupaten Purworejo, beberapa air terjun terbentuk di lingkungan pegunungan dimana erosi kerap terjadi. Meski sama-sama indah, setiap masing-masing air terjun tersebut tentunya menawarkan pemandangan berbeda antara satu dengan lainnya. 

Pada artikel sebelumnya, telah kami sebutkan 7 Wisata Air Terjun Menakjubkan yang ada di Kabupaten Purworejo. Pada artikel edisi kedua ini, akan kami sebutkan 7 air terjun menakjubkan lainnya di Kabupaten Purworejo untuk melengkapi daftar pada edisi sebelumnya.

1. Curug Loning


Curug Loning
via detik.com

Curug pada daftar pertama ini merupakan curug yang berada di Desa Loning, Kecamatan Kemiri. Untuk menuju lokasi, kita mesti siap berbasah-basahan karena akses ke lokasi ini harus melalui sungai terlebih dahulu. Curug yang juga dikenal dengan nama Curug Silumut ini memiliki aliran air terjun cukup deras yang jatuh dari ketinggian. Debit airnya bahkan tetap ada saat musim kemarau.

Keunikan air terjun ini juga memiliki dinding tebing cukup lebar dan tinggi serta kontur bertingkat sehingga membuat aliran curug terlihat semakin indah. Ada dua tingkatan curug bagian atas dan bawah yang sama-sama menakjubkan. Anda bisa bermain air sepuasnya di lokasi air terjun dengan panorama menggagumkan ini. 

2. Curug Kalisat


Curug Kalisat
via instagram/ ita_erlina

Jika anda menginginkan wisata air terjun dengan pemandangan serasa berada di Grand Canyon, Curug Kalisat bisa menjadi destinasi wisata yang sayang untuk dilewatkan. Pada awalnya, curug yang berada di Desa Redin, Kecamatan Gebang ini merupakan tempat bermain air bagi anak-anak yang tinggal di sekitar curug. Namun seiring waktu banyak pula pengunjung yang tergoda untuk menyusuri keberadaan curug elok nan mempesona ini.

Di tempat ini, kita bisa menyaksikan jatuhnya air dari ketinggian sekian meter dibingkai dengan panorama tebing berpola unik yang mengelilingi Curug Kalisat ini. Selain itu, anda juga bisa mengunjungi Curug Watu Lawang dan wisata Kedung yang masih berada di sekitar lokasi tempat ini. 

3. Curug Padusan


Curug Padusan
via ghozaliq.com

Sesuai sebutannya, nama curug ini diambil dari kata bahasa Jawa 'padusan' yang berarti tempat untuk mandi dalam artian bermain air atau menceburkan diri. Curug Padusan berada di Desa Benowo, Kecamatan Bener. Di tempat ini, kita bisa menyaksikan indahnya air terjun yang mengalir dari tebing batu setinggi 20 meter. Di bagian bawahnya terdapat kolam untuk kita menceburkan diri dan merasakan segarnya air terjun di tempat ini.

Di sekitar air terjun juga terdapat spot-spot foto menarik seperti jembatan dan kursi bambu di tepian kolam untuk pengambilan foto keren. Selain Curug Padusan, anda juga bisa mengunjungi Curug Batur dan Petilasan Pangeran Benowo masih berada di sekitar lokasi yang sama.

4. Curug Semrico dan Kedung Gulo


Curug Semrico & Kedung Gulo
via kalitapas.files.wordpress.com

Kedua curug nan mempesona ini berada di Desa Kalitapas, Kecamatan Bener. Curug Semrico memiliki rute yang cukup mudah dijangkau karena sudah dibikin jalan setapak berlapis semen untuk menuju lokasi. Sedangkan untuk menuju Curug Kedung Gulo kita mesti berjalan kurang lebih 9 menit melewati jalanan tanah setapak dan masuk hutan untuk sampai di lokasi.

Kedua curug ini sama-sama cantik meski memiliki ketinggian air terjun yang berbeda. Airnya jernih dan terasa segar saat kita menceburkan diri di curug ini. Alamnya juga masih asri sehingga sangat cocok untuk melepas penat dan menyegarkan pikiran. 

5. Curug Kembar Mayang


Curug Kembar Mayang
via jadwaltravel.com

Beralih ke kecamatan Kaligesing, di sini kita akan menjumpai air terjun cantik yang berada di desa Donorejo. Curug yang masih searah dengan wisata goa Seplawan ini cukup mudah dijangkau dengan jalan kaki sekitar 10 menit dari area parkir. Curug ini menyajikan keindahan air terjun berpadu dengan alam nan asri.

Curug Kembar Mayang memiliki keunikan tersendiri karena memiliki 2 aliran air terjun yang sangat menakjubkan sehingga disebut Kembar Mayang. Di sini, kita bisa menyaksikan air yang jatuh dari atas tebing menuju kolam cukup luas di bawahnya. Airnya juga sangat jernih sehingga kita bisa menyegarkan diri dengan berenang di sana. 

6. Curug Purbayan


Curug Purbayan
via ihategreenjello.com

Berlokasi di Desa kemiri, Kecamatan Purworejo, Curug Purbayan menjadi salah satu destinasi wisata air terjun yang sayang untuk anda lewatkan. Perjuangan cukup melelahkan saat melewati jalanan licin dan berbatu menuju lokasi akan terbayarkan saat telah sampai di lokasi curug yang memang tersembunyi ini.

Curug Purbayan menyuguhkan keindahan air terjun dan kesegaran airnya yang membuat para wisatawan semakin betah untuk berlama-lama bermain air di wisata curug ini. Banyaknya pepohonan di sekitar lokasi air terjun ini juga membuat suasana semakin teduh dengan udara sejuk dan pemandangan alam yang benar-benar mengagumkan. 

7. Curug Sedayu/ Klanceng Putih


Curug Sedayu
via travelingyuk.com

Curug pada daftar terakhir ini merupakan curug yang masih sangat alami dan letaknya tersembunyi sehingga belum banyak dikenal orang. Curug yang berada di Desa Sedayu, Kecamatan Loano ini memang masih sepi pengunjung sehingga cocok bagi anda yang menginginkan ketenangan saat berlibur. Aksesnya juga lumayan sulit karena harus menembus hutan untuk sampai di lokasi.

Meski begitu, panorama alam berupa air terjun yang disuguhkan di tempat ini begitu menakjubkan sehingga anda akan betah berlama-lama di tempat ini. Selain itu, pemandangan alam di sekitar tempat ini juga masih asri sehingga sangat cocok untuk mengisi liburan anda. 

Itulah 7 Destinasi Wisata Curug (Air Terjun) Keren di Purworejo. Semoga bermanfaat. 

Selengkapnya