JMiur [E]

Según anuncian en su blog oficial, Google ha realizado otro cambio en su botón +1 para permitir que las entradas puedan enviarse y compartirse, de manera similar al botón compartir de Facebook.

Como en casos anteriores, los cambios sólo son accesibles desde la página de opciones siempre que se seleccione el idioma inglés y, por ahora, sólo se aplican a quienes se hayan registrado en Google+ Platform Preview sin embargo, nada impide modificar el código de nuestros botones para que ya estén preparados.

En Blogger, por lo general, usamos algo similar a esto:
<b:if cond='data:blog.pageType == "item"'>
  <g:plusone size='medium' />
</b:if>
simplemente, debemos agregarle un nuevo atributo:
<g:plusone size='medium' annotation='inline' />
Hay que recordar que en este ejemplo, el botón sólo se visualiza en las páginas individuales y si alguien quiere que también sea visible en el home, es imprescindible que se añada la URL ya que en ese caso, no habrá un botón en la página sino varios y en cada uno de ellos se debe indicar de manera explícita, la dirección de la entrada.

En esos casos, el código debería ser algo así:
<g:plusone size='medium' annotation='inline' expr:href='data:post.url' />
Eso que se comparte, Google lo denomina snippet, que no es otra cosa que un resumen de la página acompañada por una imagen. Estos snippets pueden ser personalizados pero, en Blogger, no sé si será posible ya que para eso se necesitan agregar unas etiquetas META, similares a las que utiliza Facebook (la verdad, podrían ponerse de acuerdo y unificarlas para no molestarnos con sus guerras empresariales) pero, imagino que tendrán las mismas restricciones; al no poder acceder a los datos necesarios, es probable que nos veamos privados de esa posibilidad. Habrá que ver si el servicio lo hace de modo automático o no.

De todos modos, Google dice que para usar este tipo de cosas, deberíamos agregar un atributo (otro más) a la etiqueta HTML:
<html itemscope itemtype='http://schema.org/Article' .................................. >
Y definir los datos a mostrar con estas etiquetas:
<meta itemprop='name' content='el título de la entrada' />
<meta itemprop='description' content='la descripción o resumen de esa entrada' />
<meta itemprop='image' content='la imagen que acompaña ese resumen' />
Por lo que ahora veo. Parecería que existe una foram de personalizar eso en Blogger y en Customize +Snippet, seleccionar:

Markup Location:
Inside the page's <head> tag.
Inside the page's <body> tag.

De ese modo, en luagr de usar etiquetas META usamos etiquetas SPAN e imagino yo que podrán colocarse dentro del LOOp de las entradas:
<span itemprop='name'>el título de la entrada</span>
<span itemprop='description'>la descripción o resumen de esa entrada</span>

16 comentarios:

David J. 'Batto'  

Lo he probado pero el atributo annotation='inline' me fastidia la plantilla, haciendo que los botones de redes sociales no salgan en una sóla líbnea como me aparecen ahora:

http://ramenparados.blogspot.com/

Si meto ese atributo el +1 parece queres una sola línea para él y me fastidia el diseño. ¿Por qué será?

Gran post , gracias!

Responder
JMiur  

Eso puede ser porque el ancho requerido por el botón para esta alternativa es de 450 pixeles, igual que el Me Gusta de Facebook.

Como no sé cuál es el resultado final ya que por ahora, no está disponible, no puedo decirte si ese ancho es necesario o no.

De todos modos, el ancho puede ser modificado con CSS; simplemente, coloca el código del botón dentro de una etiqueta y dale a esa etiqueta un ancho fijo.

Responder
Karla  

Ayer lo veía precisamente en la página y luego buscando la noticia, vi la de Mashable la cual twittie, pero sabes que JMiur, yo no entiendo tanto afán en estar actualizando como locos, para empezar, esas actualizaciones solo son visibles cuando copias en código al tener la página en Inglés, si la poner en Español, por ejemplo, el código es el mismo y no incluye ningún otro atributo, tampoco la actualización para que el botón cargue más rápido, lo cual significa que quien lo copie en otros idiomas, simplemente no podrán agregar nada y además el botón funciona perfectamente si estarle metiendo tanto la mano :), creo que lo mejor es respirar, relajarse y esperar el producto final, que por lo que se ve, le debe faltar mucho...

