Exportar google maps

Google ha estado cambiando algunas cosas, entre ellas las configuraciones de Google Maps. Por alguna causa sacaron el link directo para exportar los mapas a KML.
Por el momento existe una segunda opción:

Una pregunta...

...cuando te lavas la cabeza mientras te bañas, mirás a la ducha o le das la espalda?

Grandes ciudades

Siempre fui de la idea que en las grandes ciudades se puede vivir gratis. Sólo hay que tener baja la moral.


Adornar el pie del post (post footer)

En el pie de la entrada es donde vemos el nombre del autor, la hora de publicación,los comentarios..., podemos ponerle una imagen de fondo para mejorar su estética y, a la vez, para evitar que se confunda con el texto del post.

Publicar código en el Blog


Para que Blogger muestre el código en una entrada sin necesidad de usar textarea hemos de sustituir los carácteres de apertura y cierre < > por sus entidades equivalentes, para la apertura usamos & lt ; y para el cierre & gt ; escrito sin espacios (he tenido que ponerlo separado para que Blogger no lo interprete). Yo suelo hacerlo siempre a mano, copiando y pegando, pero si os resulta más fácil podéis usar un convertidor de cadenas como este de Aulambra o el de Chuano que es el que yo uso habitualmente.
¿Verdad que no es difícil?

Rosa in memoriam

Entradas expandibles en la página principal

Hace tiempo habíamos visto la forma de lograr que, en las páginas de etiquetas se mostrasen solamente los títulos de las entradas, permitiendo que al pinchar sobre ellas se viesen completas.

Han sido varias personas las que me han preguntado sobre la forma de hacer esto mismo, pero en la página principal.
Esto lo he conseguido con una ligera modificación del código en el "truco" original, incluso pueden mostrarse sin problemas en ambas páginas al mismo tiempo.

No se ven vistas miniatura Windows 7

Si no se ven las imágenes en miniaturas en tu windows 7 es porque las tienes desabilitadas. Para poder verlas debes seguir estos pasos:

Organizar>>Opciones de carpeta y búsqueda

En la pestaña Ver, debes quitar el tilde en la siguiente línea:

Mostrar siempre íconos, nunca vista en miniatura


y listo, todo solucionado.


Entradas expandibles con footer incluido

Después de explicar como aplicar en el blog la forma de mostrar las entradas en expandible, tanto en las páginas de etiquetas como en la página principal del blog, algunas os habéis interesado por la forma de mostrar al expandir los títulos, además de la entrada completa, también el post-footer.

Antes de nada os recomiendo encarecidamente que guardeis una copia de vuestra plantilla en el PC, pues podrían complicarse las cosas si por error colocamos el código en mal lugar.

Títulos expandibles en los post de las etiquetas

Como consigo que al pinchar sobre una de mis pestañas, se vea solamente la lista del título de las entradas y que una vez se pinche sobre uno de los títulos, este se expanda para mostrar la entrada completa.
Para poder hacer esto, antes es imprescindible tener etiquetados nuestros posts, si no sabéis como hacerlo, podéis consultar en esta entrada anterior como etiquetar vuestras entradas.
[1] Nos descargamos el script que necesitamos para hacer funcionar el efecto, lo descomprimimos y lo subimos a un alojamiento adecuado para obtener su url.
[2] Vamos a Edición de HTML de nuestro panel y marcamos la opción "Expandir las plantillas de artilugios" colocamos la url del script en este código y de esta manera que veis, antes de </head>:
<script type='text/javascript'>
function toggleIt(id) {
post = document.getElementById(id);
if (post.style.display != 'none') {
post.style.display = 'none';
} else {
post.style.display = '';
}
}
</script>
<script src="URL_DEL_SCRIPT" type="text/javascript">
</script>
[3] Buscamos la parte de este código que se encuentra escrito en color negro, y añadimos la parte del código que está escrita en rojo, colocada tal cual lo veis aquí:
<b:includable id='PeekABooPost' var='post'>
<div class='post uncustomized-post-template'>
<table><tr><td width='40px'>
<a expr:onclick='&quot;javascript:toggleIt(\&quot;&quot; + data:post.id + &quot;\&quot;);&quot;' href='javascript:void(0)' style='text-decoration:none' title='Desplegar esta entrada'>[+/-]</a></td>
<td><h3 class='post-title'><a expr:href='data:post.url'><data:post.title/></a></h3></td></tr></table>
<div class='post-body' expr:id='data:post.id' style='display:none'>
<p><data:post.body/></p>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
</div>
</b:includable>

<b:includable id='main' var='top'>
<!-- posts -->
<div id='blog-posts'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>

<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:include data='post' name='PeekABooPost'/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>

<b:include data='post' name='post'/>

</b:if>

