Artikel terpopuler seringkali dijadikan sebuah menu wajib ada pada sebuah blog.
Kenapa demikian?
Selain menjadi salah satu faktor penilaian indexing yang dilakukan Google, widget di sidebar ini menjadi salah satu hal yang bisa memudahkan pembaca ketika ingin mengetahui artikel terpopuler di blog sobat.
Baca juga cara kerja seach engine Google dalam melakukan rangking terhadap sebuah blog.
Cara Mudah Modifikasi Desain Widget Populer Post di Sidebar Blog
Cara sederhana saja kok, cukup dengan menambahkan kode-kode di dalam template blog sobat, jadi dah.
1. Masuk akun blogger
2. Pilih template > mode HTML
3. Copas kode di bawah ini dan letakkan di atas kode ]]></b:skin> atau </style>
#PopularPosts1 h2{position:relative;padding:8px 10px 6px 10px;width:100%;margin-bottom: 5px;font-size:17px;color:#757575; text-align:left;}
#PopularPosts1 ul{list-style:none;counter-reset:li;padding:10px;left:-8px;width:90%;margin:0 15px}
#PopularPosts1 li{ width:100%;position:relative;left:0;margin:0 0 1px 12px;padding:4px 5px;}
#PopularPosts1 ul li:before{content: counter(li);counter-increment: li;position: absolute; left: -30px;top: 50%;margin-top: -13px;background: #777; height: 1.9em;width: 2em;line-height: 2em;text-align: center;font-weight: bold;color: #fff;font-size: 14px;}
#PopularPosts1 ul li:after{position: absolute;content: ”;left: -2px;margin-top: -.7em; top: 50%;width: 0;height: 0;border-top: 8px solid transparent;border-bottom: 8px solid transparent;border-left:10px solid #777;
/* background color of the right arrow*/}
#PopularPosts1 ul li a{color:#282b2b;text-decoration:none;font-size:14px;font-weight: 400;}
#PopularPosts1 ul li {position: relative;display: block;padding: .4em .1em .4em .8em;*padding: .4em;margin: .5em 0 .5em 0.4em;background: #fafafc;transition: all .3s ease-out;text-decoration:none;transition: all .1s ease-in-out;}
#PopularPosts1 ul li:hover{background: #eee; /* Background color on mouseover */}
#PopularPosts1 ul li a:hover{color:#444; /* Link color on mouseover */margin-left:3px;}
4. Save template
Mudah kan? DEMO
Baca juga Cara Modifikasi Judul (H2) Widget pada Sidebar dan Footer Blog
Demikian tips SEO design blog kali ini, khususnya Cara Modifikasi Desain Widget Populer Post di Sidebar Blog. Semoga bermanfaat. Salam.
Source:
http://blogromeltea.blogspot.co.id/2015/10/modifikasi-tampilan-widget-popular-post.html
