Guide to creating popular posts for blogger

Hello everyone. I am not good at English but I am a person who likes to share the tricks or for everyone. If you do not understand, you can comment below the article and I will try to answer your good posts

This article shares tips to create the most popular posts for blogger. Would we start

Popular post is 1 widget is a lot of Blogger users to use, this is the widget for the popular posts are many people read on your blog. Free use of blogger to website design will help your website more professional.

Step 1: Add popular post gadget

Make sure your blog has this: If Popular Posts widgets then please add to blog and installed Sign in to blogger >> Layout >> Add a gadget >> Popular Post

You should post to show a maximum of 10 items

Step 2: Edit the style Popular pots:

/*POPULAR POST http://s5tricksblog.blogspot.com/*/
.top1, .top2, .top3, .top4, .top5, .top6, .top7, .top8, .top9, .top10 {border-bottom:1px dotted #ccc;padding-top:6px;font:bold 12px Tahoma;width:280px;margin-left:10px;font: bold 13px Tahoma;color:#FF6600}
.top1 {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEha94o0gvLrD_2Zpsn1yiC8ZhWBy1Y1qViolMTJ5ZdIpdXlPs8N9x-FodXJOutwm5f8jxLLThyphenhyphenduKDnj6u-CUyUeSEsaMTuSnDNt1H2qcbmGqG91R84j6PwFxEiUFiuDGJfoel_bbE1Xij2/h120/1-popular-namkna-blogspot-com.png) no-repeat left}
.top2 {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhev2u9kBGRXj0j0lkUHfSoTSPNYE-R17B2fIX8KuUvQwKZ12ZKkqmE75Vn-X6zDBBxtS0bW62rH58NzfZ4coFLtz3xQ7QHv-vmLQyLz3oGtzXsRLfx34qf0Tz-og_9kSJqCW7vEnfxPHMa/h120/2-popular-namkna-blogspot-com.png) no-repeat left}
.top3 {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7jmDctsiQBcqg8NVHAzxxaHFuWW6N061sEP-jrfLihzNHI-knl0E1-uXUZQpL41z5TZRBw23_HGFNHM6hpfhvGFyoLiqtThPJ1Zl-FpayTdqFGPm9p3_0St29I6cHlrZuzOykQ044EdUU/h120/3-popular-namkna-blogspot-com.png) no-repeat left}
.top4 {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMOyJ5cP5Vq8Xxx5QoP9Z5mBblBRcMGMhWpYBFdJOU-E4IqlvbH78ahjm7eTotY325yq0_BzhgvBKKI0zt6B9o1ZRSHPms-MQjiNZQDLLe3ux3wpaJxz2s8oDQCuEJKVJTYqvmfZMwGqMb/h120/4-popular-namkna-blogspot-com.png) no-repeat left}
.top5 {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqk5cLyk4Dk_eDS9ldW759FJHr97vcz2c8UK_3DiYQTw9_lvCApPMLayXmpOohEOmVX2CqzuOyvPohVmhmVLgvryJ3-GZsqEhJT_BAWjkn9NEsxaV1r3DU3qqv0Xxa-FSd83QMxHTNlWYM/h120/5-popular-namkna-blogspot-com.png) no-repeat left}
.top6 {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpfoOypmXe17dx9nbDxLUjVHiIbkqPPv9epmnj0PZexnXqVcCVdTyHalm3QyebNAhCpp_FyGrVFODyKRL2N-MiqUu_xVZ_2FHQQxuK1omo-YF_YSQO4SZy5W0Jv6GW5ckqf9SPbYefESfh/h120/6-popular-namkna-blogspot-com.png) no-repeat left}
.top7 {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfTjTiS9sSpR2t05I-CiTiA_tkFq_IyltODYFR4DAeGdTx8S8J8e1QBs4CkBqeYXcBbK61MtHaE8I1NCsxyA-1toh74JSqg91GRzx_up0C4i-WhEUh1XMJOwRGHcyxkFGh3vufvuwTfVCz/h120/7-popular-namkna-blogspot-com.png) no-repeat left}
.top8 {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCmvyu_RavZW53VSeub6i6eVDLf3Mgrg6D9LQa4FHL_FgIb2lVsWySEXs6rjw2_3WjEWm-MJD2ujEbxnaTzbL0djgX7lumjvf6WvBAUfDBUkz4fS4QTaVGp6g2EOollifG2DklNiDormXe/h120/8-popular-namkna-blogspot-com.png) no-repeat left}
.top9 {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFIZYSoyN1soJsSzSglNrz7ET2btzsEX92AbQJ-OT7q1SL1YJ12rH4anFGqjn-_D3OlRJ3P7j9nQFyhhEJMa9DcBy_mG394sFkshm0vu7rJhzLhZtCt89ejRKjTlZ8trpCfpEXbc9lCyrK/h120/9-popular-namkna-blogspot-com.png) no-repeat left}
.top10 {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4nP9LBIHOGqqi6pM3DuO6bEliMuw1fx2TpX_1XTIUCso_Gv87ZWDBWNG08wj8Je82lOdOoXpiIObIboEqnTYUWxBr5mdhywsl3Y2edB-WnoLo296LY1Q4EpdpLg3jc_QeIUYNKi9Pfu6h/h120/10-popular-namkna-blogspot-com.png) no-repeat left}
.widget-item-control {display:none}
.popular-posts ol{list-style-type:none;}
.popular-posts ol li a, .randoms ul li a {color:#333333}
.PopularPosts img { border: 1px solid #CCCCCC; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2); height: 65px;
margin-left: 27px; padding: 2px; z-index: -1;width: 90px;z-index:10}

2.5- Add the code after the first </head> :
Note: If your blog already have Jquery file and then delete the yellow.

2.6-continue to search the code of the popular add-on post as below:
<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'/>

Where: PopularPosts1 is the Id of the widget PopularPosts, depending on the Widget you want to apply different then have different Id like PopularPosts1, PopularPosts2, PopularPosts3, ....

-Replace the following code:

If the Id in step 2.6 blue PopularPosts1 be others in on the id.

Share Tips and Tricks

Guide to creating popular posts for blogger

Related Posts