Algunas visitas me han comentado que su código no es igual al del truco y que no han podido hacerlo. La diferencia, en casi todos los casos, estaba en que no habían ocultado o eliminado la tabla que sale en las páginas de etiquetas y que dice algo así como "ver más entradas con esta etiqueta". El código de esa tabla es este:
<b:include data='top' name='status-message'/>
<data:adStart/>
La solución, sino queréis quitar u ocultar esa tabla, es colocar el código para los post expandibles, ignorando esa parte, es decir, cuando llegamos a ella, seguimos hacia abajo buscando la parte que necesitamos para colocar el código, y listo.

Notificar por email formulario contacto

El formulario funciona perfectamente y las respuestas se guardan en una hoja de cálculo dentro de los documentos de Google. El problema importante es que, si no hacemos nada más, no nos enteramos cuando alguien nos ha enviado un mensaje empleando este formulario. Se trata sencillamente de que el contenido del formulario se nos haga llegar a nuestra dirección de correo.
Una vez creado nuestro formulario, vamos a la hoja de cálculo en nuestros Docs de Google y elegimos la opción  Insertar > Secuencia de comandos



En el siguiente panel escribimos Contact Us en la caja de búsquedas y pulsamos el botón Search (Buscar):



El sistema nos encontrará el Contact Us Form Mailer. Pulsamos el botón Install:



Aparecerá un mensaje de error que ignoramos completamente:



Pulsamos en Cerrar:



Ahora nos vamos a editar nuestra secuencia de comandos.
Pulsamos en Herramientas > Editor de secuencia de comandos:



Nos aparecerá el código del comando (clic sobre la imagen para verla a mayor tamaño):



El cambio necesario y el únicamente imprescindible es colocar la dirección de correo electrónico a la que queremos que llegue el formulario en la línea 6.
Quedaría así:



Luego podemos modificar el texto de las líneas 11 y 12 por un mensaje personalizado.
Cambiamos la cadena "sent the following message" por el texto que nos parezca más oportuno:



La línea 14 la podemos seleccionar y borrar completamente:



Y en la línea 15 (ahora será la nueva línea 14) borramos +bodyHTML3 porque hace referencia al comando de la línea que acabamos de borrar.



Finalmente en la nueva línea 15 cambiamos el Contact Us Form por el texto que nos parezca:



Guardamos con Archivo > Guardar




Nos queda todavía activar el comando.
Vamos a Activadores > Activadores de la secuencia de comandos actual:



Pulsamos en No triggers set up...



Y, en el tercer desplegable elegimos la opción On form submit:



Ya sólo queda aceptar el siguiente mensaje:



Para colocar nuestro formulario en un blog o página web, vamos al formulario y elegimos la opción Formulario > Insertar formulario en una página web:



Copiamos el código que nos aparece en la siguiente ventana emergente:



Y lo pegamos en el punto en el que queramos colocarlo.

Formulario de contacto google docs

Blogger no ofrece la posibilidad de incorporar un formulario de contacto de forma automática. Tendremos que buscar formas de hacerlo de manera más o menos manual.  Una de las opciones más sencillas es crearlo con Google Docs. Como ya somos usuarios de Gmail, lo tenemos muy fácil.
Simplemente accedemos al panel de Google Docs desde nuestra cuenta de Gmail (por ejemplo):



Una vez en Google Docs pulsamos en Crear nuevo > Formulario



Y vamos completando los campos que queremos que aparezcan empezando por el título y subtítulo o mensaje introductorio. De entrada tenemos dos preguntas prediseñadas que podemos editar. Pulsamos en Finalizado cuando lo hayamos acabado:
Si queremos introducir nuevos campos pulsamos el botón Añadir elemento:



Hemos añadido un texto más largo (texto de párrafo):



Podemos también hacer que los campos sean o no obligatorios.
Cuando lo tengamos le damos a Guardar.
Google pone a nuestra disposición un montón de diseños preconfigurados. Por defecto viene el Plain.



Pulsando sobre el botón Tema: Plain se acceden al resto de los temas.
Vamos pulsando sobre cada uno de ellos y, si nos gusta, hacemos clic en Aplicar



Para colocarlo en el blog, pulsamos en Más acciones > Insertar



Nos aparecerá una ventana emergente con el código a colocar (un iframe):



Copiamos el código y lo pegamos en una página estática del blog (por ejemplo).
Para leer las consultas recibidas, iremos por Gmail > Docs. Allí veremos nuestro formulario:
Haciendo clic sobre el nombre, veremos la hoja de cálculo en la que se guardan los mensajes recibidos:
Para volver a modificar nuestro formulario le damos a Formulario > Modificar formulario:



Como etiquetar las entradas

Poner etiquetas a nuestros posts es bastante sencillo:

