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='http://4.bp.blogspot.com/_dsEG33PDaHw/S66y-66sXXI/AAAAAAAAAOk/0GDe7kdQj4A/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
Marca de agua en las imágenes con CSS # - Marca de agua en las imágenes con CSS
Efecto de desenfoque con CSS # - Efecto de desenfoque con CSS
Botones para subir y bajar en Blogger # - Botones para subir y bajar en Blogger
Insertar una página externa en una entrada en Blogger # - Insertar una página externa en una entrada en Blogger
Ocultar entradas con determinada etiqueta en el inicio de Blogger # - Ocultar entradas con determinada etiqueta en el inicio de Blogger