Membuat rekayasa jumlah view post blogger menggunakan realtime database

hi, kali ini admin akan membagikan source code bagaimana membuat rekayasa postview , Ya Bisa?
admin menggunakan realtime database untuk menyimpan hasil counter.
mohon diperhatikan cara tata letak penempatan kode kode dibawah ini
code ini ini harus ditempatkan diatas tag </body>


<script async='async' type='text/javascript'>
    //<![CDATA[
    $.each($(".post-view[data-id]"), function(a, e) {
        var l = $(e).parent().find("#postviews").addClass("view-load"),
            i = new Firebase("https://GANTIDENGANDATABASEANDA.firebaseio.com/pages/id/" + $(e).attr("data-id"));
        i.once("value", function(a) {
            var n = a.val(),
                t = false;
            if (n == null) {
                n = {};
				n.value = Math.floor(Math.random() * 0);
                n.url = window.location.href;
                n.id = $(e).attr("data-id");
                t = true;
            }
            l.removeClass("view-load").text(n.value);
            var randomIncrement = Math.floor(Math.random() * 1000) + 1; // Generate random number between 1 and 1000
            n.value += randomIncrement;


var unwantedUrlKeyword = "search";

if (window.location.pathname !== "/") {
    // Memeriksa apakah URL mengandung kata kunci yang tidak diinginkan
    if (!window.location.href.includes(unwantedUrlKeyword)) {
        if (t) {
            i.set(n);
        } else {
            i.child("value").set(n.value);
        }
    }
}


        })
            
    });
    //]]>
</script>

Ganti tulisan GANTIDENGANDATABASEANDA dengan url database anda harus yang beralamat url.firebaseio.com
Jika anda menginginkan post view normal ubah 1000 menjadi 1
Jika anda ingin memulai dari sesuatu angka ubah n.value = 0 menjadi 100 dll
hasil counter hanya akan menghitung jumlah klik di post dan mencegah menghitung jika url search muncul

perhatikan url yang harus dicopy

Jangan lupa mengubah Rules menjadi

{
  "rules": {
    ".read": "true",
    ".write": "true",
  }
}

Copy paste kode dibawah ini dan tempel di Theme/Custom Edit html dibawah <head>dan simpan

  <script src='https://cdn.jsdelivr.net/npm/lightgallery/dist/js/lightgallery.min.js'/>
  <script src='https://cdn.jsdelivr.net/npm/lg-thumbnail/dist/lg-thumbnail.min.js'/>
  <link href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css' rel='stylesheet'/>
  <script src='https://www.gstatic.com/firebasejs/9.0.2/firebase-app-compat.js'/>
  <script src='https://www.gstatic.com/firebasejs/9.0.2/firebase-auth-compat.js'/>
  <script src='https://cdn.jsdelivr.net/npm/sweetalert2@10'/>
  <script src='https://www.gstatic.com/firebasejs/9.6.1/firebase-storage-compat.js'/>
  <script src='https://www.gstatic.com/firebasejs/9.6.0/firebase-firestore-compat.js'/>
  <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js' type='text/javascript'/>
  <script src='//cdn.firebase.com/js/client/2.2.1/firebase.js' type='text/javascript'/>

    <!-- Include Firebase SDK -->
    <script>
        // Masukkan kode firebaseConfig dibawah ini
  const firebaseConfig = {
  apiKey: &quot;AIzaSy....&quot;,
  authDomain: &quot;karirid...com&quot;,
  databaseURL: &quot;https://.....&quot;,
  projectId: &quot;karir...&quot;,
  storageBucket: &quot;karir....com&quot;,
  messagingSenderId: &quot;...&quot;,
  appId: &quot;1:843...:web:063...&quot;,
  measurementId: &quot;G-5...&quot;
};
      
  // Inisialisasi Firebase
  firebase.initializeApp(firebaseConfig);

  // Mendapatkan referensi Firestore
  const firestore = firebase.firestore();
      
  // Mendapatkan referensi autentikasi Firebase
  const auth = firebase.auth();
      
const storage = firebase.storage();
      </script>

Perhatikan kode agar disesuaikan dengan project firebase anda


    <!-- Include Firebase SDK -->
    <script>
        // Masukkan kode firebaseConfig dibawah ini
  const firebaseConfig = {
  apiKey: &quot;AIzaSy....&quot;,
  authDomain: &quot;karirid...com&quot;,
  databaseURL: &quot;https://.....&quot;,
  projectId: &quot;karir...&quot;,
  storageBucket: &quot;karir....com&quot;,
  messagingSenderId: &quot;...&quot;,
  appId: &quot;1:843...:web:063...&quot;,
  measurementId: &quot;G-5...&quot;
};

diganti dengan script pemberian Firebase

untuk menampilkan hasilnya silahkan kopi paste kode berikut di tempat postingan anda


<span class='post-view' expr:data-id='data:post.id' style='margin-left:40px'>
 
<a expr:name='data:post.id'/> <i class='fa fa-eye'/> <span class='view-load' id='postviews'/></span>

Dan SELESAI

Lihat Demo
Jika ada pertanyaan silahkan gunakan koment dibawah

Membuat rekayasa jumlah view post blogger menggunakan realtime database

Related Posts

1 comment