Cada vez que escribimos una nueva entrada, vemos debajo del editor de texto un apartado de "Opciones de entrada" y destacado en negrita "Etiquetas de esta entrada", es justo ahí, donde pondremos nuestras etiquetas. Puede ser una sola o varias, siempre separadas por comas. Si ya has etiquetado algún posts anteriormente, tienes la opción de "Mostrar todo" para escoger una de las etiquetas existentes con solo hacer click sobre ella.
Para etiquetar los pots antiguos, hemos de usar el "Editar entradas" y una vez allí, en "Acciones de etiquetas" podremos ir seleccionando las entradas y añadiendo etiquetas, es un poco "labor de chinos" sobre todo si tenemos muchas entradas en el blog, pero todo es ponerse con ánimo...
Una vez etiquetadas las entradas, podemos mostrar las etiquetas en el pie de cada post, para ello vamos a: Plantilla - Entradas del blog - Editar y seleccionamos el cuadradito con la opción "etiquetas". Guardamos cambios y listo.
También podemos mostrar nuestras etiquetas en la sidebar, de forma que facilitemos la navegación en nuestro blog a las visitas, como si de un sencillo menú de contenidos se tratara. Para ello nos situamos en Plantilla - añadir nuevo elemento y seleccionamos la opción "etiquetas" que después arrastraremos a la parte de la sidebar que mejor nos parezca.

Recorrido de líneas de colectivos Capital Federal

Un sitio interactivo donde figuran los recorridos de los colectivos en un mapa, sin la necesidad de andar adivinando las calles que no conocemos para saber por donde pasa:

Flujo saturado en el hierro

De la misma manera que la inducción del flujo magnético satura a llegar a determinados alto niveles del campo magnético... me encuentro en el codo de dicha curva....
Es hora de perder el tiempo o buscar la forma de aprovecharlo?

Menú en forma de pestañas en Blogger


Antes de empezar has de tener etiquetados todos tus post sino es imposible que puedas colocar las pestañas.

1- Vamos a la Plantilla en Edicion de Html y Expandimos las plantillas de artilugios.

2- Buscamos este trozo de código: <b:section class="header" id="header" maxwidgets="1" showaddelement="no"> y lo cambiamos por este otro:
<b:section class="header" id="header" maxwidgets="2" showaddelement="yes">

3-Justo antes de: ]]></b:skin> colocamos este codigo completo:
/*- Menu Tabs F */

#tabsF {
float:left;
width:100%;
font-size:80%;
line-height:normal;
border-bottom:1px solid #000;

}
#tabsF ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
#tabsF li {
display:inline;
margin:0;
padding:0;
}
#tabsF a {
float:left;
background:url("http://3.bp.blogspot.com/_8PJ-pgoBhWQ/Sf9qIJ35QkI/AAAAAAAAGxQ/t48-cC0Ogkk/s400/tableftF.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabsF a span {
float:left;
display:block;
background:url("http://1.bp.blogspot.com/_8PJ-pgoBhWQ/Sf9qMJVnJmI/AAAAAAAAGxY/K6ntns2CUvI/s400/tabrightF.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#666;
}
/* Commented Backslash Hack hides rule from IE5-Mac */
#tabsF a span {float:none;}
/* End IE5-Mac hack */
#tabsF a:hover span {
color:#FFF;
}
#tabsF a:hover {
background-position:0% -42px;
}
#tabsF a:hover span {
background-position:100% -42px;
}

4- Guardamos cambios.
En este momento añadimos las etiquetas al blog.
Nos dirigimos a la Plantilla--Elementos de la pagina--Añadir nuevo elemento de pagina, y añadimos las Etiquetas.

5- Por ultimo buscamos el siguiente codigo:


<b:widget id='Label1' locked='false' title='Etiquetas' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title><h2>
<b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>

<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

lo cambiamos por:

<b:widget id='Label1' locked='false' title='' type='Label'>
<b:includable id='main'>
<div id='tabsF'>
<ul>
<li><a expr:href='data:blog.homepageUrl'><span>Inicio</span></a></li>
<b:loop values='data:labels' var='label'>
<li><a expr:href='data:label.url'><span><data:label.name/></span></a></li>
</b:loop>
</ul>
<!-- <b:include name='quickedit'/> -->
</div>
</b:includable>
</b:widget>

6- ¡Ya está listo! Si todo ha ido bien, las pestañas deberían estar situadas en el sidebar de nuestro blog, solo queda moverlas a la parte superior arrastrándolas hacia allí.
Si os apetece probar con otros modelos, podéis verlos en exploding boy, pinchando sobre ellos en esa misma página con el botón derecho, escoges "ver código fuente" y tendrás el código CSS para cada uno de los menús del ejemplo.

Rosa in memoriam

Secciones de las plantillas de blogger

Básicamente se construyen a partir de esta estructura:


Recomendar a un amigo


Quieres que tus visitantes o tu mismo puedan recomendar tu blog a sus amigos enviando el enlace del blog mediante un formulario?
Con este sencillo script puedes hacerlo fácilmente ( lo he probado y funciona bien):