Que show...

Responder
Enzo Sánchez  

Yo voy a esperar que pase un poco de tiempo, nos van a volver locos con tantos cambios seguidos!

Responder
TuMultitec  

hola mira solo para hacerte una pregunta del porque mi boton no funciona cuando le doy +1 no muestra el +1 en tiempo real hasta que se actualiza la pag. sabes porque.? mira, prueba --> http://www.tumultitec.com.ar/

Responder
JMiur  

Karla:
No existe obligación alguna de hacer actiualizaciones; es algo personal. Basta saber que existen y decidir.
La página, si se entra en español, no tiene cambio alguno. Eso, es negligencia de Google que no actualiza o simplemente es el viejo concepto de suponerse el ombligo del mundo. De todas manera, el código que se muestra, entrando en idioma inglés, es perfectamente aplicable a cualquier sitio ya que el idioma específico del botón, se selecciona de manera independiente.

Enzo Sánchez
Es Google. Su costumbre es esa. Antes las llamaba Betas. Ahora no las llama de ninguna manera pero, sigue haceindo lo mismo de toda la vida:presentar servicios inconclusos.

TuMultitec:
No, eso no sabría respondértelo.

Responder
Jonathan  

Ya espero que llegue pronto.

Responder
Felipe  

Por lo que acabo de ver, creo que ya no es necesario hacer este cambio, porque el botón agrega la opción de compartir sin añadir el parámetro extra. Gracias por mantenernos siempre informados al minuto :)

Responder
JMiur  

Pues no es lo que dice Google. Las opciones disponibles son tres:

sin atributo lo llama bubble y es el standard:
<g:plusone></g:plusone>

para que no exista ningún tipo de "anotación" o "snippet" se debe indicar con none:
<g:plusone annotation="none"></g:plusone>

este otro modo (que aún no está disponible o lo está de modo parcial) se debe indicar con el valor inline:
<g:plusone annotation="inline"></g:plusone>

Qué es lo que hará este último, lo desconozco y no hay información oficial de ningún cambio.

Responder
rf.resources  

Pues yo tengo un problema y es que al darle al boton +1 y compartirlo en google+ se me pone como imagen acompañante una cualquiera del blog y no se como cambiarla, se puede?

Responder
JMiur  

En Blogger, no veo que exista la posibilidad de establecer eso.

Responder
rf.resources  

Ok gracias!

Responder
Martin Rocha  

jmiur te jodo por los botones sociales je.
Los agregue debajo de cada post en la pag principal incluido este pero al darle me gusta, +1 o twittear hacen referencia a la pagina principal y no a la entrada.
Que tengo mal agregado?
el blog es http://dmbeta.blogspot.com/, un saludo

JMiur  

En ese caso, debes agregar la URL específica; en Google+ sería:

<g:plusone expr:href="data:post.url" size="small"></g:plusone>

En los otros servicios sería similar, fíjate en las distintas entradas que hablen del tema porque la sintaxis depende de cada caso aunque todos harán referencia a data:post.url

Martin Rocha  

muchas gracias ahora si quedo bien, el que no pude encontrarle solucion es al de twitter, aunque en el sitio oficiall dice que sirve para entradas a mi solo me hace referencia a la url de origen, hay que agregarle algo mas?

JMiur  

No sé cuál de los distintos botones de Twitter estás usando. Todos tienen el mismo criterio, si están en una página, toman la URL de esa página pero, si se quieren referenciar a distintas entradas, debe colocarse la URL de manera explícita.

Un ejemplo:

<a expr:href='"http://twitter.com/home?status=" + data:post.title + ": " + data:post.url'> .................

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Todos los archivos y demos alojados en Fileden han sido redireccionados y deberían estar funcionando correctamente.
De todos modos, también puede accederse a ellos a través de SkyDrive

Nota: sólo los miembros de este blog pueden publicar comentarios.

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR