Insertar en web publicaciones de Google, Twitter o Facebook | Oloblogger Apenas hace unos pocos días me enteré de que ya es posible embeber posts de Google Plus en el blog. Esto es una cosa que ya se podía hacer d...

28 de septiembre de 2013

Insertar en web publicaciones de Google, Twitter o Facebook

Apenas hace unos pocos días me enteré de que ya es posible embeber posts de Google Plus en el blog. Esto es una cosa que ya se podía hacer de manera nativa con Twitter y también desde hace no mucho con Facebook, así que las tres principales redes sociales ya tienen algún sistema para hacerlo. De cara a los administradores de sitios, las tres han desarrollado esta utilidad de una manera muy parecida.

La ventaja de insertar en un artículo un post es que, a diferencia de una simple captura, estos posts serán interactivos, es decir, permitirán que los visitantes puedan hacer +1, Like o RT, por ejemplo, sin salir de la página del artículo en cuestión.

Hay que tener en cuenta que si el post en la red social se elimina, el embebido también desaparecerá, así que si se incluye en una entrada a modo de memoria o para dar fe de algo, el método de la captura de pantalla seguirá siendo el más conveniente.


Incrustar posts de Google+


El código para Google+ se consigue teniendo a la vista el post que se desea insertar. Al pasar el puntero por encima de él aparecerá una pequeña flecha en la parte superior derecha y en ella encotraréis un desplegable con diversas opciones. La que nos interesa es la de Insertar publicación.

Seleccionando dicha opción ya se nos ofrece el código para embeber el post.

Embeber posts de Google Plus

Y como no, a continuación una demo en vivo:


Si ya tenéis la librería plusone.js instalada en vuestro sitio (Blogger la lleva y cualquiera que tenga los botones +1 también), bastará con copiar y pegar la segunda parte del código:

<div class="g-post" data-href="https://plus.google.com/113123294987767899361/posts/6yJop2eV5r4"<

Si en el futuro no queréis desplegar, copiar, pegar y borrar lo innecesario, fijaros en que simplemente se trata de añadir una caja con clase g-post y una dirección (data-href) igual a la del post, que se obtiene al pinchar en la fecha del mismo.

Los número de esa dirección son en realidad, de izquierda a derecha, la ID del perfil que lo publicó y ID del post.


Incrustar posts de Facebook


Como decía al principio, el método para embeber posts en estas tres redes es muy similar, así que para los otros ya me voy a ahorrar el gif animado.

En Facebook también hay una flechita igual a la de Google+ para desplegar el menú de opciones e incluso las palabras mágicas son las mismas: Insertar publicación. Ahí conseguiremos el código para copiar.

Incrustar publicaciones Facebook en una web

Al igual que antes, no es necesario cargar la primera parte del código si ya se dispone en la página del botón Me gusta o de cualquier otro gadget de Facebook, con lo que el código puede quedar reducido a una línea dónde la parte a personalizar es sólo la ID de la publicación que incluye el enlace:

<div class="fb-post" data-href="https://www.facebook.com/oloblogger/posts/10151646157067765" data-width="550">
</div>

No sé si en el momento de leer esto tendrás ya disponible la opción de insertar publicaciones en tu perfil, pero si no es así, en esta entrada tienes explicada una manera de hacerlo y otros pequeños apuntes.




Incrustar Tweets


Por último, la red que de entre estas tres fue realmente la primera en facilitarnos esto de añadir sus publicaciones en nuestros sitios.

Cada tweet dispone de un enlace con nombre ***Más dónde aparece junto con otra opción la de Insertar Tweet. Esta evidentemente es la que escogeremos para este caso.

Tweet interactivo en el blog

Una vez más, si ya tenemos algún widget de esta red y/o tenemos cargada la librería widgets.js de Twitter, podemos simplificar el código eliminando esa parte.

<blockquote class="twitter-tweet"><p>Nuevo post ► Gadget para mostrar los últimos tweets de manera rotativa <a href="http://t.co/gcIfLRH6vR">http://t.co/gcIfLRH6vR</a></p>— Oloman (@oloman) <a href="https://twitter.com/oloman/statuses/375320768554741760">September 4, 2013</a></blockquote>

¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.

Compartir
Copy URL

Y muchos más artículos interesantes si nos sigues en...

follow us in feedly

9 comentarios :

  1. Hola Olomán, perdóname el off-topic, pero como eres mi gurú personal en estos temas, creo que este debe ser el mejor lugar para aclarar una duda que tengo.

    Ya sabes que han rediseñado la apariencia en Facebook, pequeñas chorradas como la barra de navegación y notificaciones y algunas cositas más.

    El caso es que últimamente miro esa nueva barra y a veces está normal con su "Buscar amigos, inicio, y el nombre de usuario, pero otras pone lo mismo pero en lugar de inicio pone inicio1, o inicio2 y no entiendo por qué aparecen.

    En cuanto pincho en ese inicio2 o inicio1 se vuelve a poner normal y en inicio, pero si no pincho ahí, sigo navegando con ese "inicio1 o 2". ¿Es preocupante o me preocupo por nada?.

    Gracias de antemano por tu respuesta.

    Ps. me he fijado que en tu pág de música en la de "otros lares" a veces el feed no actualiza correctamente, por lo menos con mi pag "Play this music loud". No es que sea importante, sólo te lo cuento porque el otro día aun estaba el post de los "Celtas Cortos" y su "Vamos Eileen" cuando ya llevaba más de un día publicado el de Eric Carme "All by myself".

    Saludos amiguete y si no das con lo que es no hay problema. De momento no veo que me haya afectado (si es que lo hace).

    eMe (Te dejo el perfil donde me sucede aunque no creo que tu lo aprecies a simple vista)

    Facebook https://www.facebook.com/milu.logar

    ResponderEliminar
    Respuestas
    1. Ok, estoy en la inopia jajaja, son el numero de actualizaciones que hay de gente que sigo o amigos mientras hago otras cosas en Facebook.

      Puedes borrar los comentarios si quieres, así de paso no pareceré tan gilipollas después de tantos años jajaja.

      Saludos bro

      Eliminar
    2. :) Eso te iba a decir, que son notificaciones sobre las nuevas cosas que hay en tu muro.

      Y sobre lo de la página dónde se muestran los últimos artículos de tu blog, la actualización no es en tiempo real, ese es simplemente el motivo. Los distintos gestores de feeds y sus gestores funcionan con distintas demoras.

      Eliminar
    3. Gracias tío, eres un crack, siempre al quite (y).

      Mas que cosas en mi muro es el feed de la gente que sigo o son amigos mios y cuando añaden algo nuevo a sus muros salen los dichosos numeritos jajaja (no vaya a ser que alguien lo lea y le cree confusión, ya sabes, la de Confucio jajaja)

      Saludos y gracias otra vez meu :)

      Eliminar
  2. Hola Oloman como puedo hacer eso en blogger? como agrego las librerias no me funciona con mis entradas

    ResponderEliminar
    Respuestas
    1. Hola. Esto se puede hacer tal cual en cualquier plataforma. Tú no quites nada, que eso es sólo una sugerencia para gente que tiene cargadas las librerías de las distintas redes sociales. Simplemente sigue las instrucciones que acompañan las ilustraciones de esta entrada y consigue el código. Luego pégalo entero en tu blog dentro de una entrada y funcionará. Seguro.

      Eliminar
  3. Hola, Oloman. No sé si sea yo o qué esté sucediendo pero desde hace poco ya cuando inserto un tweet me sale como puro texto, sin el formato normal de twitter (por ejemplo esto). ¿Será algo de mi plantilla o de blogger? Pregunto porque veo que en este post de tu blog también sale puro texto.

    ResponderEliminar
    Respuestas
    1. Qué extraño, ahora que lo veo con otro usuario de google sí se ven los tweets como debe ser. Bueno, supongo que es algo con mi cuenta que no deja que salga bien. Disculpa la molestia, un saludo!

      Eliminar
    2. Ninguna Rocío. Un saludo

      Eliminar