<form name="eMailer">
ENVÍA ESTA PÁGINA A UN AMIGO
<br>
Indica su e-mail:
<br>
<input type="text" name="address" size="25">
<br>
<input type="button" value="Send this URL" onClick="mailThisUrl();">
</form>
<script language="JavaScript1.2">
// (C) 2000 www.CodeLifter.com
// Este y otros muchos javascripts
// los encontraras en MundoJavascript.com
var good;
function checkEmailAddress(field) {
// the following expression must be all on one line...
var goodEmail = field.value.match(/\b(^(\S+@).+((\.com)|(\.net)|(\.edu)|(\.mil)|(\.gov)|(\.org)|(\..{2,2}))$)\b/gi);
if (goodEmail){
good = true
} else {
alert('Por favor introduce un e-mail valido')
field.focus()
field.select()
good = false
}
}
u = window.location;
m = "Pienso que te puede interesar esta página...";
function mailThisUrl(){
good = false
checkEmailAddress(document.eMailer.address)
if (good){
// the following expression must be all on one line...
window.location = "mailto:"+document.eMailer.address.value+"?subject="+m+"&body="+document.title+" "+u;
}
}
</script>

Rosa in memoriam

Descargar y reparar iastor.sys blue screen

Descargar este zip: http://www.tacktech.com/download.cfm?file=microsoft/sata/iastor-sata-drivers.zip


Abrirlo y buscar el archivo iastor.sys luego reemplazarlo en la carpeta:

c:\windows\system32\drivers


No queda más que esperar a ver si el blue screen totalmente aleatorio vuelve a ocasionar el reinicio del equipo.

Efecto para links

