sexta-feira, 7 de outubro de 2016

Widget Popular Post di Blog new layout numbered

popular post numbered elegant gambar keren di blog


Widget popular post di blog new layout numbered é um widget diferente isso vem com uma inovação ao alinhar imagens e também com uma fonte diferenciada bem como números no final para melhor distribuição enttão se deseja adicionar isso a seu Blog siga os passos abaixo Creditos Twistblog 

Faça login no Blogger então va no menu 

modelo editar HTML/JavaScript com as teclas combinadas CTRL+F 
busque por ]]></b:skin>  e antes disso copie e cole o Seguinte código CSS 

.widget .widget-item-control a img {
  border: none;
  width: 20px !important;
  height: 20px !important;
  padding: none;
  background: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  -ie-box-shadow: none;
  box-shadow: none;
}
.sidebar .PopularPosts .widget-content ul li {
  padding: 0px 0px 0px;
  height: 73px !important;
  overflow: hidden !important;
  list-style-type: none !important;
  list-style: none;
}
.sidebar .popular-posts ul {
  padding-left:0px !important;
  list-style-type: none !important;
}
.sidebar .popular-posts ul {
  counter-reset: popcount;
  margin: 0; padding: 0;
}
.sidebar .popular-posts ul li:before {
  background: rgba(247, 247, 247, 1);
  color: #000000;
  content: counter(popcount,decimal);
  counter-increment: popcount;
  float: right;
  font-size: 15px;
  line-height: 20px;
  list-style-type: none;
  padding: 0px 6px 1px 5px;
  border-radius: 0px 0px 7px 7px;
  position: relative;
  display: inline-block;
  box-shadow: -2px 2px 10px rgba(187, 187, 187, 0.7);
  font-weight: normal;
  top: 0px;
  right: 1px;
  z-index: 999999999999;
  border: solid #B5B5B5;
  border-width: 0px 1px 1px 1px;
}
.sidebar .PopularPosts .item-thumbnail {
  float: left;
  margin: 0px!important;
}
.sidebar .PopularPosts img {
  padding-right: 0px !important;
  width: 72px;
  height: 72px;
  overflow: hidden !important;
  margin-right: 0px;
}
.sidebar .PopularPosts .item-title a:hover {
  background: #f6f6f6;
  color: #000;
}
.sidebar .PopularPosts .item-title a {
  background: #EAEAEA;
  color: #6E6E6E;
  display: block;
  font-size: 14px;
  font-weight: normal;
  line-height: normal;
  font-family: "Oswald",sans-serif;     
  padding: 10px 30px 0px 78px;
  transition: all .4s ease-in-out;
  height: 62px;
  text-decoration: none;
  border-bottom: 1px solid #cccccc;}

Salve o modelo  

Agora va no menu Layout e localize onde deseja colocar o widget va em adicionar novo gadget 
procure por popular post como mostra a figura abaixo e deixe como esta as configurações na foto mostrada salve e pronto confira o resultado.

popular post configure blogger







NEXT ARTICLE Next Post
PREVIOUS ARTICLE Previous Post

Nenhum comentário:

Postar um comentário

NEXT ARTICLE Next Post
PREVIOUS ARTICLE Previous Post
 

Delivered by FeedBurner