Algunas veces, navegamos entre páginas buscando cualquier cosa y nos
encontramos con sitios webs interesantes a los que más tarde no podemos
volver porque se nos ha olvidado la dirección.
Para que eso no le suceda a nuestros visitantes podemos recordarle al navegante que tiene la opción de guardar nuestra url agregandonos a sus favoritos; y una forma muy fácil de hacerlo es mediante un enlace, que al pulsarlo abra el menú de Agregar a Favoritos.
Puede hacerse mediante texto, botón e incluso una imagen que queramos.
Código para texto:
Código para botón:
Para que eso no le suceda a nuestros visitantes podemos recordarle al navegante que tiene la opción de guardar nuestra url agregandonos a sus favoritos; y una forma muy fácil de hacerlo es mediante un enlace, que al pulsarlo abra el menú de Agregar a Favoritos.
Puede hacerse mediante texto, botón e incluso una imagen que queramos.
Código para texto:
<span style="CURSOR: hand" onclick="window.external.AddFavorite('http://escaparatederosa.blogspot.com','El escaparate de Rosa');"><span>Añadir a favoritos</span></span>
Código para botón:
<span style="CURSOR: hand" onclick="window.external.AddFavorite('http://escaparatederosa.blogspot.com','El escaparate de Rosa');"><br /><br /><span><br /><br /><input onclick="javascript:agregar();" type="button" value="Añadir a favoritos">
Con un simple botón damos la posibilidad
de cerrar la página, al hacer click sobre él aparece un cartelito que te
pregunta si deseas cerrarla (IE).
Código:
Puedes cambiar "cerrar página" por el texto que quieras mostrar en el botón.
No se si os será útil, pero por si acaso ;-)
Código:
<input name="button" type="button" onclick="window.close();" value="Clic para cerrar">
Puedes cambiar "cerrar página" por el texto que quieras mostrar en el botón.
No se si os será útil, pero por si acaso ;-)
Copia el código, pegalo donde quieras y ¡a buscar!
Resultado:
<form action="http://www.google.com/custom" method="get" target="_blank"> <table bgcolor="#ffffff"><tbody><tr><td valign="top" align="left" height="32"><a href="http://www.google.com/"><img alt="Google" src="http://www.google.com/logos/Logo_25wht.gif" align="middle" border="0" /></img></a><input maxlength="255" size="31" name="q"></input><input type="submit" value="Búsqueda" name="sa"></input><input type="hidden" value="pub-7695388068888144" name="client"></input><input type="hidden" value="1" name="forid"></input><input type="hidden" value="ISO-8859-1" name="ie"></input><input type="hidden" value="ISO-8859-1" name="oe"></input><input type="hidden" value="GALT:#008000;GL:1;DIV:#336699;VLC:663399;AH:center;BGC:FFFFFF;LBGC:336699;ALC:0000FF;LC:0000FF;T:000000;GFNT:0000FF;GIMP:0000FF;FORID:1;" name="cof"></input><input type="hidden" value="es" name="hl"></input></td></tr></tbody></table></form>
Resultado:
Como primer paso, deberemos escoger la imagen adecuada. Tendremos en
cuenta dos factores: el peso de la imagen (lo que ocupa en Kbs) y su
aspecto, en cualquier página de fondos para web puedes encontrar
imágenes adecuadas.
Es aconsejable usar imágenes sencillas, que combinen con el estilo que queremos dar a nuestro blog y no "mareen" a nuestros visitantes.
[1] Una vez elegida la imagen de fondo, la subiremos a un alojamiento adecuado o la alojamos en Blogger.
[2] Una vez tengamos la url de nuestra imagen y volvemos en nuestro panel a Edición HTML, buscamos el siguiente código o el más parecido (ha de comenzar por body { el resto podría ser distinto al ejemplo) dentro del código de la plantilla:
Es aconsejable usar imágenes sencillas, que combinen con el estilo que queremos dar a nuestro blog y no "mareen" a nuestros visitantes.
[1] Una vez elegida la imagen de fondo, la subiremos a un alojamiento adecuado o la alojamos en Blogger.
[2] Una vez tengamos la url de nuestra imagen y volvemos en nuestro panel a Edición HTML, buscamos el siguiente código o el más parecido (ha de comenzar por body { el resto podría ser distinto al ejemplo) dentro del código de la plantilla:
body {
background:#fff;
margin:0;
}
[3] Añadimos en el código la url de nuestra imagen tal como se ve en el código siguiente, con paréntesis incluidos.
body {
background: url(aquí va la URL de nuestra imagen);
margin:0;
}
La imagen de fondo se repetirá tanto en vertical como en horizontal y
cubrirá por completo el fondo del blog, por lo que hemos de tratar de
usar una imagen adecuada tipo textura, por ejemplo, estaría bien...
Rosa in memoriam
Si no te gusta para nada el efecto subrayado de tus links, puedes hacer que desaparezca fácilmente.
Sitúate en tu plantilla HTML y localiza esta parte (está casi al principio antes de Header), cambias "underline" por "none" y ya tienes tus link sin subrayar.
Sitúate en tu plantilla HTML y localiza esta parte (está casi al principio antes de Header), cambias "underline" por "none" y ya tienes tus link sin subrayar.
a:hover {
color:$titlecolor;
text-decoration:underline;
}
a img {
border-width:0;
}
/* Header
-----------------------------------------------
Si no te gusta como queda la barra de Blogger (Navbar) puedes ocultarla con unas líneas de CSS.
El código CSS hay que pegarlo entre las etiquetas head en la plantilla del blog Edición html
Para evitar confusiones, lo mejor es colocarlo justo al final del CSS de la plantilla, es decir, justo antes de ]]></b:skin>:
El código CSS hay que pegarlo entre las etiquetas head en la plantilla del blog Edición html
Para evitar confusiones, lo mejor es colocarlo justo al final del CSS de la plantilla, es decir, justo antes de ]]></b:skin>:
#navbar-iframe {
height:0px;
visibility:hidden;
display:none;
}
Acabo de añadir al blog unos iconos en
la sidebar al lado de "Archivos" y "Ultimos comentarios", he estado un
rato poniendo y cambiando de sitio las imágenes hasta que he logrado
colocarlas donde yo quería. Así lo he conseguido:
Tenéis que subir las imágenes que queráis poner a un servidor de archivos, y a la url (dirección) resultante añadirle img src=, quedaría así:
Tenéis que subir las imágenes que queráis poner a un servidor de archivos, y a la url (dirección) resultante añadirle img src=, quedaría así:
<img src="http://img341.imageshack.us/img341/189/carpetaru0.gif"/>
(Esta es mi imagen de archivos, la de la carpeta)
<img src="http://img68.imageshack.us/img68/6104/platicaov9.gif"/>
(Esta es mi imagen de comentarios, gente hablando)
Podéis usarlas si queréis.
En plantilla - HTML - expandir artilugios, buscamos esta parte del código:
En plantilla - HTML - expandir artilugios, buscamos esta parte del código:
<b:widget id='BlogArchive1' locked='false' title='Archivo del blog' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
Justo después de <h2> colocamos la imagen, es decir así:
<h2>
<img src="http://img341.imageshack.us/img341/189/carpetaru0.gif"/><data:title/></h2>
Para los comentarios lo mismo, buscamos esta parte:
<b:widget id='Feed1' locked='false' title='Ultimos comentarios' type='Feed'>
<b:includable id='main'>
<h2><data:title/></h2>
Y añadimos la imagen:
<b:widget id='Feed1' locked='false' title='Ultimos comentarios' type='Feed'>
<b:includable id='main'>
<h2>
<img src='http://img68.imageshack.us/img68/6104/platicaov9.gif'/><data:title/></h2>
De esta manera es posible colocar una imagen casi en cualquier parte de la plantilla solo hay que ir probando y mirando en vista previa...
No
quería publicar esta entrada sin añadir una imagen a los comentarios en
vista expandida y acabo de conseguir meterla a base de mucho probar.
Cuando se expande una entrada en la etiquetas la imagen se verá delante
del autor de cada comentario. Esta es la imagen que he escogido y su url
(usarla si queréis).
<img src='http://img211.imageshack.us/img211/4458/10104gd8.jpg'/>En esta parte del HTML podéis ver donde la he metido (la imagen está en destacada en negrita):
<b:loop values='data:post.comments' var='comment'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
<a expr:name='"comment-" + data:comment.id'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><img src='http://img211.imageshack.us/img211/4458/10104gd8.jpg'/><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
Todo
esto lo he hecho un poco "de oído", es decir, a mi manera, así que
supongo que habrá alguna otra forma de hacerlo mejor,pero a mi me sirve
para ver el blog como quería, así que no le doy más vueltas...
Saludador web, así les llaman a estos personajillos, en esta página
hay unos cuantos modelos para elegir además de alguna que otra cosilla
interesante, hay que registrarse pero te lleva un momento solo y el
"saludador" merece la pena ¿no crees? yo lo encuentro muy simpático.
Suscribirse a:
Entradas (Atom)