Cuando pasas el puntero sobre cualquier link del blog este se agranda al tamaño que tu decidas, además se verán de un bonito color rojo (para los títulos de las entradas también vale) puedes comprobar el efecto añadiendo el siguiente código. En el código el tamaño de las letras está en "24" y coloca el código en la plantilla-HTML, justo antes de ]]></b:skin>
Código:
<style fprolloverstyle>a:hover {color: #FF0000; font-size: 24pt; font-weight: bold}</style>
¡Qué te diviertas!

Rosa in memoriam

Marcadores sociales en un solo botón

Gracias a Add This tendrás agrupados los marcadores sociales en un solo botón, que además de práctico es bonito. Solo has de seleccionar el botón de Bookmark, luego el sitio donde lo vas a poner: "Blog" y donde públicas: "Blogger". Te darán la opción de copiar código para tu plantilla o para tu post, personalmente recomiendo escoger la opción "post" y pegar el código en tu plantilla: opciones-formato-plantilla de entrada, y así te saldrá el código (y el botón) en todas las entradas, con la posibilidad de escoger en las que no quieras mostrarlo (borras el código y listo). El resultado es este:
AddThis Social Bookmark Button

Se me olvidaba... si te interesa seguir tus estadísticas has de registrarte, si no, no necesitas hacerlo para obtener el botón.

¿Qué no sabes que son los marcadores sociales?:

Marcadores Sociales
En un sistema de marcadores sociales los usuarios guardan una lista de recursos de Internet que consideran útiles. Las listas pueden ser accesibles públicamente o de forma privada. Otras personas con intereses similares pueden ver los enlaces por categorías, etiquetas o al azar.

También categorizan los recursos con 'tags' o 'etiquetas' que son palabras asignadas por los usuarios relacionadas con el recurso. La mayoría de los servicios de marcadores sociales permiten que los usuarios busquen marcadores asociados a determinadas 'tags' y clasifiquen en un ranking los recursos según el número de usuarios que los han marcado.

Su popularidad va creciendo y la competición ha hecho que los servicios ofrezcan algo más que compartir marcadores y permitan votos, comentarios, importar o exportar, añadir notas, enviar enlaces por correo, notificaciones automáticas, rss, crear grupos y redes sociales, etc.

"Wikipedia"

Rosa in memoriam

Blue screen reinicia solo

Cuando windows nos muestra su característica blue screen, quiere decir que algo no está andando bien, pero para poder solucionarlo tenemos que ver qué es lo que está fallando. Pero pasan pocos segundos entre que nos muestra la pantalla y el sistema se reinicia y no llegamos a ver cual fue el problema. Para poder desactivar el reinicio automático ante un problema hay que seguir los siguientes pasos:
1- Panel de Control 
2- Sistema 
3- Propiedades del sistema 
4- Opciones avanzadas 
5- Reinicio y recuperación >> Configuración 
6- Error del sistema >>Destildar>> "Reiniciar automáticamente" Ahora la próxima vez que suceda el mismo error tendremos tiempo de buscar un lápiz y anotar el error para poder intentar solucionarlo.

Ranking 5 estrellas en Blogalaxia

Antes de poner las estrellitas en tu blog has de agregar tu blog en Blogalaxia.
Una vez estes inscrito copias este código:
<iframe
expr:src='"http://rank.blogalaxia.com/pbrate.php?color=ffffff&amp;url=" + data:post.url' frameborder='0' height='15' marginheight='0'
marginwidth='0' scrolling='no' style='margin:0; padding:0' width='70'></iframe>

Una vez copiado, localizas esta parte del código en tu plantilla HTML-expansión de artilugios, y copias el código de arriba justo después:
<p class='post-footer-line post-footer-line-2'><span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast
!= "true"'>,</b:if>
</b:loop>
</b:if>
</span>
</p>

Rosa in memoriam

Why A Blog Is Good for Business

Whether you’re a home-based freelancer or the CEO of a brand new start-up, a business blog is one of the most versatile online marketing tools that no small business should be without. Once the preferred medium of teenagers and unpublished authors, blogs are now widely accepted as one of the best and most cost-effective ways to boost your business. Here we take a look at some of the benefits behind blogging, and what you should bear in mind when it comes to creating and posting blogs on your site.

Why A Blog Is Good for Business

Building Trust

If you run a small business the importance of building relationships with your clients cannot be underestimated. By creating a vocal presence for your brand in the form of a blog, you can build a brand your customers can trust and add a more personal touch – especially if your business is purely web-based.
Why A Blog Is Good for Business

Drive Traffic

If you’ve been struggling to get search engines to pick up your website, by creating an effectively search engine optimised blog you can dramatically boost your digital profile. Research your keywords, populate your blog posts accordingly and you can expect to see a sudden upsurge in your Google rankings. And by being easier to find on the web, you’ll inevitably enhance your sales and promote a sense of credibility.
Why A Blog Is Good for Business

Open A Dialogue

Sure posters, leaflets and brochures are an effective way of talking to your potential client base. But they present a purely one-sided form of conversation. A blog gives your customers a unique opportunity to communicate directly with your business. By encouraging customers to comment on your posts they can share their opinions, ask questions and interact with other clients in a relationship building manner that other marketing mediums simply don’t allow.

Enhance Your Reputation

By giving away free advice on your blog you can enhance your prestige and kudos. Writing information-rich posts will establish your brand as the go-to authority within your industry. It’s also important to make sure your business expresses an opinion on the latest events and wider issues within your industry – and what better way to project a dynamic and current persona than by using the latest marketing tool to get your voice heard?

Stand Out from the Crowd

Think about brands that are making it big in the business world today and you’ll notice something they all have in common; a strong sense of personality. Whether it’s Innocent smoothies or Apple, their strong tone of voice helps their customer base to engage with their business on a much more intimate level. Now we’re not suggesting you start blogging about your home life, but by letting your personality shine through, your blog can stop your business merging into the background or feeling detached and far-removed from you target market.
Why A Blog Is Good for Business

Client Collaboration

Extend the appeal of your blog by encouraging your clients to post about their experience of working with you. This will help forge stronger links with your existing client base and encourage repeat business. You can also build your reputation and increase your appeal to new customers through the inclusion of case studies and regular updates about current projects you’re working on.

Picture This

No matter what the nature of your business is, make sure you vary your posts in terms of content. It’s important to remember that people read digital information in a very different way to reading print material. Keep your content copy-light, avoid uploading reams and reams of articles and make sure you break it up with plenty of captivating and compelling imagery – grab your digital camera and get creative with your content!

Añadir texto informativo a una imagen subida en Blogger

Seguro que en algún blog de los que visitáis habréis visto que al poner el puntero sobre una imagen aparece un pequeño texto con información adicional sobre la imagen. Esto solo es válido en IE que interpreta el atributo "alt" como "title" en Firefox habría que añadir a la imagen el título "title".
Simplemente has de subir la imagen que quieras a Blogger, (en vista HTML esa imagen se verá como código), pues bien, solo has de buscar en ese código: alt="", e incluir entre las comillas el texto que deseas que aparezca como información de tu imagen.

Insertar líneas en las entradas

Puedes insertar una línea en tu blog para separar lo que quieras logrando un bonito efecto, tan solo has de usar este código: <hr> y obtendrás tu línea:





Si quieres cambiar su color o hacerla más ancha:
<hr color="green" size=7>
y la verás así:





Si no le indicas lo contrario la línea se ajustará ella solita al tamaño del post o del espacio donde la publiques, vamos a hacerla más pequeñita :
<hr color="orange" size=3 width="190" >





Si pones dos <hr> seguidos consigues un efecto de doble línea muy bonito:





Otra línea fácil de conseguir y que queda muy bien:

<hr style="border: medium dotted; color: #666666;" />




Y otra:

<hr style="border: medium dashed; color: yellow;" />




También podemos emplear un "div" para conseguir una línea de separación simple y bonita:

<div style="border-top: 1px dashed #000; height: 20px; margin-top: 20px;">
</div>
Rosa in memoriam

Imagen con "tembleque"

Un curioso efecto para imagenes, al pasar el puntero sobre ellas se ponen a temblar.
Hay que pegar este código entre <head> y </head> yo lo he puesto justo antes de ]]></b:skin>
Código:
<style><br />.shakeimage{<br />position:relative<br />}<br /></style><br /><script language="JavaScript1.2"><br /><br /><br />//configura aquí la intensidad del movimiento aumentando o disminuyendo el número<br />var rector=5<br /><br />///////No escribas a partir de aquí///////////<br />var stopit=0 <br />var a=1<br /><br />function init(which){<br />stopit=0<br />shake=which<br />shake.style.left=0<br />shake.style.top=0<br />}<br /><br />function rattleimage(){<br />if ((!document.all&&!document.getElementById)||stopit==1)<br />return<br />if (a==1){<br />shake.style.top=parseInt(shake.style.top)+rector<br />}<br />else if (a==2){<br />shake.style.left=parseInt(shake.style.left)+rector<br />}<br />else if (a==3){<br />shake.style.top=parseInt(shake.style.top)-rector<br />}<br />else{<br />shake.style.left=parseInt(shake.style.left)-rector<br />}<br />if (a<4)<br />a++<br />else<br />a=1<br />setTimeout("rattleimage()",50)<br />}<br /><br />function stoprattle(which){<br />stopit=1<br />which.style.left=0<br />which.style.top=0<br />}<br /><br /></script>

