CAJA SENCILLA DE AVISOS PARA TU BLOG DE BLOGGER

by - noviembre 10, 2020

CAJA SENCILLA DE AVISOS PARA TU BLOG DE BLOGGER.




 

Esta caja de aviso es una caja muy sencilla y bonita con opciones de colocar tu facebook y twitter , es una mezcla del mensaje tipo Post-it, 

y de etiquetas Fieldset esta caja de aviso sencilla para tu blog blogger espero que les guste





Para la colocación es muy fácil prácticamente un solo paso únicamente tienes que seguir estos pasos:


1. Diseño

2. Elementos de la pagina

3. Añadir un gadget HTML/Javacript


 Para instalarlo en vuestro Bloc solo tenéis que seguir estos pasos:



Ir a Blogger  


1-Un clic en “Diseño”                                       


                           


2-Clic en “Añadir un gadget”                              



3-Busca el widget que dice “HTML-Javascript” y ábrelo                         



4-Coloca el siguiente codigo en el interior


                                                                                    






Despues de haber insertado el código, un clic en  "Guardar"



<style type="text/css">
#aviso{
width:500px; /* Ancho de la caja */
padding:5px; position:absolute; z-index:5000;}
.caja-aviso{
border:4px double #0080FF; /* Color del borde */
-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 8px 8px 6px #808080; -moz-box-shadow: 8px 8px 6px #808080; box-shadow: 8px 8px 6px #808080;
background-color: #CEECF5; /* Color de fondo */
padding: 10px; font-family: Verdana, Geneva, sans-serif;
color: #0B173B; /* Color del texto */
}
.letrero-aviso { /* Estilos de la palabra AVISO */
font-size:18pt;
font-weight:bold;
color:#B4045F;
text-shadow: 0px 0px 10px #BA55D3;}
</style>
<div id="aviso" style="left:300px; top:100px; padding:0;">
<div align="right" style="margin-bottom:-30px;"><b><a href="javascript:closeit()" ><font face="Arial" size="1">[CERRAR]</font> <img valign="middle" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgp1iqTKlQv9maJjiIIBS8bHNByJmiGgi7IOzB8V5sDatX1gEqAT-94qUvGUwVN8YifAJw8Ru8tlAOhv3Wf8C_otL_lZDHinor8PdW5d72uX45fCejeEZKDjsmAKgQdmwJQ5IA9Z42lzR1W/" style="vertical-align:middle;"/></a></b></div>
<br/>
<fieldset class="caja-aviso">
<legend class="letrero-aviso" align="center">AVISO</legend>
...Aquí va el mensaje...<br/><div align="right"><a href="http://www.facebook.com/usuario" target="blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgT1M2YNZpRjJYlX3C0fnQy5axIXFkamRg3y8yBAYo-VnYzQeYzvPKsUfvyTfy-Cf2EqVCkD1r9bY64xKu_qUMZo320Aw9blk3UjCm6uyAxX1cUnmuP3D0veBK5wAVIrf3K-2fGd-VrACkh/" width="26"/></a>
<a href="http://twitter.com/usuario" target="blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaz9_OCn5i5IPO6GG_p0zpUcJtYctQHWqQSv9DKVS-9kjQ543_52Q4qlCs49jG4Iey9gNjbMUE0mqiA7jqKYGLokSJjupESbGE-gJ3GyElJcGFKrqospw7pyv7FP4qhl45js-PnecEbg7b/" width="25"/></a></div>
</fieldset>
<script>
function closeit(){
document.getElementById("aviso").style.visibility = "hidden";
}
</script>
</div><div class="clear"/></div>


Solo tienes que agregar agregar el mensaje donde te indica , y tu usuario de facebook y twitter si esque tienes no olvides dejar tu comentario gracias..

En donde dice left:300px; top100px; se puede controlar la posición de la caja de aviso , left es la distancia desde la izquierda y top la distancia arriba










Fecha de la Publicación;  10/11/2020





Publicado por:                                                      














You May Also Like

0 comentarios