Cara Mengubah Tampilan Waktu Menjadi Timeago di Blogger

Tutorial dengan label "WEB CODE" kali ini akan membahas tentang timeago (JavaScript - jQuery) untuk versi blogspot, atau mengubah fitur waktu di post info agar berubah menjadi hitungan waktu berlalu saat artikel dipublikasikan.

Contohnya apa bila anda mambuat posting baru ataupun mengedit suatu postingan artikel, timestamp akan berubah seiring waktu setelah kalian mengubah artikel/posting tersebut seperti "2 jam yang lalu, 1 menit yang lalu, 1 bulan yang lalu, mauppun 10 tahun yang lalu". Format penulisan waktu seperti ini biasanya sering kita jumpai pada beberapa situs sosmed atau situs-situs web besar lainnya.

Tutorial Membuat Tampilan Waktu Menjadi Timeago di Blogger :

• Pertama, Login Blogger.com > Tema > Edit HTML lalu carilah kode semacam ini

  expr:datetime='data:post.date.iso8601'

  Kemungkinan tampilann utuhnya akan semacam ini

  <time expr:datetime='data:post.date.iso8601' expr:title='data:post.date'><data:post.date/></time>

  Jika kode tersebut sudah ada, silahkan di lewati saja. Namun, jika tidak ada silahkan tambahkan kodenya.


• Jangan lupa tambahkan pemanggilan jQuery jika belum ada. Diletakkan sebelum </body>.

  <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js'></script>

• Selanjutnya, silahkan tempel kode di bawah ini sebelum </body> atau di bawah pemanggilan jQuery yang di atas.

  <script>
      $(function(){
          $('[datetime]:not(.timeago)').each(function() {
              var $this = $(this);
              var data_timeago = $this.attr('datetime');
              $this.addClass('timeago');
              if(!$this.attr('title')) {
                  $this.attr('title', data_timeago);
              }
              $this.text(get_timeago(data_timeago));
          });
      });
      function get_timeago(t) {
          var e = new Date(t),
              a = 36e5,
              o = 24 * a,
              s = 30 * o,
              i = 365 * o,
              n = "yang lalu",
              l = new Date - e;
          return l < 6e4 ? Math.round(l / 1e3) + " detik " + n : l < a ? Math.round(l / 6e4) + " menit " + n : l < o ? Math.round(l / a) + " jam " + n : l < s ? Math.round(l / o) + " hari " + n : l < i ? Math.round(l / s) + " bulan " + n : Math.round(l / i) + " tahun " + n
      }
  </script>

• Jika semua sudah diterapkan, silahkan untuk disimpan (save).
• Cobalah reload postingan yang sudah ada dan silahkan lihat hasil-nya.

Sekian tentang tutorial kali ini "Cara Mengubah Tampilan Waktu Menjadi Timeago di Blogger". Sebenernya kode ini juga bisa di terapkan di berbagai CMS seperti WordPress dan lainnya, juga pada Non-CMS. Silahkan di Utak Atik sendiri.. hihihi
Sekian dan Terimakasih.

timeago js, cara membuat timeago di blog, cara membuat timeago di wordpress