Bienvenida

BINVENIDO A GADGETS KIRADOBERMAN

Ultimas entradas

Entrada Destacada

PÁGINA DE BIENVENIDA

Slideshow para Blogger

diciembre 07, 2017

SLIDESHOW PARA BLOGGER


Nuevos trucos para blogger e implementarlos en nuestro blog de blogger, es presentar nuestro blog de una forma diferente de los demás blogs. 

Gadgets kiradoberman te mostrará un nuevo y fabuloso Slideshow para blogger, con un estilo totalmente diferente a los demás.  

El Slideshow esta creado para que muestre nuestras ultimas publicaciones con el titulo de su publicación y una pequeña descripción de su articulo, lo podrán poner debajo de la cabecera principal de su blog o al final de su blog de blogger, es un simple código que no le dará ni un tipo de error. 



Este nuevo widget Slideshow para blogger funciona perfectamente en todos los navegadores web como, Firefox, Internet Explorer, Google Chrome etc. 

La instalación de este Slideshow es muy fácil, solo tendrán que copiar el código, e insertarlo en un solo widget y cambiar una sola URL para que muestre sus últimas publicaciones. Así que no es complicado en obtener este Slideshow para blogger

¡Vamos ¡Vamos al Lío!

Ir a Blogger  

1-Un clic en “Diseño” 

2-Clic en “Añadir un gadget”

3-Busca el widget que dice “HTML-Javascript” y ábrelo 


4-Coloca el siguiente codigo en el interior:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js' type='text/javascript'></script>
<style scoped="" type="text/css">
#areatmpx {width: 100%;margin: 0 auto;}
.ei-slider{position:relative;width:100%;max-width:1000px;height:350px;margin:0 auto 35px;padding:0;background-color:white}
.ei-slider-loading{width: 100%;
height: 100%;
z-index: 997;
position: absolute;
top: 0;
left: 0;
background-color: white;
text-indent: -9999px;
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCmymdlOpwo5ga2mEKDVhNUaxbPckbn0DRHkMsO-rWXYawV-jcOtevM5u4ivXxb6YE3QNSP_9RyfYfGtrGrbEWDV9r9UZV6dbvB35Uz0aqzcaoYTnwV9SYs-dKimlX19rM2zDrqdVOKh8/s1600/loading.gif);
background-position: 50% 50%;
background-repeat: no-repeat;}
.ei-slider-large{height:100%;position:relative;overflow:hidden;margin:0 0 10px;padding:0;border:5px solid #9E0505;border-radius:2px}
.ei-slider-large li{position:absolute;top:0;left:0;overflow:hidden;height:100%;width:100%;list-style:none}
.ei-slider-large li img{width:100%;border: 0;padding:0;}
.ei-title{position:absolute;right: 8%;left: 8%;bottom:20%;color:#fff;opacity:0.8}
.ei-title p{text-align:left}
.ei-title h2{font-family: Georgia, Times, "Times New Roman";text-align:right; margin-left: auto;font-size:18px;line-height: 20px;color:#b5b5b5;max-width: 80%;text-transform:capitalize;background:#000;padding:5px;}
.ei-title h2 a{color:white}
.ei-title h2 a:hover{text-decoration:none;color:#9E0505}
.ei-title p{font-family: Verdana, Geneva, sans-serif;margin-left: auto;font-size:11px;line-height:15px;width:85%;clear:both;background:#000;padding:5px 10px;position: relative;left: -5%;}
.ei-slider-thumbs{padding: 0 0;height:13px;margin:0 auto;width:100%;position:relative;}
.ei-slider-thumbs li{position:relative;float:left;height:100%;width:20%;list-style:none}
.ei-slider-thumbs li.ei-slider-element{top:0;left:0;position:absolute;height:100%;z-index:10;text-indent:-9000px;background:#9E0505;}
.ei-slider-thumbs li a{display:block;text-indent:-9000px;background:#666;width:100%;height:100%;cursor:pointer;-webkit-box-shadow:0 1px 1px 0 rgba(0,0,0,0.3),0px 1px 0 1px rgba(0,0,0,0.5);-moz-box-shadow:0 1px 1px 0 rgba(0,0,0,0.3),0px 1px 0 1px rgba(0,0,0,0.5);box-shadow:0 1px 1px 0 rgba(0,0,0,0.3),0px 1px 0 1px rgba(0,0,0,0.5);-webkit-transition:background 0.2s ease;-moz-transition:background 0.2s ease;-o-transition:background 0.2s ease;-ms-transition:background 0.2s ease;transition:background 0.2s ease}
.ei-slider-thumbs li a:hover{background-color:#f0f0f0}
.ei-slider-thumbs li img{position:absolute;bottom:50px;opacity:0;z-index:999;width:100%;padding:0;background-color:white;border-radius:2px 2px 0 0;border:0;max-width:100%;height:60px;max-height:70px;-webkit-transition:all 0.4s ease;-moz-transition:all 0.4s ease;-o-transition:all 0.4s ease;-ms-transition:all 0.4s ease;transition:all 0.4s ease;-webkit-box-reflect:below 0 -webkit-gradient( linear,left top,left bottom,from(transparent),color-stop(50%,transparent),to(rgba(255,255,255,0.3)) );-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"}
.ei-slider-thumbs li:hover img{opacity:1;bottom:13px;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"}
@media only screen and (max-width:660px){
#areatmpx {width: 100%;}
}
@media only screen and (max-width:479px){
.ei-slider {height: 200px;}
.ei-title {bottom: 5%;}
.ei-title h2 {font-size: 14px;line-height: 17px;}
}
</style>

<div id="areatmpx">
<script src="http://yourjavascript.com/0015470133/autoelastic-min.js" type="text/javascript"></script>
<div id="randompostxx"></div>
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
AutoElasticSlideshow({
blogURL:"https://gadgetskiradoberman.blogspot.com.es/",
MaxPost:7,
idcontaint:"#randompostxx",
ImageSize:400,
Summary:100,
animation:'center',
speed:800,
easing:'',
titlesFactor:0.60,
titlespeed:800,
titleeasing:'',
thumbMaxWidth:150,
Interval:3000,
autoplay:true,
pBlank:'http://1.bp.blogspot.com/-htG7vy9vIAA/Tp0KrMUdoWI/AAAAAAAABAU/e7XkFtErqsU/s1600/grey.gif',
tagName:false
});
});
//]]>
</script></div>

Cambia la URL que esta marcada de color azul https://gadgetskiradoberman.blogspot.com.es/, por la URL de tu blog, eso es todo, y si quieren aumentar el numero de los post a mostrar, solo basta con cambiar el numero 7 por el numero que quieran. Ahora es momento de dar un clic en “Guardar”. Ubica tu widget Slideshow debajo de la cabecera principal.

Fecha: 07-12-2017

Fuente: ayudadeblogger:

Publicado por:  


You Might Also Like

0 comentarios

Paginacion

Etiquetas

aviso (1) blogger (35) cubi (1) featured (37) gadget (14) imagen (4) índice (1) marquesina (1) menú (13) posts (12) redes sociales (2) sliders (1) truco (6) widget (12)

Conyacto

Nombre

Correo electrónico *

Mensaje *