Cara Membuat Popular Post di Blogspot Seperti VioMagz

Pada artikel ini, akan dijelaskan tentang cara membuat popular post di blogspot seperti Viomagz. Jika anda ingin menggunakannya, lihat cara dibawah ini. Untuk cara membuatnya tidak sulit, hanya saja anda harus mengganti CSS popular post anda dengan CSS popular posts dibawah ini. Simak cara menerapkannya dibawah ini.

  • Login di akun blogger anda
  • Cari menu “Tema”, dan piilih “Edit HTML”
  • Paste code CSS ini sebelum </style> atau </b:skin>

/* Popular Posts */ .PopularPosts .widget-content ul, .PopularPosts .widget-content ul li {  margin:0 0;  padding:0 0;  list-style:none;  border:none;  outline:none; } .PopularPosts .widget-content ul {  margin: 0;  list-style:none;  counter-reset:num; } .PopularPosts .widget-content ul li img {  display: block;  width: 70px;  height: 70px;  float: left; } .PopularPosts .widget-content ul li {  margin: 0 0 10px;  counter-increment: num;  position: relative; } .PopularPosts ul li:last-child {  margin-bottom: 0px; } .PopularPosts ul li .item-title a, .PopularPosts ul li a {  font-weight: 500;  text-decoration: none;  color: #444; } .PopularPosts ul li .item-title a:hover, .PopularPosts ul li a:hover {  color: #49ACE1; } .PopularPosts ul li .item-thumbnail-only:before, .PopularPosts ul li .item-content:before, .PopularPosts ul li > a:before {  font-size: 30px;  font-weight: 500;  display: block;  position: absolute;  top: 0;  left: 0;  bottom: 0;  background: linear-gradient(#49ACE1, #fff);  width: 26px;  padding-top: 10px;  text-align: center;  content: counter(num);  color: #fff; } .PopularPosts ul li > a {  display: block;  padding-left: 32px;  min-height: 45px; } .PopularPosts .item-title, .PopularPosts .item-thumbnail, .PopularPosts .item-snippet {  margin-left: 32px; } .PopularPosts .item-title {     line-height: 1.6;  margin-right: 8px;  min-height: 40px; } .PopularPosts .item-thumbnail {  float: left;  margin-right: 8px; } .PopularPosts .item-snippet {     line-height: 1.6em;  font-size: 14px;  margin-top: 8px; }

Baca Juga :  Fitur Terbaik Hosting InfinityFree untuk Website Anda

 

Perlu diperhatikan, sebelum anda meletakan code ini, anda hapus dahulu code popular post yang lama, dan ganti yang baru, supaya bisa lebih rapi. Itulah cara singkat tentang cara membuat popular post di blogspot seperti Viomagz, semoga bermanfaat.

Cek Tutorial Lengkap Disini :

Baca Juga :  Cara Membuat Favicon Versi Terbaru di Blogger