-->
Anuncio flotante con retraso en Blogger

Anuncio flotante con retraso en Blogger

Un usuario anónimo me preguntó cómo añadír un anuncio flotante en el blog, ahora dejo el tutorial abierto para que puedan añadir uno fácilmente a su blog.

La particularidad de este anuncio, es que realiza un seguimiento con retraso de la página.


Puedes verlo trabajando en mi blog de pruebas.

¿Cómo agregarlo a Blogger?

Paso 1: Añadiendo el script y las propiedades:

Primero, vamos a ''Diseño | Edición HTML'' en donde buscamos la siguiente línea:
</head>
 Arriba de esta, añadiremos el siguiente código:
<style type='text/css'>
    #anuncio {
    position: absolute;
    border: 0px;
    width: 200px; /* Ancho del anuncio */
    height: 80px; /* Alto del anuncio */
    visibility: hidden;
    z-index: 200;
    top: 20px;
    margin-top:50px; /* Márgen del borde superior de la pantalla*/
    margin-left: 813px; /* Margen a la izquierda de la pantalla */
    }
    </style>
    <script src='https://sites.google.com/a/blogsydescargas.co.cc/ayudabloggers/scripts/Anuncio-flotante.js' type='text/javascript'/>

Paso 2: Agregando el anuncio flotante:

Ahora que ya tenemos el script agregado, debemos añadir el anuncio buscando la siguiente línea:
</body>
Arriba de esta, pegaremos el siguiente código:
<div id='anuncio'>
<div style='background:#fff;color:#000;border:1px solid #dadada;padding:5px;font-size:14px;'><a href='Javascript:void' onClick='closebar(); return false'><img align='right' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgY7BV164CEbOpn49Q7oVgrbg2aPObjulP_Clh1ubGlqqDeGP-UHwmqe5WxJdE9OwRIeGW7R6mfTPL7bVoLDlGe8cW-jtE503pBaza-Z8fVlonyqb1VJjTQatEJAbFl3qScwcdtqAFzXbM/s200/icono-cerrar.png'/></a>Texto del anuncio</div>
</div>

Cambia los siguientes valores:
  • background:#fff Por el color de fondo del anuncio
  • color:#000 Por el color del texto.
  • border:1px solid #dadada Por el color del borde.
  • font-size:14px Por el tamaño del texto correspondiente.
  • Texto del anuncio Por el texto a anunciar.
Artículo aleatorio
BuySellAds
BuySellAds
BuySellAds
BuySellAds
BuySellAds
Artículos destacados
Insertar Infolinks en Blogger # - Insertar Infolinks en Blogger
Sección de banners en cada entrada en Blogger # - Sección de banners en cada entrada en Blogger
Habilitar los nuevos comentarios de Google+ en plantillas modificadas de Blogger # - Habilitar los nuevos comentarios de Google+ en plantillas modificadas de Blogger
Estructura básica de una plantilla HTML5 # - Estructura básica de una plantilla HTML5
Mejora la caja de comentarios en Blogger con Disqus # - Mejora la caja de comentarios en Blogger con Disqus