Añadir Widget de Caja de Notificacion Parpadiante en Blogger

Hello Amigos! Llama la atencion de tus visitantes y lectores de articulos de tu blog de blogger a la hora de dar una importante noticia o nota importante.Es una Caja de Notificacion.Para esto haremos una caja de notificacion.Adicionalmente se le ha añadido un efecto hover y que parpadea, que mejora o impresiona tu articulo.

Manos a la obra par a insertarlo en blogger.Mira el siguiente ejemplo.

Note:-Caja de Notificacion

Paso1 : Añadir el CSS 

• Entra en tu cuenta de Blogger
• Plantilla> Editar Html 
• Busca el siguiente codigo ]]></b:skin> (Ctrl+f)
• Añade el siguiente codigo antes de etiqueta ]]></b:skin>

.tip {
text-decoration: blink;
background: #FFC url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAfMhVNqgBGLuWRn24IyIxG-mnUFTuqaFg34Y-FB5m487RwTDW83-0SCsZV_P8bKtoZNfFaok1-TU3FHmE1Z9sQEO8NOaPWcgaReNFIv1ku_noHhuLBC0dyttCu9jp0_GxYQ5pwRLyC5rg/s1600/pit2.png) center no-repeat;
margin: 0 auto;
width: 90%;
display: block;
border: 1px solid #D5B900;
background-position: 7px 50%;
padding: 10px 10px 10px 45px;
vertical-align: text-top !important;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.tip:hover{
 box-shadow: 0 0 5px 2px rgba(0,0,0,.35);
}

Paso 2 : Implementando la Caja de Notificacion 

Cuando desees usar esta caja solo usa el codigo de abajo : 

<div class="tip"><blink>Note:- </blink>Tu Texto Va Aqui</div>

Para finalizar Reemplace el texto en Rojo con el tuyo. 

Read More