Popular Post widget blogger by mybloggerseo

popular post numbered widget blogger my blogger seo


Popular post by mybloggerseo Modified  isso vai trazer um layout mais bonito para seu Template e também vai dar um destaque a mais em seu template se deseja colocar no seu Blogger isso é facil apenas siga os passos abaixo: 

Faça login no Blogger:
Va no menu modelo então editar HTML/JavaScript 
com as teclas combinadas CTRL+F busque por ]]></b:skin> ou </style> e logo acima disso copie e cole o seguinte código: 



/* Popular Post by mybloggerseo*/
.PopularPosts ul,
.PopularPosts li,
.PopularPosts li img,
.PopularPosts li a,
.PopularPosts li a img {
margin:0 0;
padding:0 0;
list-style:none;
border:none;
background:none;
outline:none;
}
.PopularPosts ul {
margin:.5em 0;
list-style:none;
color:black;
counter-reset:num;
}
.PopularPosts ul li img {
display:block;
margin:0 .5em 0 0;
width:50px;
height:50px;
float:left;
}
.PopularPosts ul li {
background-color:#000;
margin:0 0 0 0 !important;
padding:10px 20px 10px 10px !important;
counter-increment:num;
position:relative;
}
.PopularPosts ul li:before,
.PopularPosts ul li .item-title a, .PopularPosts ul li a {
font-weight:bold;
color:#000 !important;border-bottom: 1 px solid #000;
text-decoration:none;
}
.PopularPosts ul li:before {
content:counter(num) !important;
font-family:arial, sans-serif !important;
font-size:13px;
font-weight:bold !important;
display:block;
position:absolute;
top:-5px;
right:-5px;
border-radius:16px;
background-color:#4a59ce;
color:#fff !important;
width:28px;
height:28px;
line-height:28px;
text-align:center;
padding-right:0px !important;
border:2px solid #000000;
}
.PopularPosts ul li:nth-child(1) {background-color:#dddddd;
}
.PopularPosts ul li:nth-child(2) {background-color:#FDFDFD;
}
.PopularPosts ul li:nth-child(3) {background-color:#dddddd;
}
.PopularPosts ul li:nth-child(4) {background-color:#FDFDFD;
}
.PopularPosts ul li:nth-child(5) {background-color:#dddddd;
}
.PopularPosts ul li:nth-child(6) {background-color:#FDFDFD;
}
.PopularPosts ul li:nth-child(7) {background-color:#dddddd;
}
.PopularPosts ul li:nth-child(8) {background-color:#FDFDFD;
}
.PopularPosts ul li:nth-child(9) {background-color:#dddddd;
}
.PopularPosts ul li:nth-child(10) {background-color:#FDFDFD;
}
.PopularPosts .item-thumbnail {
margin:0 0 0 0;
}
.PopularPosts .item-snippet {
font-size:11px;
}
.profile-img{
display:inline;
opaciry:10;
margin:0 6px 3px 0;
}

Salve o modelo do template agora é só adicionar popular post caso ja tenha em seu template modifique as configurações de acordo com seu gosto. 


Click to comment