Entras en el panel de control de tu Blog en Blogger>Diseño>Añadir un gadget>HTML/Javascript y pegas el siguiente código:
<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/AVvXsEi34Wa7-jZ49v-UjNIubGcOIwdRlsq_HvinkMi7IKEDc_RlCzE9TT7HO_TwrmeO5h_lthDubpsYkZ-LlIc6nRYtCurEg8Pncybp-3aMAyFPNIf2htDcmggiE4C2zLETWMp7-xXjfUVgMgcA/" 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/AVvXsEicdZBo6TZ52rcV5V1rB8zVzzRWvM6gk9dOr6YCuZdalcHC7PgWYhMTyzQ-KcYaQBRrl1LiKgh23GwGaoC2_IpuoFFhilTO_UrJ8N5KGQB4Gvk-yD0L4aZ8PZPcy3aiakwYxdFtMp7ftL_O/" width="26"/></a>
<a href="http://twitter.com/usuario" target="blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEie2Sh28Y3HeZjRuJwJLae97UHx_Ypjcg7oPfD2qsYUvuWll_ESfOtUcqbvwaP6GM-zNf86v03vPK_n5NtHFkzioA_8lNVpWTCvHtiQ3AnGcrzRqFW15t_2QVEAbea9cii8n1dQYDcAXMbU/" width="25"/></a></div>
</fieldset>
<script>
function closeit(){
document.getElementById("aviso").style.visibility = "hidden";
}
</script>
</div><div class="clear"/></div>
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/AVvXsEi34Wa7-jZ49v-UjNIubGcOIwdRlsq_HvinkMi7IKEDc_RlCzE9TT7HO_TwrmeO5h_lthDubpsYkZ-LlIc6nRYtCurEg8Pncybp-3aMAyFPNIf2htDcmggiE4C2zLETWMp7-xXjfUVgMgcA/" 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/AVvXsEicdZBo6TZ52rcV5V1rB8zVzzRWvM6gk9dOr6YCuZdalcHC7PgWYhMTyzQ-KcYaQBRrl1LiKgh23GwGaoC2_IpuoFFhilTO_UrJ8N5KGQB4Gvk-yD0L4aZ8PZPcy3aiakwYxdFtMp7ftL_O/" width="26"/></a>
<a href="http://twitter.com/usuario" target="blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEie2Sh28Y3HeZjRuJwJLae97UHx_Ypjcg7oPfD2qsYUvuWll_ESfOtUcqbvwaP6GM-zNf86v03vPK_n5NtHFkzioA_8lNVpWTCvHtiQ3AnGcrzRqFW15t_2QVEAbea9cii8n1dQYDcAXMbU/" width="25"/></a></div>
</fieldset>
<script>
function closeit(){
document.getElementById("aviso").style.visibility = "hidden";
}
</script>
</div><div class="clear"/></div>
Quedaría algo así:
Bien, una vez hecho esto, cambias algunas partes del código: tienes que poner tu usuario de Twitter sin "@" y tu usuario de Facebook también. Y, lo más importante, donde dice "...Aquí va el mensaje..." pones lo que quieres que salga en el cartel. Si quieres también puedes cambiar los estilos: ancho...
Una vez cambiado todo, para poder poner el código tienes que borrar todas las partes que estén en verde.
En vez de "AVISO", también puedes poner otro título para el cartel. Simplemente tienes que sustituir la palabra de color amarillo en cursiva.
En vez de "AVISO", también puedes poner otro título para el cartel. Simplemente tienes que sustituir la palabra de color amarillo en cursiva.
Bien amigos, esto es todo, hasta el próximo tutorial.
De los mejores blog que he visto, lo suelo visitar con frecuencia
ResponderEliminarSigue asi!!!
Muchas gracias José, este tipo de comentarios son los que me hacen seguir. Lo acabo de ver ahora por la mañana y me has alegrado el dia. A ver si algún dia hablamos por Skype o por otro medio.
EliminarSaludos.