Y esto se lo añades a tu imagen:
<img src="URL DE TU IMAGEN" class="shakeimage" onMouseOver="init(this);rattleimage()" onMouseOut="stoprattle(this)">

Prueba el efecto "tembleque" (IE).

Rosa in memoriam

Còmo quitar autocompletar del mozilla firefox?

Herramientas >> Opciones >> arriba seleccioná Privacidad:

Si campo "Historial" figura >> "Recordará el historial", cambiar por >> "Usará la configuración personalizada para el historial", una vez seleccionado este campo aparecerán más opciones y luego desactivá donde dice "Recordar la información introducida en formularios y barra de búsqueda"

Mini-iconos

En la página de n.DESIGN studio encontraras 320 mini-iconos de uso libre. Estos mini-iconos están diseñados en 14×14 pixeles con el fondo transparente.

Eres libre de utilizar estos iconos para tu sitio personal. Sin embargo, si vas a utilizar más de 10 mini- iconos en tu sitio, debes poner un link a su página.

Esto más o menos es lo que pone en la página (ya sabéis el traductor de Google...), no obstante allí puedes leer los términos de uso antes de descargarte el zip.

Algunos iconitos de los que trae el pack son muy lindos.

Tablas con bordes originales

Habla con bordes punteados.

Código:
<table style="BORDER: red 6pt dotted" width="200" border="0"><br /><br /><tbody><tr><td> <br /><br /><br /><br />TEXTO <br /><br /><br /><br /></td></tr></tbody></table>

Resultado:




TEXTO


Tabla con borde de rayas.

Código:
<table style="BORDER: blue 6pt dashed" border="0" width="200"><br /><br /><tbody><tr><td> <br /><br /><br /><br />TEXTO <br /><br /><br /><br /> </td></tr></tbody></table>

Resultado:




TEXTO


Tabla con doble borde.

Código:
<div align="center"><br /><br /><table style="BORDER: green 4.5pt double; WIDTH: 170.8pt; HEIGHT: 134.8pt" border="0"><br /><br /><tbody><tr><td> <br /><br /><br /><br />TEXTO <br /><br /><br /><br /></td></tr></tbody></table> <br /><br /><br /><br /></div><br /><br />

 Resultado:



TEXTO

Tabla "cuadro"

Código:
<br /><table cellspacing="5" width="200" align="left" border="15"><br /><br /><tbody><tr><br /><br /><td valign="top"> <br /><br /><br /><br />TEXTO <br /><br /><br /><br /></td></tr></tbody></table><br /><br />

Resultado:



TEXTO









Se pueden modificar en los códigos los colores, posiciones, etc...

Rosa in memoriam

Imprimir página

Quieres que tus visitantes puedan tener la opción de imprimir tu página.
Es fácil, debes incluir este código donde quieras que aparezca el link o botón:

<a href="javascript:print()">Imprimir página</a>

También puedes hacerlo con un botón:

Código:
<input type="button" value="Imprimir página" onclick="javascript:print()"></input>

Rosa in memoriam

Recuperar un blog eliminado desde el panel

Blogger ha añadido una nueva función a nuestro panel.
Ya podemos recuperar fácilmente un blog que hayamos eliminado por error o simplemente porque queramos volver a retomarlo. 
Ha sido en el panel de la cuenta donde hago mis pruebas que he podido comprobarlo.
Por descontado que enseguida he pinchado en "Recuperar este blog" y tal como me habían dicho el blog ha vuelto a aparecer en el panel de Blogger.
He accedido al blog y todo estaba tal como estaba antes de ser eliminado, imágenes, entradas, diseño, comentarios... todo en perfecto estado.

Estoy segura que más de uno se alegrará mucho cuando vea en su panel de nuevo el blog que ya daba por perdido... 

Eliminar tu blog

A más de uno le parecerá una tontería pero un visitante de mi blog me manda un mail en el que me pregunta como puede eliminar su blog en Blogger. He intentado mandarle un correo con la respuesta pero me sale un error, así que voy a ponerlo aquí para él, y para cualquiera que tenga la misma duda.

Abrir en la página de Blogger la del panel de control de tu blog.
Accedemos a la pestaña Configuración y casi al comienzo de la página veremos tres enlaces:

Importar blog - Exportar blog - Suprimir blog

Pinchamos en "Suprimir blog".

Si después de haber eliminado el blog, cambiamos de opinión por el motivo que sea, Blogger nos ofrece la opción de recuperarlo.

Extraer audio de video de youtube

Muchas veces no sabés como se llama la canción que suena en un video, la mejor solución es:

Descarga videos de youtube

Recomendación para descargar video de youtube:

http://www.descargaryoutube.com/

720p, buena calidad.

Para que otros nos enlacen

He visto que algunos de mis visitantes han llegado al blog a través de Google buscando el código para colocar en su blog y que otros puedan enlazarlos. Nada más fácil:
1- Antes que nada has de tener la imagen que deseas mostrar, te aconsejo que no sea muy grande pues no a todo el mundo le gusta ponerlas grandes en el blog.
2- Subes la imagen a la red ( ImageShack, por ejemplo)y copias la url de tu imagen.
3- En este código sustituyes "url de tu página" por la dirección de tu blog y "url de tu imagen" por la url que te da ImagesShack.

<a href="url de tu página" target="_blank"><img src="url-de-la-imagen"/></a>
<textarea><a href="url-de-tu-página " target="_blank">
<img src="url-de-la-imagen"/></a></textarea>

Debería quedar así:




Si queremos variar el alto y ancho de la caja de texto, añadimos rows="5" cols="50" justo después de <textarea, donde rows es el alto y cols el ancho. 

Rosa in memoriam

Template Mercado Libre

Uno de los últimos template para Mercado Libre en los que estuvimos trabajando.



Si querés solicitar el tuyo solo ponte en contacto con nosotros.

Botón "Página de Inicio"

Puedes poner en tu blog un botón o link para que tus visitantes si así lo desean puedan usar tu página como "página de inicio" cuando inicien su explorador.

Código para link:

<a onclick="Url= 'http://h-l-t.blogspot.com'; this.style.behavior='url(#default#homepage)';this.setHomePage(Url);" href="#">Convertir en Pagina de Inicio</a>

Resultado:
Convertir en Pagina de Inicio


Código para botón: 

<a onclick="Url= 'http://h-l-t.blogspot.com'; this.style.behavior='url(#default#homepage)';this.setHomePage(Url);" href="#"><form>
<input onclick="javascript:agregar();" type="button" value="Página de Inicio">
</form>
</a>

Sustituyes mi url por la de tu blog.

Rosa in memoriam 

Estilo revista

Acabo de encontrarme con este "truquillo" en Beautiful Beta, dado mi escaso conocimiento del inglés hube de usar el traductor de google para la página, ya sabemos todos como traduce el "invento" así que esto demuestra que el "truquillo" es muy fácil de entender y aplicar.
Supongo que habéis visto en este post que la primera letra es más grande y que queda el "efecto tipo revista" pues esto es lo que vamos a conseguir aplicando este código:


.dropcaps { float:left;
color: #ddd;
font-size:100px; line-height:80px;
padding-top:1px;
padding-right:5px; }

Tenéis que colocarlo en vuestra plantilla - Html- justo antes de ]]></b:skin>

Cada vez que empezáis un post nuevo si queréis que tenga este efecto hay que colocar <span class="dropcaps"></span> e incluir la primera letra entre <span class="dropcaps"> y </span>

Por supuesto eso sería un poco engorroso, para no tener que hacerlo cada vez que publicamos podemos ir a: "editar plantilla - opciones - formato -plantilla de entrada", y en la cajita de "plantilla de entrada" pegamos el ultimo código (<span class="dropcaps"></span>) esto aparecerá cada vez que publiquemos una nueva entrada, sino queremos el "efecto revista" en una de las entradas, borramos ese código y editamos con normalidad.

Nota: En vista previa no funciona.
Espero os sea útil, si surge algún problemilla me lo comentáis por si puedo ayudaros.

AÑADIDO:

Os dejo otro código donde la letra se verá un poco más pequeña (como la que tengo tenía en el blog) pero que también queda guapo.

Colocar esto dentro del CSS de la plantilla, como antes os dije, por ejemplo, antes de]]></b:skin>


SPAN.firstcap {
font-size:250%;
font-weight:bold;
color:#000000;
float:left;
line-height:30px;
width:0.75em;
}

Cuando escribas tus post añades <span class="firstcap">PRIMERA LETRA AQUI</span> y como antes expliqué podéis pegarlo o no en la caja de "plantilla de entrada"

