Dos pack de íconos de Facebook

FaceFile
	Contiene 5 íconos de 512x512, en formato PNG. descargar

Wall E
	Contiene 4 íconos de diversos tamaños, en formato PNG. descargar

¿Es posible recuperar entradas eliminadas de Blogger?

Si pero no; depende; hace tiempo, Blogger disponía de esa posibilidad pero ya no sin embargo, aún es posible pero debemos tener un dato: el ID de ese post: menudo detalle, claro.

¿Y dónde lo obtenemos? Eso, sólo es posible hacerlo si la entrada ya fue indexada y aún podemos verla en la caché de los buscadores o en el mismo feed de nuestro sitio. No, no es fácil pero, es nuestra única esperanza.

Si por alguno de los métodos anteriores, podemos acceder a esa entrada, bastaría que buscáramos ese dato en el código fuente; por ejemplo, en la página web, se encuentra casi al principio, dentro de una etiqueta LINK con la URL de los feeds de comentarios:

<link rel="alternate" type="application/atom+xml" title="NOMBRE BLOG - Atom" href="http://misitio.blogspot.com/feeds/XXXXXXX/comments/default" />

donde XXXXXXX será el ID de la entrada o bien dentro de un ANCHOR ya que por defecto, las plantillas incluyen esto:

<a expr:name='data:post.id'/>

Una vez que tenemos ese dato, basta armar la URL con el el ID de nuestro blog que es ese número que se muestra al crear una entrada nueva:

http://www.blogger.com/post-create.g?blogID=XXXXXXX

así que combinamos ambos datos:

http://www.blogger.com/post-edit.g?blogID=XXXXXXX&postID=XXXXXXX

y estaremos editando la entrada que habíamos borrado así que bastaría volver a publicarla o guardarla para que todo siga como antes y, en principio, si la entrada tenía comentarios, estos también serán restaurados.

REFERENCIAS:The Real Blogger Status

Rainbow es un plugin para jQuery que permite mostrar códigos que queremos compartir, agregándoles estilo, de tal modo que la sintaxis se destaque y sea fácilmente legible.

A diferencia de muchos otros, tiene la particularidad de ser muy liviano y el script, lo podemos personalizar, seleccionando los idiomas que solemos usar (HTML, JavaScript, CSS, PHP, Ruby, Shell, Python, C) de esta forma, el código a cargar se reduce de modo sustancial.

A esto, se le suma la posibilidad de utilizar distintos temas de CSS que podemos descargar y aplicar o, simplemente copiar y pegar su contenido dentro de etiquetas <style> </style>. En este momento hay seis de ellos disponibles y como sólo definen unas pocas reglas de estilo, son sencillos de modificar manualmente, adaptándolos a nuestros gustos personales.

Así que si queremos usar el plugin, lo pondríamos antes de </head>:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js' type='text/javascript'></script>
<script src='URL_rainbow-custom.min.js' type='text/javascript'></script>
<link href='URL_theme.css' rel='stylesheet" type='text/css'>

Para utilizarlo en cualquier entrada, basta usar las etiquetas PRE y CODE y, en esta última, indicar el tipo de lenguaje; de este modo:

<pre>
  <code data-language="javascript">
    ....... el código que queremos mostrar .......
  </code>
</pre>

Se vería algo así:

<pre>
  <code data-language="javascript">
    ....... el código que queremos mostrar .......
  </code>
</pre>

Lo mismo ocurrirá con cualquiera de los lenguajes que hayamos seleccionados; sólo hace falta indicarlos en el atributo data-language.

data-language="javascript"

Un artículo de speckyboy nos enseña a crear una caja de búsqueda con estilo; bueno, todas tiene estilo pero esta tiene ESTILO.

Como es un elemento muy común y que se usa en casi cualquier sitio, vamos a ver la manera de realizarla ya que podríamos emplearla incluso en Blogger aunque, claro está, como la mayoría de las cosas que usan CSS3 y HTML5, en las viejas versiones de Internet Explorer funcionará de modo parcial, mejor dicho, funcionará bien pero no se verán ciertos efectos.

Primero que nada, el HTML básico es algo así:

<form class="formulariodemo cf">
  <input type="text" placeholder="ingresar texto ..." required>
  <button type="submit">buscar</button>
</form>

El formulario es simple y podría tener más parámetros; la primera etiqueta INPUT usa los atributos placeholder y required que son optativos y el botón de envio, en lugar de estar en otra etiqueta INPUT, se encuentra en una etiqueta BUTTON; obviamente, a la etiqueta FORM se le deberán agregar los atributos extras que necesite según sea el sitio donde se agregue. Un ejemplo:

<form class="formulariodemo cf" action='http://nombre.blogspot.com/search' method='get'>
  <input type="text" placeholder="ingresar texto ..." required name="q" >
  <button type="submit">buscar</button>
</form>

Y ahora, el largo, largo, largo CSS:

