banner con imágenes que cambian

click para ver en grande

 

 

Publicida, en internet la publicidad es muy importante ya que cuando alguien tiene una página web y quiere anunciar algo simplemente paga o conoce personas que colocan sus productos en su página web, también por medio de la publicidad podemos ganar dinero e incrementar nuestras visitas estos son exelentes consejos para que empieces a obtener ganancias con tu página web

 

si quieres empezar a colocar banner con la publicidad de tus anunciantes lo único que tienes que hacer es colocar este widget en tu página y con esto podrás empezar a colocar banners en un solo lugar y ahorrar mucho espacio gracias a que cuando colocamos el widget las imágenes van rotando solas y así no necesitas ir poniendo anuncios en cada subpágina de tu website. solo copia los siguientes código eb tu web con las siguientes instrucciones.

<script type='text/javascript'> //<![CDATA[window.addEventListener?window.addEventListener('load',so_init,false):window.attachEvent('onload',so_init);var d=document, imgs = new Array(), zInterval = null, current=0, pause=false;function so_init() {if(!d.getElementById || !d.createElement)return;css = d.createElement('link');css.setAttribute('href','slideshow2.css');css.setAttribute('rel','stylesheet');css.setAttribute('type','text/css');d.getElementsByTagName('head')[0].appendChild(css);imgs = d.getElementById('rotator').getElementsByTagName('img');for(i=1;i<imgs.length;i++) imgs[i].xOpacity = 0;imgs[0].style.display = 'block';imgs[0].xOpacity = .99;setTimeout(so_xfade,3000); }function so_xfade() {cOpacity = imgs[current].xOpacity;nIndex = imgs[current+1]?current+1:0;nOpacity = imgs[nIndex].xOpacity;cOpacity-=.05;nOpacity+=.05;imgs[nIndex].style.display = 'block';imgs[current].xOpacity = cOpacity;imgs[nIndex].xOpacity = nOpacity;setOpacity(imgs[current]);setOpacity(imgs[nIndex]);if(cOpacity<=0) {imgs[current].style.display = 'none';current = nIndex;setTimeout(so_xfade,10000);}else {setTimeout(so_xfade,50);}function setOpacity(obj) {if(obj.xOpacity>.99) {obj.xOpacity = .99;return; }obj.style.opacity = obj.xOpacity;obj.style.MozOpacity = obj.xOpacity;obj.style.filter = 'alpha(opacity=' + (obj.xOpacity*100) + ')';}}//]]></script>

Pega esto en head

integra este código en el head de tu website, pero todavía no verás resultados así que vamos al siguiente paso.


Pega esto en css

Ingresa a plantillas luegos entras a plantilla propia y luego copias esto 

/* BANNER CAMBIANTE
----------------------------------------------- */
{margin: 0; padding: 0;}
#rotator {
border: 1px solid #000000;
overflow: hidden;
margin: 0px ;
padding:2px;
position: relative;
width: 430px;
height: 60px;
}
#rotator img {
border: 0;
width: 430px;
height: 60px;
}

 


<div id="rotator">

<a href="url del sitio""><img alt="Título" src="url de la imagen"/</a>

<a href="url del sitio""><img alt="Título" src="url de la imagen"/</a>

<a href="url del sitio""><img alt="Título" src="url de la imagen"/</a>

<a href="url del sitio""><img alt="Título" src="url de la imagen"/</a>

</div>

Pega esto en html

pega este código en html o en el layout de tu plantilla donde quieres que aparezca y listo dale guardar

la muestra está en la parte superior derecha de mi página web


softwarefastmaster

Escribir comentario

Comentarios: 6
  • #1

    cristhofer (domingo, 12 agosto 2012 12:34)

    muy bueno o usare en mi page. cuando quieras que intercambiemos baner me avisas

  • #2

    Carola Pozo Cortez (domingo, 30 septiembre 2012 20:24)

    Hola Herman:
    Felicitaciones por tu Blog. Aprovecho tu gentileza al brindarnos herramientas para nuestros blogs.
    Intente seguir tus instrucciones para agregar este banner con imagenes que cambian, pero me quedo la duda siguiente: cuando ingreso a plantilla propia no se en que lugar agregar el codigo que tu brindas porque no indica el lugar en el cual debemos colocar dentro de nuestra plantilla propia. Particularmente no tengo plantilla propia sino uso una de Jimdo ¿me explico?
    Te agradecere me orientes si eres tan amable.
    Muchas gracias
    PD: Mi e-mail: etmecarola@yahoo.com

  • #3

    nitroplantillas (lunes, 01 octubre 2012 22:36)

    si indico donde solo tienes que entrar a plantillas, plantillas propias, alli borras lo que está alli y pegas el html, luego arriba hay un menú que dice css le das click, borras lo que está alli y pegas el código que dice css y listo guardas si no me conprendes buscame en el facebook como homlopes@hotmail.com para explicarte.

  • #4

    David (martes, 09 octubre 2012 01:31)

    y si lo quiero poner por ejemplo en la barra lateral se puede???

  • #5

    nitroplantillas (martes, 09 octubre 2012 12:54)

    si se puede solo tienes que colocarlo en un widget html y listo

  • #6

    rey lopez ugalde (lunes, 26 noviembre 2012 19:29)

    porque no locan un fotograma para ver po a paso