viernes, 12 de agosto de 2011

Caja con mensaje para el lector en Blogger

Existen distintas formas de captar la atención del lector, y qué mejor que hacerlo con un mensaje que se mostrará al inicio de la entrada. Este mensaje se puede ocultar si al lector le incomoda y es fácilmente personalizable.

Vista previa del mensaje:

¿Llegaste al blog desde Google? Te recomiendo que te suscribas al blog mediante RSS, Facebook o Twitter para contenido similar a este.
Cerrar


Clic acá para restaurar el contenido

¿Cómo añadir este mensaje en Blogger?:

 En ''Diseño | Edición HTML'' marcaremos la opción ''Expandir plantilla de artilugios''. Buscaremos la siguiente línea:
<div class='post-header-line-1'>
Si no la encuentras busca la siguiente:
<div class='post-header-line-1'/>
Debajo de esta pega el siguiente código:
 <div id="cajamensaje" style="background: #bde5f8; border: 4px solid #fff; box-shadow: 1px 1px 2px #2d2d2d; color: #074362; font-family: Arial; height: 70px; margin: 0px auto; padding: 10px; width: 530px;">
<img border="0" src="http://3.bp.blogspot.com/-eNigD94tVAM/TkXCfBYVY5I/AAAAAAAABf8/5ElWD1LQZ-Q/s1600/google.png" style="float: left; margin: 0pt 10px 10px 0pt;" />¿Llegaste al blog desde Google? Te recomiendo que te suscribas al blog mediante <a href="URL FEED">RSS</a>, <a href="URL FACEBOOK">Facebook</a> o <a href="URL TWITTER">Twitter</a> para contenido similar a este.
<a style='float:right;' href="javascript:void(0);" onclick="getElementById('cajamensaje').style.display='none'">Cerrar</a>
</div>
 Guarda los cambios y listo.

Importante: 

Si deseas utilizar tu propio mensaje y contenido, el código es este:
<div id='cajamensaje' style='width:530px; border:4px solid #fff; margin:0px auto; height:70px; box-shadow:1px 1px 2px #2d2d2d; padding:10px;background:#bde5f8; color:#074362;font-family:Arial;'>
CONTENIDO DE LA CAJA
<a style='float:right;' href="javascript:void(0);" onclick="getElementById('cajamensaje').style.display='none'">Cerrar</a>
</div>




No hay comentarios:

Publicar un comentario