<style>

  .cf:before, .cf:after {
    content:"";
    display:table;
  }
  .cf:after {clear:both; }
  .cf { zoom:1; }

   /* el formulario en si mismo */
  .formulariodemo {
    background-color: #303941;
    border-radius: 10px;
    box-shadow: 0 0 2px #606971 inset;
    margin: 0 auto;
    padding: 15px;
    width: 450px;
  }

   /* la caja donde se ingresa el texto a buscar */
  .formulariodemo input {
    background-color: #EEE;
    border: none;
    border-radius: 3px 0 0 3px;
    float: left;
    font-family: Tahoma;font-size:15px;font-weight: bold;
    height: 20px;
    padding: 10px 5px;
    width: 330px;
  }
  .formulariodemo input:focus {
    outline: 0;
    background: #FFF;
    box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
  }

  /* el estilo de del atributo placeholder debe ser declarado para cada navegador de modo separado */
  .formulariodemo input:-moz-placeholder { color: #999; font-weight: normal; font-style: italic; }
  .formulariodemo input::-webkit-input-placeholder { color: #999; font-weight: normal; font-style: italic; }
  .formulariodemo input:-ms-input-placeholder { color: #999; font-weight: normal; font-style: italic; }

  /* aquí iría el estilo de del atributo required si es que se desea definirlo */
  .formulariodemo input:required { box-shadow: none; }

   /* el botón de envio */
  .formulariodemo button {
    background-color: #9099A1;
    border: none;
    border-radius: 0 3px 3px 0;
    color: #FFF;
    cursor: pointer;
    float: right;
    font-family: Tahoma;
    font-size: 15px;
    font-weight: bold;
    height: 40px;
    overflow: visible;
    padding: 0;
    position: relative;
    text-transform: uppercase;
    text-shadow: 0 -1px 0 rgba(0, 0 ,0, .3);
    width: 110px;
  }
  .formulariodemo button:hover{ background: #E54040; } 
  .formulariodemo button:active, .formulariodemo button:focus{ background: #C42F2F; }
  .formulariodemo button:before { /* el detalle del triángulo izquierdo */
    content: "";
    border-color: transparent #9099A1 transparent;
    border-style: solid solid solid none;
    border-width: 8px 8px 8px 0;
    left: -6px;
    position: absolute;
    top: 12px;
  }
  .formulariodemo button:hover:before { border-right-color: #E54040; }
  .formulariodemo button:focus:before { border-right-color: #C42F2F; }    

</style>

Y este sería el resultado final:

Una animación con CSS es algo similar a una transisicón que se repite un número de veces y requiere de dos partes, establecer los intervalos y propiedades a modificar en @keyframes y la propiedad animation en cualquier etiqueta.

leer artículo actualizado

Así como hay una manera de mejorar la forma de compartir las entradas en Facebook, podría ser que hubiera otra para hacer lo mismo en Google+. Al igual que la anterior, es una parte no demasiado documentada del API sobre la cual hay muchos foros que intentan poner algo de luz En este caso, el código es menos engorroso ya que no tiene opciones (o nadie ha descubierto si las hay); sólo se trata de una dirección URL a la cual se le adosa la dirección de la entrada a compartir, lo que daría como resultado algo como esto:

Al carecer de alternativas extras, tanto el resumen como la imagen, dependerán de Blogger ya que de poco sirve usar etiquetas META OpenGraph que es lo que leen los distintos servicios ya que no podemos modificarlas para cada entrada; aunque ahora la etiqueta META description puede ser personalizada, no ocurre lo mismo con la imagen. De todas maneras, esto es mejor que nada. La URL básica es:

https://plus.google.com/share?url=direccion_a_compartir

Así que esto, permitiría abrir la ventana del ejemplo:
https://plus.google.com/share?url=http://vagabundia.blogspot.com/2012/03/las-opciones-de-las-etiquetas-meta.html

Y para incluirlo en al plantilla, deberíamos colocar una URL dinámica, es decir, una etiqueta de Blogger que indique la dirección de la entrada: data:post.url Por lo tanto, colocando lo siguiente en alguna parte del footer de las entradas, tendríamos un botón para compartir en Google+

<a expr:onclick='&quot;window.open(\&quot;https://plus.google.com/share?url=&quot; + data:post.url + &quot;\&quot;,\&quot;gplusshare\&quot;,\&quot;toolbar=0,status=0,width=548,height=325\&quot;);&quot;' href='javascript:void(0);' rel='nofollow' title='compartir en Google+'> texto o image </a>

1Al parecer, algunos usuarios de Blogger tienen problemas para acceder a las entradas marcadas como Borradores" cuando usan la nueva interfaz; no se ve la opción en el menú.

Según The Real Blogger Status, el problema se soluciona con facilidad aunque, obviamente, es un error del sistema que imagino que alguien tendrá que resolver.

Para intentarlo, hay que editar cualquier entrada ya publicada y guardarla como Borrador. Luego, volver a editar esa misma entrada y publicarla otra vez.

Aparentemente, eso hará que vuelva a aparecer la lista en el menú pero ... temporalmente; la próxima vez que se entre a Blogger, a menos que ellos hayan arreglado el fallo, la lista de borradores volverá a "desaparecer" y habrá que hacer otra vez lo mismo.

2Para quienes usen el gadget de Seguidores y este se vea en blanco, pueden intentar la solución que muestra Ciudad Blogger que también es sencilla.

Lo que debe hacerse es cambiar el nombre del blog la primera pantalla de Configuración de Blogger. Guardar el cambio y volverlo a cambiar por el original. Hecho eso, el gadget debería volver a tener contenido.

Lo mismo ocurre si en lugar de cambiar el nombre del blog, se cambia la dirección url pero, el nombre es un proceso menos traumático.