Langsung ke konten utama

Cara Membuat Recent Post Berdasarkan Label Di Blogger

Setelah sebelumnya saya sudah membuat popular post berdasarkan label, pada tutorial kali ini saya akan membagikan tutorial tentang cara membuat recent post berdasarkan label di blogger. Yang membedakan dari widget sebelumnya adalah antara widget popular atau populer yang hanya menampilkan artikel populer dan recent post atau artikel terbaru.

(Baca juga : Cara Membuat Widget Popular Post Berdasarkan Label di Blogger)

Ini memungkinkan visitor atau pengunjung blog untuk melihat serta memilih artikel dengan label atau kategori yang mereka sukai. Tidak hanya itu, script yang di pakai juga tidak terlalu banyak sehingga memudahkan kita mengatur widget recent post ini.
Cara Membuat Recent Post Berdasarkan Label Di Blogger

Masih sama seperti widget popular post per label, widget ini juga memiliki pengaturan yang memudahkan kita untuk menampilkan beberapa fitur yang ada di dalam widget ini. Untuk cara memasang widget recent post berdasarkan label di blogger, ikuti langkah-langkah dari saya berikut ini.

(Baca juga : Cara Membuat Recent Post Blogger Berdasarkan Label Seperti Evo Magz Template)

Cara Membuat Recent Post Berdasarkan Label Di Blogger

  1. Langkah pertama masuk ke akun Blogger agan.
  2. Pilih menu Tata Letak, kemudian pilih lokasi widget yang agan inginkan, klik Tambahkan Gadget, kemudian pilih HTML/JavaScript.
  3. Masukan Judul widgetnya, kemudian masukan kode di bawah ini tepat di kolom Konten.
  4. <style type="text/css">
    img.label_thumb{position:absolute;top:6px;left:0;float:left;height:50px;width:58px;}ul.label_with_thumbs{float:left;width:100%;margin: 0 0 0;padding:0;}ul.label_with_thumbs li{padding:6px 0px 6px 66px;position:relative;min-height:53px;margin:0 0 0 0;border-bottom:1px solid #eee;}ul.label_with_thumbs li:last-child{border-bottom:none !important;}.label_with_thumbs li{list-style:none;font-size:11px;color:#999;}.label_with_thumbs .title-label a{float:left;display:inline-block;font-weight:bold;font-size:13px;margin:0 0 3px;padding:0;color:#555;width:100%;}.label_with_thumbs a:hover{color:#0099cc;}.label_with_thumbs strong{padding-left:0px;}a.comment-label{font-size:11px;color:#999;}a.more-label{font-size:11px;color:#999;}
    </style>
    <script type='text/javascript'>
    var numposts = 6;
    var showpostthumbnails = true;
    var displaymore = false;
    var displayseparator = false;
    var showcommentnum = false;
    var showpostdate = false;
    var showpostsummary = false;
    var numchars = 0;
    </script>
    <script type="text/javascript" src="/feeds/posts/default/-/LabelAgan?orderby=updated&alt=json-in-script&callback=labelthumbs"></script>
    • Pengaturan Widget :
      • var numposts = 6; di gunakan untuk mengatur jumlah artikel yang akan di tampilkan, silahkan ganti dengan jumlah artikel yang agan ingin tampilkan.
      • var showpostthumbnails = true; di gunakan untuk mengaktifkan dan menonaktifkan gambar thumbails widget.
      • var displaymore = false; di gunakan untuk mengaktifkan dan menonaktifkan link readmore.
      • var showcommentnum = false; di gunakan untuk mengaktifkan dan menonaktifkan jumlah komentar pada artikel tersebut.
      • var showpostdate = false; di gunakan untuk mengaktifkan dan menonaktifkan waktu pembuatan artikel.
      • var numchars = 0; di gunakan untuk menampilkan jumlah karakter pada artikel.
      • true di gunakan untuk mengaktifkan fitur, false digunakan untuk menonaktifkan fitur yang ada.
      • Ganti LabelAgan dengan dengan label blog yang agan akan tambahkan.
  5. Setelah selesai mengatur, silahkan klik Simpan.
  6. Jika berhasil maka tampilan widget akan seperti ini.
    Membuat Grid Recent Post Berdasarkan Label di Blog


Demikian tutorial dari saya mengenai cara membuat recent post berdasarkan label di blogger. Jika ada pertanyaan mengenai widget ini, atau mengenai cara pemasangannya di blogger, silahkan masukan ke dalam kolom komentar.

Terima kasih sudah berkunjung di blog Tutorial Umum, semoga artikel di atas bermanfaat untuk agan atau sista semua. Untuk tutorial blogger dan widget blogger yang lainnya, silahkan tetap kunjungi blog Tutorial Umum.

Postingan populer dari blog ini

Cara Mudah Menghapus Database di phpMyAdmin

Kita tahu pentingnya sebuah database dalam sebuah program aplikasi yang kita buat. Namun jika terlalu banyak, kita akan kesulitan dalam memfilter database yang ada. Apalagi jika nama databasenya hampir mirip dengan database yang lain. Namun saat kita ingin menghapus database tersebut, kita kebingungan karena kita tidak menemukan cara untuk menghapus database tersebut. Untuk itu, pada tutorial kali ini saya akan memberikan tutorial tentang cara menghapus database di phpmyadmin . (Baca juga :  Cara Import Database MySql phpMyAdmin dengan Mudah ) Bagaimana cara menghapus database ? Sebetulnya sangatlah mudah bagi yang sudah sering memakai phpMyAdmin, tapi sangat sulit bagi yang tidak biasa atau baru memakai phpMyAdmin. Disinilah saya akan membahasnya dengan cara yang mudah. Selanjutnya ikuti langkah-langkah dari saya. Cara Menghapus Database di phpMyAdmin Pertama pastinya kalian harus membuka phpMyAdmin terlebih dahulu di browser. Setelah berada di tampilan awal phpMyAdmin, silahkan ...

Cara Membuat Widget Recent Comments Ringan di Blog

Widget recent comments berfungsi untuk memperlihatkan komentar terakhir dari para pengunjung dan admin. Widget Recent Comments adalah widget yang di perlukan di setiap blog. Karena dengan widget ini menandakan bahwa blog tersebut masih aktif dan memiliki banyak pengunjung. Widget ini masih terbilang simple dan ringan, sehingga kalian tidak perlu takut dengan loading blog kalian. (Baca juga : Cara Membuat Widget Komentator Terbaik di Blogger ) Untuk cara memasangnya ikuti langkah-langkah dari saya berikut ini. Cara Memasang Widget Recent Comments Ringan di Blog Langkah pertama masuk ke akun blogger kalian Pilih menu Tema, lalu pilih Edit HTML Masukan skrip di bawah ini sesudah kode <head> atau sebelum kode </head> <script type='text/javascript'> //Recent Comments Settings var numComments = 5 ; var characters = 60; </script> <script type='text/javascript'> //<![CDATA[ //Recent Comments var numComments=numComments||5,characters=characte...