Cara Membuat / Menampilkan Display Post Views Count di Blogger

Cara Membuat / Menampilkan Display Post Views Count di Blogger . Sebagian Blog sekarang banyak yang menampilkan hitungan posting yang diliha... thumbnail 1 summary

16.18.00

Cara Membuat / Menampilkan Display Post Views Count di Blogger. Sebagian Blog sekarang banyak yang menampilkan hitungan posting yang dilihat atau dibaca pengunjung secara dinamis untuk tampilan halaman individu. Untuk WordPress sudah plugin yang menyediakan count posting. Namun di blogspot masih belum banyak yang menggunakanKita sekarang dapat dengan mudah membuat posting ini tanpa khawatir tentang server atau server code. Dengan layanan gratis seperti Firebase kini Anda dapat membuat plugin dinamis.

Firebase diluncurkan pada bulan April 2012 dan sejak saat itu telah menjadi hub untuk pengembang.
Rencana ini gratis diberikan kepada anda 10GB bandwidth dan penyimpanannya gratis 5GB.
Kami sangat beruntung untuk memanfaatkan layanan gratis ini diplatform blogger . Tutorial ini akan membantu Anda untuk menginstall script yang dinamis yang secara otomatis akan hitungan ketika pengunjung melihat posting blog Anda. Penghitung data akan disimpan pada database gratis yang disediakan oleh Firebase.
Catatan: Hitungan postviews berubah ketika Anda me refresh halaman blog dan akan berubah hanya ketika Anda mengunjungi setiap posting.

Cara membuat count views posting blog
1. Buat Akun Firebase Anda
Klik sign up now!

Dalam rangka untuk mendapatkan akses ke database gratis dan dapat menyimpan cadangan postviews Penghitung data Anda, Anda harus mendaftar untuk account gratis di Firebase.

Mengisi langkah mudah bijaksana dan kemudian setelah account Anda telah diaktifkan, Anda harus membuat database Firebase pertama Anda.

2. Buat Database Firebase
Anda dapat membuat 2 firebases. Pada hadir hanya membuat satu, kami akan memandu Anda nanti dalam posting mendatang tentang hal-hal menakjubkan yang dapat Anda bermain dengan layanan gratis ini.
1.sisi kanan bawah account Anda, Anda akan menemukan menyerahkan kotak berikut.
2.Inside kotak masukan nama website Anda. Dalam kasus saya saya dimasukkan mybloggertricks dan ini dihasilkan URL firebase berikut: https://thegressnews.firebaseio.com

3.Terakhir tekan tombol membuat dan mencatat URL firebase Anda.

3. Instalasi Plugin Postviews

     1.Masuk Blogger > Template
     2.Backup template Anda
     3.Klik Edit HTML
     4.Centang kotak "Expand widget Template"
     5.Cari ]]> </ b: skin>
     6.Tepat di atas itu paste kode CSS berikut:

/*-------- Post Views ----------*/
    #views-container {
    width: 85px;
    float: right;
    }

    .mbtloading {
    background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhM4Y11zEe8pDb9HGytGDjZjJOu2iDTUi4voKCPnLcei4wqrEUwYdTrleySN1S9KKUAOhYTYK2daMMIurl7WzEcXlOIaji28fC-115phOODJPix72x9rFGI5UpRIR8QaSTsSB_dj6NJB4KV/s320/mbtloading.gif') no-repeat left center;
    width: 16px;
    height: 16px;
    }

    .viewscount {
    float: right;
    color: #EE5D06;
    font: bold italic 14px arial;
    }

    .views-text {
    float: left;
    font: bold 12px arial;
    color: #333;
    }

    .views-icon{
    background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhX_K5LNQbJEHlul-cLJHvdWBQ44Epp7r0U5rKh_0_O9k3vgSfYAf-fHolYmjG_7Jx5NI9Wp4Z82hQJcuvtn9_HfYmdmgPfO-lThb3564Col9uLmPpZbv1LOPqbHdGEYWqaTrXH0Rl3xTj5/s1600/postviews.png') no-repeat left;
    border: 0px;
    display: block;
    width: 16px;
    height: 16px;
    float: left;
    padding: 0px 2px;
    }

7.Pencarian berikutnya untuk </ body> dan di atasnya paste kode JavaScript berikut:

<script type='text/javascript'>
    window.setTimeout(function() {
        document.body.className = document.body.className.replace('loading', '');
      }, 10);
</script>
<script src='https://cdn.firebase.com/v0/firebase.js' type='text/javascript'/>
<script>
$.each($('a[name]'), function(i, e) {
var elem = $(e).parent().find('#postviews').addClass('mbtloading');
var blogStats = new Firebase("https://thegressnews.firebaseio.com/pages/id/" + $(e).attr('name'));
blogStats.once('value', function(snapshot) {
var data = snapshot.val();
var isnew = false;
if(data == null) {
data= {};
data.value = 0;
data.url = window.location.href;
data.id = $(e).attr('name');
isnew = true;
}
elem.removeClass('mbtloading').text(data.value);
data.value++;
if(window.location.pathname!='/')
{
if(isnew)
blogStats.set(data);
else
blogStats.child('value').set(data.value);
}
});
});
</script>

8. Sekarang satu langkah terakhir. Cari kode ini:

<data:post.body/>

9. Tepat di atas itu paste HTML berikut.

<div id='views-container'><span class='views-icon'/><div class='views-text'>Views:</div> <div class='mbtloading viewscount' id='postviews'/></div>

10. Sekarang langkah terakhir, paste link jquery berikut tepat di bawah <head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>

11. Selesai

Copyrights
Pengembang dan blogger dipersilakan untuk berbagi Plugin ini dengan pembaca. Mohon cantumkan MBT blog. Dibutuhkan berjam-jam upaya untuk menulis dan debug skrip ini.
Plugin ini datang di bawah Commons Attribution-Noncommercial-No Derivative Works 3.0 Unported License Creative.
Source Code : Copied code
Developer : Ahmed Nasir