Widget caja de aviso flotante con opción cerrar para Blogger

Aquí les comparto el widget que uso para colocar el típico aviso que suelen ver en mis blogs. Desde que Blogger comenzó a usar el nuevo código, hace unos años ya, algunos widget que se compartieron en los blogs de diseño dejaron de funcionar, así que fui probando un widget tras otro hasta encontrar éste que me funcionó de maravillas y que aún me sigue funcionando, así que quiero compartirlo con mis compañeros bloggeros por si les hace falta algo así. Lo lindo de esta caja es que tiene opción cerrar, de ese modo no será una molestia para los visitantes de tu blog.

Son dos códigos, uno para escribir sólo texto y otro para colocar una imagen.

La colocación del código es muy fácil, únicamente hay que entrar en Diseño | Añadir un gadget | HTML/Javascript, y ahí pegar lo siguiente (lo que está coloreado):

---------------------------------------------------------------

SI QUIERES UNA CAJA DE AVISO CON TEXTO

<!-- AVISO OFF -->

<div id="aviso_off" style="display:block; z-index:99999;position:fixed;top:0px;left:0px;overflow:visible;height:100%;width:100%;background:rgba(255,255,255,.7);">

<div style="z-index:999999;position:fixed; overflow:visible; top:50%; left:50%; width:320px;  margin-top:-160px; margin-left:-160px; background:#ffffff; color:#000000;font-size: 22px;border-radius: 20px; padding:20px;box-sizing:border-box; text-align:left;border: 2px solid black;">

<a href="javascript:void(0);" style="float:right;padding:0 6px;box-sizing:border-box;background:#333;text-decoration:none;color:#fff;border-radius:5px;" onclick="document.getElementById('aviso_off').style.display='none';"><b>X</b></a>

ESCRIBIR TEXTO AQUÍ

</div></div>

O bien...

SI QUIERES UNA CAJA DE AVISO CON IMÁGEN

<!-- AVISO OFF CON IMAGEN -->

<div id="aviso_off" style="display:block; z-index:99999; position:fixed; top:0px; left:0px; overflow:visible; height:100%; width:100%; background:rgba(255,255,255,.7);">

  <div style="z-index:999999; position:fixed; overflow:visible; top:50%; left:50%; transform:translate(-50%, -50%); background:#ffffff; border-radius:20px; padding:10px; box-sizing:border-box; text-align:center; border:2px solid black; max-width:90%; max-height:90%;">

    <!-- Botón para cerrar -->

    <a href="javascript:void(0);" style="position:absolute; top:10px; right:10px; padding:2px 6px; background:#333; color:#fff; text-decoration:none; border-radius:5px;" onclick="document.getElementById('aviso_off').style.display='none';"><b>X</b></a>

    <!-- Imagen -->

    <img src="https://i.imgur.com/YOUR_IMAGE_CODE.jpg" alt="Aviso" style="max-width:100%; max-height:80vh; border-radius:15px;">

  </div>

</div>

Recuerdo de mi blog eliminado, je je XD 😅😓😭

Ten en cuenta en dónde lo colocas en la plantilla de tu blog, a veces no se visualiza, así que tendrás que ir probando lugares hasta que veas que el aviso aparece en tu blog. Yo suelo colocarla debajo o arriba de la entrada.

Bueno, eso es todo. Espero que les sea tan útil como lo es para mi... ¡Hacía tanto tiempo que no compartía cosas como esta! 😜

NOTA IMPORTANTE:

SI TE ENTERAS QUE ESTA SERIE (U OTRAS)

ESTÁN SIENDO EMITIDAS POR TELEVISIÓN, POR FAVOR,

SI NO VAS A MIRARLAS, POR LO MENOS DEJA LA TV PRENDIDA.

DALES RATING PARA QUE CONTINÚEN DOBLÁNDOLAS EN NUESTRO IDIOMA.

O COMPRA SUS PRODUCTOS OFICIALES

SI HAY ALGÚN ERROR DE EDICIÓN O SUBIDA DE LOS VIDEOS, POR FAVOR,

HÁGANMELO SABER, ASÍ PUEDO CORREGIRLO. ¡GRACIAS!

PARA VER MÁS CONTENIDO SOBRE ESTO, ENTRA EL ÍNDICE DEL BLOG.

¡Y NO LO OLVIDEN! SI ESTÁN AGRADECIDOS CON

LOS BUENOS MOMENTOS QUE LES DA ESTE BLOG...

DESACTIVEN ADBLOCK O...

¡¡¡DENLO A CONOCER CON TODO EL MUNDO!!! 😄

¡DISFRÙTENLO! 😁