Mostrar entradas populares numeradas en blogger

¿Es posible mostrar entradas populares en blogger? Si continuas usando Blogger como plataforma para su blog personal o empresarial, probablemente esté buscando formas de personalizarlo y hacerlo ver más profesional. De esta manera, hará que su sitio web se vea único y bien estructurado con el fin de destacar sobre la competencia. Afortunadamente, existen muchas maneras de personalizar su blog de Blogger, y una de ellas es personalizar su widget de entradas populares.

Este tutorial te mostrara cómo añadir un elegante widget de entradas populares numeradas en el sidebar de blogger.

Mostrar entradas populares en el sidebar!

¿Quieres mostrar las entradas más visitadas en el sidebar de tu blog de una forma atractiva para tus visitantes? Tener un widget de entradas populares en el sidebar tiene ventajas innumerables y ayuda a los nuevos visitantes a conocer los artículos que son tendencia en un sitio web.

Este widget te ayudará a aumentar el tráfico orgánico y también aumentar el número de páginas vistas en tu blog.

Gratis y fácil de instalar

El widget es gratuito. Toma un minuto obtener el widget en marcha y funcionando, no requiere registro!

A continuación sigue los pasos cuidadosamente y ponlo en práctica.

Añadir widget de entradas populares numeradas para blogger:

• Inicie sesión en blogger
• Diríjete a la seccionn «Plantilla» >> Haz clic en el botón «Editar HTML».
• Presione el botón «Ctrl» + «F» y busque la etiqueta ]]></b:skin> y justo encima de este código pega el siguiente código.

  /*****************************************
  Widget de entradas populares - Tecneofito
  ******************************************/
  .popular-posts ul li a {
  background: none repeat scroll 0 0 #222222;
  color: #FFFFFF;
  display: block;
  margin: 10px 0;
  padding: 25px 15px 30px;
  position: relative;
  text-decoration: none;
  transition: all 0.3s ease-out 0s;
  width: 85%;
  }
  .popular-posts ul li a:before {
  background: none repeat scroll 0 0 #2DB3E9;
  color: #FFFFFF;
  font-weight: 700;
  height: 2em;
  line-height: 2em;
  margin-left: 88%;
  padding: 4px;
  position: absolute;
  text-align: center;
  width: 2em;
  transition: all 0.2s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  }
  .popular-posts ul li a:hover {
  opacity: 0.8;
  }
  .popular-posts ul li a:hover:before {
  border-left-color: #CCCCCC;
  left: -1px;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  }
  .popular-posts ul li:first-child + li + li + li + li + li + li + li + li + li a:before {
  content: "10";
  }
  .popular-posts ul li:first-child + li + li + li + li + li + li + li + li a:before {
  content: "9";
  }
  .popular-posts ul li:first-child + li + li + li + li + li + li + li a:before {
  content: "8";
  }
  .popular-posts ul li:first-child + li + li + li + li + li + li a:before {
  content: "7";
  }
  .popular-posts ul li:first-child + li + li + li + li + li a:before {
  content: "6";
  }
  .popular-posts ul li:first-child + li + li + li + li a:before {
  content: "5";
  }
  .popular-posts ul li:first-child + li + li + li a:before {
  content: "4";
  }
  .popular-posts ul li:first-child + li + li a:before {
  content: "3";
  }
  .popular-posts ul li:first-child + li a:before {
  content: "2";
  }
  .popular-posts ul li:first-child a:before {
  content: "1";
  }
  .item-snippet {
  display: none;
  }
  .PopularPosts .item-thumbnail {
  display: none;
  } 
  
  
  /*****************************************
  Widged de entradas populares - Fin
  ******************************************/
  

Ahora haz clic en el botón «Guardar» y sigue los siguientes pasos.

• Nuevamente ingresa en la sección «Diseño».
• Ingresa a la sección «Sidebar» y haz clic en «Añadir Widget» >> Ahora busca en la lista la opción «Entradas populares» y añadelo.
• Guarda los cambios.

Palabras Finales

Espero que este tutorial haya sido de tu agrado, si tienes dificultades para instalar este widget, puedes compartir tu problema con nosotros utilizando nuestra caja de comentarios. También puedes dar tu opinión y asegúrate de compartir este post. Gracias!.