Descarga videos de youtube

Recomendación para descargar video de youtube:

http://www.descargaryoutube.com/

720p, buena calidad.

¿Qué es el pagerank?

PageRankTM (PR) es un valor numérico que representa la importancia que una página web tiene en Internet. Google se hace la idea de que cuando una página coloca un enlace (link) a otra, es de hecho un voto para esta última.

Cuantos más votos tenga una página, será considerada más importante por Google. Además, la importancia de la página que emite su voto también determina el peso de este voto. De esta manera, Google calcula la importancia de una página gracias a todos los votos que reciba, teniendo en cuenta también la importancia de cada página que emite el voto.

PageRankTM (desarrollado por los fundadores Larry Page y Sergey Brin) es la manera que tiene Google de decidir la importancia de una página. Es un dato valioso, porque es uno de los factores que determinan la posición que va a tener una página dentro de los resultados de la búsqueda. No es el único factor que Google utiliza para clasificar las páginas, pero sí es uno de los más importantes.

Hay que tener en cuenta que no todos los links son tenidos en cuenta por Google. Por ejemplo, Google filtra y descarta los enlaces de páginas dedicadas exclusivamente a colocar links (llamadas 'link farms').

Además, Google admite que una página no puede controlar los links que apuntan hacia ella, pero sí que puede controlar los enlaces que esta página coloca hacia otras páginas. Por ello, links hacia una página no pueden perjudicarla, pero sí que enlaces que una página coloque hacia sitios penalizados, pueden ser perjudiciales para su PageRankTM.

Si un sitio web tiene PR0, generalmente es una web penalizada, y podría ser poco inteligente colocar un link hacia ella.

Una manera de conocer el PageRankTM de una página es descargándose la barra de búsqueda de Google (solamente disponible para MS IExplorer). Aparece una barra en la que se muestra en color verde el valor de PageRankTM en una escala de 0 a 10. Sitios web con PR10 son Yahoo!, Microsoft, Adobe, Macromedia, o la propia Google. Teneis una lista completa con los sitios con PR10.

El algoritmo de 'PageRankTM' fue patentado en Estados Unidos el día 8 de enero de 1998, por Larry Page. El título original es 'Method for node ranking in a linked database', y le fue asignado el número de patente 6,285,999.

PageRankTM es una marca comercial de Google Inc.

Rosa in memoriam

Poner un video de You Tube en el blog

You Tube es unos de los más famosos sistemas de internet para subir vídeos y que todo el mundo pueda verlos. Incluir alguno de esos vídeos en nuestro blog es bastante sencillo:

[1] Vamos a la página de You Tube.

[2]En el cuadro de búsqueda ponemos el nombre del vídeo o una referencia de lo que queremos encontrar. Yo he elegido buscar algo de Los Berrones (grupo asturiano de agro-rock).

[3] Normalmente saldrán unos cuantos resultados de la búsqueda.

[4] Una vez decidimos cual queremos, pinchamos en el vídeo y a su lado, mientras se reproduce.

[5] Marcamos donde dice "Embed" y copiamos ese código.

[6] Abrimos una entrada nueva en nuestro blog y en edición HTML pegamos el código.

[7]Publicamos la entrada y ya tenemos el vídeo en nuestro blog.

Ventana con mensaje en texto o imagen

Una ventanita que sale cuando pasas el cursor sobre u texto o una imagen, está bien si quieres dar alguna información adicional o simplemente saludar a tus visitas.

Con texto:
<a href="" onmouseover="alert('TU MENSAJE');return true;"><br /><br />El TEXTO RESALTADO VA AQUI</a><br /><br />

Resultado:

El Escaparate


Con imagen: 

<a href="" onmouseover="alert('TU MENSAJE');return true;"><br /><br /><img src="URL" border="0" /></a><br /><br />

Cronometro para el blog

Hoy me he encontrado en una página con un código para poner un cronometro en el blog, cada vez que se accede al blog el cronometro parte de cero y así va mostrando el tiempo que permaneces visitándolo. Siento no poder poner la dirección del sitio...cerré la página por error y no supe encontrarla de nuevo, y es una pena porque incluso tiene el contador subido a ImageShaks, solo copiarlo y pegarlo.
Si lo colocáis en un elemento en la sidebar de HTML-Javascript se verá perfecto y no separado como en esta entrada.
Código:

<div align="center"><img height="70"src="http://img394.imageshack.us/img394/1883/8b3k1za.gif" width="67" /><img src="http://img394.imageshack.us/img394/3568/16669cw.gif" /><img src="http://img394.imageshack.us/img394/9936/ani45ws.gif" /><img height="70" src="http://img394.imageshack.us/img394/7518/ani40ea.gif" width="85" /></div>

Resultado:


Rosa in memoriam

Si llegaste hasta acá y no lo encontraste lo que necesitás intentá buscarlo: