Widget para blogger Mega Widget

Necesitabas un widget para blogger único y espectacular, Ayuda de blogger te lo trae así de fácil. Ayudadeblogger.com siempre se basara en presentar temas muy interesantes gratuitos para todos los bloggers del mundo. Obtener un buen widget para blogger es algo que no te puedes perder. Este nuevo widget para blogger funciona perfectamente en todos los navegadores como Firefox, Google Chrome, Internet Explorer, etc. A este widget para blogger se lo conoce como Mega Widget, lo que va ha mostrar este widget es 4 imágenes separadas incluyendo el titulo de su post y la fecha de publicación, mostrara de forma automática la primera publicación y luego ira subiendo a la siguiente imagen y se pondrá en primera posición y así sucesivamente, además podrán configurarlo si quieren mostrar mas publicaciones en el widget, yo lo he dejado que muestre 8 posiciones de forma automática, pero ustedes podrán optar a incrementarlo.

La instalación de este nuevo widget para blogger es muy fácil, no necesitaran instalarlo en su editor HTML de su blog, solo tendrán que copiar el código e introducirlo en un solo widget y listo, funcionara de maravilla.

A continuación mire su demostración en mi blog de demos, el widget se encuentra en el sidebar de la derecha de mi blog de demos y tiene como nombre “Widget de Post Recientes”

Te gusto verdad!

Vamos a trabajar

1 Ir a blogger

2 Da un clic en “Diseño”

3 Abre el gadget que dice “Añadir un gadget”

4 Una vez que hayas abierto un gadget tienes que buscar y abrir el widget que dice “HTML/Javascript” e inserta las siguientes líneas de código en su interior.

<style scoped="" type="text/css"> ul.abt-sidebar-slider *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box} ul.abt-sidebar-slider{font:normal normal 11px Verdana,Geneva,sans-serif} ul.abt-sidebar-slider,ul.abt-sidebar-slider li{margin:0;padding:0;list-style:none;position:relative} ul.abt-sidebar-slider{width:100%;height:500px} ul.abt-sidebar-slider li{height:24.5%;position:absolute;padding:0;width:49.5%;float:left;overflow:hidden;display:none} ul.abt-sidebar-slider li:nth-child(1),ul.abt-sidebar-slider li:nth-child(2),ul.abt-sidebar-slider li:nth-child(3),ul.abt-sidebar-slider li:nth-child(4){display:block} ul.abt-sidebar-slider img{border:0;width:100%;height:100%} ul.abt-sidebar-slider li:nth-child(1){width:100%;height:49.5%;margin:0 0 2px;left:0;top:0} ul.abt-sidebar-slider li:nth-child(2){left:0;top:50%} ul.abt-sidebar-slider li:nth-child(3){left:50.5%;top:50%} ul.abt-sidebar-slider li:nth-child(4){width:100%;left:0;top:75%} ul.abt-sidebar-slider  .overlayx,ul.abt-sidebar-slider li{-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out} ul.abt-sidebar-slider .overlayx{width:100%;height:100%;position:absolute;z-index:2;left:0;top:0;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0zuM6rSxG-QTG3u7mOpNx4uBpt3JK5tbfS0lK6u_jrp7QKKw7j8QcPOSvWmxBwVtwDbBhHvz7frrxHV0b4NUTDgMhwS4_nrkQb2mSgTvxYyxNqxX6AhRGfLjWsx4_c2zUI1UlhRKbRRA/s1600/linebg-fade.png);background-position:50% 50%;background-repeat:repeat-x} ul.abt-sidebar-slider .overlayx,ul.abt-sidebar-slider img{border:4px solid #2E8DCE;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px} ul.abt-sidebar-slider li:nth-child(1) .overlayx{background-position:50% 25%} ul.abt-sidebar-slider .overlayx:hover{-ms-filter:"progid:DXImageTransform.Microsoft. Alpha(Opacity=10)";filter:alpha(opacity=10);-khtml-opacity:0.1;-moz-opacity:0.1;opacity:0.1} ul.abt-sidebar-slider h4{position:absolute;bottom:30px;z-index:2;color:white;margin:0;width:100%;padding:0 10px;line-height:1.5em;font-family:Georgia,Times,"Times New Roman";font-weight:normal} ul.abt-sidebar-slider li:nth-child(1) h4,ul.abt-sidebar-slider li:nth-child(4) h4{font-size:150%} ul.abt-sidebar-slider .label_text{position:absolute;bottom:10px;left:10px;z-index:2;color:white;font-size:90%} ul.abt-sidebar-slider li:nth-child(2) .autname,ul.abt-sidebar-slider li:nth-child(3) .autname{display:none} .buttons{margin:5px 0 0} .buttons a{display:inline-block;text-indent:-9999px;width:15px;height:25px;position:relative} .buttons a::before{content:"";width:0;height:0;border-width:8px 7px;border-style:solid;border-color:transparent #535353 transparent transparent;position:absolute;top:50%;margin-top:-8px;margin-left:-10px;left:50%} .buttons a.nextx::before{border-color:transparent transparent transparent #535353;margin-left:-3px} </style> <div id="featuredpostside"></div> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script> <script src="http://yourjavascript.com/4005356011/abt-sidebar-slider.js" type="text/javascript"></script> <script type='text/javascript'> //<![CDATA[ FeaturedPostSide({ blogURL:"http://www.ayudadeblogger.com", MaxPost:8, idcontaint:"#featuredpostside", ImageSize:300, interval:5000, autoplay:true, tagName:false }); //]]> </script>

Realiza este cambio:

Este punto es muy importante, tendrás que borrar el nombre que dice ayudadeblogger  y poner ahí solo el nombre de tu blog de blogger, por ejemplo: si tu blog se llama ejemplo.blogspot.com tendrás que solo poner la parte que dice ejemplo.blogspot  y nada más.

Si quieres aumentar el número de post que se muestren al momento de ir intercambiando las imágenes de tu nuevo widget solo debes cambiar el número que esta marcado de color rojo 8 por el número que tú quieras.

Eso es todo ahora dale un clic en “Guardar” y ubica tu Mega Widget donde tu quieras.

Fácil verdad!

¿Necesitas ayuda?

Cualquier pregunta no duden en hacérmelo saber y de inmediato les responderé

Saludos

Recuerda suscribirte:

Obtenga nuestro boletín de noticias diario | Suscríbete gratuitamente SUSCRIBIRSE

¿Te ha resultado útil este artículo, recomiendanos?

Si

TAGS: Widgets para Blogger

Share:

Luis Chávez

Soy el fundador del sitio web Ayudadeblogger.com - Considerado un Pro Blogger profesional, Consultor SEO y desarrollador Web adicto, ejecuto una serie de sitios web desde mi Oficina Quito-Ecuador.