La página de Referencia de Facebook Developers es un auténtico arsenal de "gadgets" o "plugins" que pueden servirnos para mejorar nuestras posibilidades sociales. El problema es también saber incorporarlos sin afectar al rendimiento de nuestras páginas.
Vamos a repasar una selección de los mejores complementos de Facebook que podemos utilizar en nuestro sitio web o Blog para mantener unidos el mundo de la red social con la información que proporcionamos en nuestros contenidos.
Vamos a aprender con unas guías explicativas que no requieren grandes conocimientos en programación a insertar en nuestro sitio web o Blog los principales "Widget" de n Facebook: como el "Me gusta", los comentarios de Facebook a nivel de entrada, el diario de actividad del Blog, la publicación automática de entradas o el "LikeBox" que tanto puede ayudar a conseguir más "me gusta" para tu página Facebook desde tu web o Blog. Sácale partido a Facebook.
Conceptos Iniciales, ¿Qué vamos a hacer?:
Vamos exponer los "Widgets" o componentes oficiales de Facebook para incorporarlos a nuestro sitio web o Blog. De esta manera nuestros usuarios podrán interactuar con la red social a través de nuestras publicaciones compartiendo de diversas formas la información que proporcionamos.
Recomendaciones:
Es importante hacer la reseña de rendimiento, la incorporación de "scripts" de aplicaciones externas a nuestro Blog pueden implicar un sobrecoste para el rendimiento del mismo. Es necesario que cada vez que incorporemos esta clase de elementos en él, midamos el rendimiento del sitio con Page Speed para evaluar si estamos perdiendo velocidad de ejecución y más que suponer una ventaja, suponga un inconveniente.
Los 5 componentes que mejor conectan tu sitio web o Blog a Facebook:
Pulsa en "Mostrar / Ocultar cómo se hace" de cada guía para poner el componente de facebook en tu sitio web o Blog.
1) El Clásico, el botón "Me gusta": incorpóralo a tu sitio web o Blog con unos sencillos pasos.
Configúralo en tres pasos
1) En la página de Facebook https://developers.facebook.com/docs/reference/plugins/like/ dispondrás de los botones que requieres para añadirlo a tu Blog.
 |
| Selección de botones de Facebook para incluir en tu navegador |
2) Introduce la URL de tu Blog en "URL to like" y selecciona "Layout Style" "button_count" para que podamos tener espacio en el Blog y no ocupemos todo el espacio disponible en la botonera inferior con sólo los botones de Facebook.
3) Pulsa el botón "Get Code" y cópiate el código en un editor de texto o en el porta-papeles para luego pegarlo en tu sitio web o blog.
Añádelo a tu sitio web:
Para un sitio web estándar, simplemente copia y pega el contenido extraído de "Get Code" en la zona de la página donde te interese que aparezca.
Añádelo a tu sitio Blog de Blogger:
1) Realiza una copia de seguridad antes de cualquier cambios para poder volver atrás en caso de error.
2) Dentro de Blogger, dirígete a "Plantilla" y pulsa el botón "Editar HTML" para realizar los siguientes pasos.
 |
| Al editar el HTML de tu plantilla aparecerá todo el código de la misma. |
3) Pulsa CONTROL + F dentro del recuadro de código y busca: <b:includable id='shareButtons' var='post'> O <div class='goog-inline-block dummy-container'>
En esa zona se encuentran todos los botones para compartir que por defecto Blogger añade en tu plantilla a tus entradas. Justo después del goog-inline-block dummy-container y su etiqueta </b:if> puedes colocar el código que te proporcionó Facebook ("get code") para añadir su "Me gusta".
4) Al final del último botón que Blogger utiliza para colocar tus botones de compartir añade el código marcado en rojo:
<b:includable id='shareButtons' var='post'>
[...] <b:if cond='data:top.showDummy'> <div class='goog-inline-block dummy-container'> <data:post.dummyTag/> </div> </b:if>
<b:if cond='data:blog.pageType == "item"'><!--AQUI COMIENZA EL CÓDIGO DE FACEBOOK--><table cellspacing='0' width='100%'><tr><td align='left' halign='bottom' height='70' valign='bottom' width='100%'><div class='fb-like' data-href='NOMBRE_DE_TU_BLOG' data-layout='button_count' data-show-faces='false' data-width='450'/><div class='fb-send' data-href='NOMBRE_DE_TU_BLOG'/></b:if></b:includable>
Despues de <b:includable id='shareButtons' acompaña bastante código que he suprimido para no hacer ilegible el código. Dentro de los sharebuttons busca el <b:if cond='data:top.showDummy'> y justo después puedes añadir el código de Facebook que extraíste de la página de Facebook Developers. No olvides que después del código de facebook debe ir el </b:if> Y </b:includable> para que todo esté correcto.
2) Los comentarios de Facebook para tu sitio web o Blog.
Nos conectamos a la URL de Facebook Developers, a la página para el "widget" de comentarios: http://developers.facebook.com/docs/reference/plugins/comments/
 |
| Página de configuración del "Widget" para comentarios de FaceBook |
- Introduce los datos en la sección de configuración del widget de la página de Facebook:
- Introduce en "URL to comment" la dirección de tu Blog.
- En Width pon el ancho que desees establecer para el widget. Puedes cambiarlo después tranquilamente cuando lo insertes en tu Blog.
- Selecciona en "Color Scheme" el esquema de color que deseas darle. Si tu Blog es claro puedes seleccionar "Light" si es oscuro te recomiendo "dark".
- A continuación pulsa sobre el botón "Get code" para obtener el código fuente que debes poner en tu sitio web. Tendrás dos divisiones, una con el código que debes introducir en el <body> de tu blog y otra con el código que introducirás en el Gadget HTML/Javascript donde residirá finalmente el Widget de comentarios de Facebook.
Añádelo a tu sitio web:
Para un sitio web estándar, simplemente copia y pega el contenido extraído de "Get Code" en la zona de la página donde te interese que aparezca.
Recuerda introducir primera parte del código (el javascript) en el Body y el resto (los comentarios) en la zona donde deseas que aparezcan de tu página web.
Añádelo a tu Blog de Blogger:
Ahora sólo queda insertar el código extraído de Facebook en tu Blog. Dentro de Blogger dirígete al menú de la izquierda, a la opción Diseño.
En primer lugar realiza una copia de seguridad de tu sitio. Aunque es realmente sencillo lo que vamos a hacer, recomiendo que previamente tengamos a buen recaudo nuestro código original, de manera que siempre podamos "volver atrás" ante cualquier error. No dejes de realizar esta guía paso a paso para salvaguardar tu blog.
En Blogger, en el menú de la izquierda, dirígete a la opción "Plantilla" y pulsa "Editar HTML". Localiza la etiqueta "<body" (no pongas la etiqueta de cierre de body) y justo debajo inserta el código que extraiste de Facebook correspondiente al apartado del "<body>".
|
| Pantalla de edición de la plantilla HTML. pulsa CONTROL + F y busca la etiqueta "<body" |
<div id="fb-root"></div><script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/es_ES/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));</script>
NOTA: Debido a la última actualización que Facebook ha introducido en sus scripts, si te da errores en la plantilla al tratar de salvar el código anterior, utiliza este que a continuación te muestro.
Si este código ya lo tenías añadido con anterioridad por tener alguna funcionalidad de Facebook incorporada ya al Blog, no es necesario que vuelvas a meterlo y puedes pasar al siguiente punto.
- Ahora, de nuevo pulsando CONTROL+F busca la siguiente línea de código:
shareButtons
- Encontrarás esa palabra clave con el siguiente código:
<b:include data='post' name='postQuickEdit'/>
</span> <div class='post-share-buttons goog-inline-block'>
<b:if cond='data:post.sharePostUrl'>
<b:include data='post' name='shareButtons'/>
</b:if>
</div> </div>
- Justo debajo del doble cierre de div: </div> </div> introduce el código que recuperaste de la página de Facebook Developers para añadir los comentarios de Facebook junto con una línea condicional que hará que sólo salgan cuando el usuario acceda al detalle de una entrada:
<b:include data='post' name='postQuickEdit'/>
</span> <div class='post-share-buttons goog-inline-block'>
<b:if cond='data:post.sharePostUrl'>
<b:include data='post' name='shareButtons'/>
</b:if>
</div> </div>
<b:if cond='data:blog.url != data:blog.homepageUrl'>
<div id='comentariosFacebook'><div class='fb-comments' data-colorscheme='light' data-num-posts='5' data-width='500' expr:href='data:post.canonicalUrl'/></div>
</b:if>
- <b:if cond='data:blog.url != data:blog.homepageUrl'></b:if> : El "if cond" y su cierre al final en rojo expresan que sólo se mostrará lo que entre sus etiquetas se encuentre, cuando el usuario acceda al detalle de una entrada (cuando pulse "Más información").
- <div id='comentariosFacebook'><div class='fb-comments' data-colorscheme='light' data-num-posts='5' data-width='500' expr:href='data:post.canonicalUrl'/></div>: Es el código que extraiste de Facebook Developers para colocar la edición de comentarios de la citada red social. Podrás modificar el "widht" (ancho) con respecto al ancho en píxeles de tus entradas.data-num-posts='10' :indica el número máximo de comentarios por página. Presta especial atención al uso de data:post.canonicalUrl que permitirá que el comentario quede exclusivamente vinculado a la entrada donde se ha realizado.
- Pulsa "Guardar Plantilla" y ya lo tienes.
3) Publica tus entradas automáticamente en facebook.
1) Conéctate a https://apps.facebook.com/rssgraffiti/ para utilizar el gestor de RSS o la aplicación que se suscribirá a las actualizaciones que vamos a realizar en nuestro Blog.
 |
| Si no hay permiso para que Graffiti se ejecute en tu Facebook se te mostrará esta pantalla. Simplemente dale acceso para que puedas utilizar el RSS y publicar tus entradas en Facebook sin necesidad de hacerlo manualmente cada vez que publiques una. |
2) Necesitarás darle permiso a rssgraffiti para acceder a tu perfil de Facebook. Lee la política de privacidad y todos los términos. Aparecen en forma de enlaces azules sobre el botón "Aceptar".
 |
| Pulsa Aceptar para conceder el persmiso a RSS Graffiti |
 |
| Pulsa el botón Add new Publishing plan |
3) Para añadir nuestro Feed y concretamente el de nuestras entradas, bastará con rellenar los datos que indica la pantalla con el formulario para indicar nuestro Feed.
Selecciona SOURCE (lado izquierdo) e introduce el Feed de tu Blog
 |
| Al seleccionar SOURCE se te solicitará el Feed de Origen que vas a utilizar. En él introduce el Feed de tu Blog tal como te explico en la guía. |
Feed URL: es la dirección de nuestro Feed. Es tan sencillo como poner http://feeds.feedburner.com/NOMBRE_DE_TU_BLOG. En mi caso, como mi blog se llama diariosdelanube, tendré que poner http://feeds.feedburner.com/diariosdelanube.
Si quieres publicar los últimos comentarios podrás escribir como nuevo Feed http://NOMBRE_DE_TU_BLOG.blogspot.com/feeds/comments/full
 |
| Rellena los datos básicos del Feed de tu Blog. La mayor parte estarán seleccionados por defecto. |
Source Name: utiliza el nombre de tu Blog.
Source URL: la dirección normal de tu Blog. Es decir http://NOMBRE_DE_TU_BLOG.blogspot.com.es/. En mi caso será http://diariosdelanube.blogspot.com.es/.
Después seleccionaremos el estilo con el cual queremos que se vean las entradas de nuestro Blog en el muro. La elección depende de cada uno pero la standard parece la más adecuada mostrando una imagen en miniatura y el resumen de la entrada a su lado.
4) Pulsa sobre el botón "Save" para dejar almacenados tus cambios en Facebook.
 |
| Ya está creado el Feed de noticias fuente que alimentará Facebook o el destenido que elijamos en "Target" a la derecha. |
5) Selecciona el "Target" o destino donde vas a meter el RSS que has introducido de origen, "Source".
 |
| Rellena los datos finales para terminar de configurar el destino. |
Rellena el combo "Choose Target" y el combo "Publish on behalf of" para publicar "en nombre de". En Post Style escoge como vas a presentar las entradas, en estilo Standard (el recomendado) o Compact (compacto) o Status Updates (actualizará tu estado de Facebook con la entrada).
6) Cuando finalices aparecerá a la izquierda el RSS de tu blog y a la derecha tu dirección Facebook. Pulsa el botón "ON" para dejar activada la actualización.
 |
| Tienes opciones desde la pantalla final de configurar con los pequeños iconos de Graffiti más opciones de publicación de tu rss. |
Desde ese instante ya tenemos publicados en nuestro muero de Facebook las entradas de nuestro Blog automáticamente. La publicación no será inmediata, ten en cuenta que el Feed no es algo que se actualice con una frecuencia elevada, tardará un tiempo en salir la entrada que publiques.
4) Muestra la actividad de tu sitio web o Blog en Facebook
1) Nos conectamos a la URL de Facebook Developers, a la página para el "widget" de "Activity Feed": https://developers.facebook.com/docs/reference/plugins/activity/
 |
| Página para añadir Widget "Activity Feed" de Facebook en nuestro Blog. |
- Introduce los datos en la sección de configuración del widget de la página de Facebook:
- Introduce en "URL to comment" la dirección de tu Blog.
- En APP ID debes meter tu número identificativo de Aplicación Facebook. Para encontrarlo es tan sencillo como ponerte encima de la foto de tu perfil en tu página de facebook y copiar la URL que contiene (NO la imagen sino el perfil):
https://www.facebook.com/photo.php?fbid=xxxxxxxxxxxxxxxxx&set=a.xxxxxxxxxxxxxx.xxxxxxxx.xxxxxxx&type=1&source=11
El número de 17 posiciones a la derecha de "fbid=" es el que debes poner en APP ID.
- En Action, si no pones nada, por defecto significará que saldrán por el activity Feed todas las acciones.
- Rellena el ancho ("Width") y alto ("Height"), con el tamaño en píxeles deseado. Luego lo podrás cambiar al meter el "Widget" en el Blog.
- A continuación pulsa sobre el botón "Get code" para obtener el código fuente que debes poner en tu sitio web. Tendrás dos divisiones, una con el código que debes introducir en el <body> de tu blog y otra con el código que introducirás en el Gadget HTML/Javascript donde residirá finalmente el Widget de "Activity Feed" de Facebook.
2) Ahora sólo queda insertar el código extraído de Facebook en tu Blog. Dentro de Blogger dirígete al menú de la izquierda, a la opción Diseño.
- En primer lugar realiza una copia de seguridad de tu sitio. Aunque es realmente sencillo lo que vamos a hacer, recomiendo que previamente tengamos a buen recaudo nuestro código original, de manera que siempre podamos "volver atrás" ante cualquier error. No dejes de realizar esta guía paso a paso para salvaguardar tu blog.
- En Blogger, en el menú de la izquierda, dirígete a la opción "Plantilla" y pulsa "Editar HTML". Localiza la etiqueta "<body" (no pongas la etiqueta de cierre de body) y justo debajo inserta el código que extraiste de Facebook correspondiente al apartado del "<body>".
|
| Pantalla de edición de la plantilla HTML. pulsa CONTROL + F y busca la etiqueta "<body" |
<div id="fb-root"></div><script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/es_ES/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));</script>
NOTA: Debido a la última actualización que Facebook ha introducido en sus scripts, si te da errores en la plantilla al tratar de salvar el código anterior, utiliza este que a continuación te muestro.
Si este código ya lo tenías añadido con anterioridad por tener alguna funcionalidad de Facebook incorporada ya al Blog, no es necesario que vuelvas a meterlo y puedes pasar al siguiente punto.
- En Blogger accede a la edición del HTML de la plantilla pues Blogger
 |
| Opción de diseño en Blogger. |
- En la página de Diseño pulsa "Añadir gadget" en la zona del Blog donde desees insertar el "Widget" de comentarios de Facebook y selecciona el Gadget "HTML/Javascript".
 |
| Pulsa sobre "Añadir Gadget" en la zona donde deseas insertar los botones AddThis |
- Añade el código fuente que recuperaste de Facebook:
<div class="fb-activity" data-site="http://diariosdelanube.blogspot.com" data-app-id="xxxxxxxxxxxxxxxxx" data-width="300" data-height="300" data-header="true" data-recommendations="true"></div>
 |
| Añade el código fuente del AddThis |
- Pulsa "Guardar Disposición" y ¡ya lo tienes!
5) El "Me gusta" que conecta tu página web en Facebook con tu Blog y viceversa:
1) Nos conectamos a la URL de Facebook Developers, a la página para el "widget" de "Activity Feed": https://developers.facebook.com/docs/reference/plugins/like-box/
 |
| Configurando el "Like-Box" |
- Introduce los datos en la sección de configuración del widget de la página de Facebook:
- Introduce en "Facebook Page URL" la dirección en Facebook de tu Blog.
- En Width establece el ancho que deseas para el componente, pon un valor teniendo en mente la colocación que le vas a dar. Luego en el propio código, cuando lo pegues en tu Blog, podrás cambiarlo sin problemas.
- Rellena "Color Scheme" para indicar el tipo de combinación de colores que más "pegue" con tu sitio web o blog. "Light" para sitios claros y "Dark" para oscuros.
- "Stream" por si deseas mostrar toda la cadena de "Me gusta" más recientes.
- "Show Header" sirve para mostrar el nombre con el icono del sitio en Facebook. Es imprescindible para que el usuario sepa sobre qué hace "Me gusta".
- Por último pulsa "Get Code" para obtener el código fuente que después añadiremos en Facebook.
 |
| Pantalla para copiar el código que introducirá el "Like Box" en nuestro Blog. |
2) Ahora sólo queda insertar el código extraído de Facebook en tu Blog. Dentro de Blogger dirígete al menú de la izquierda, a la opción Diseño.
- En primer lugar realiza una copia de seguridad de tu sitio. Aunque es realmente sencillo lo que vamos a hacer, recomiendo que previamente tengamos a buen recaudo nuestro código original, de manera que siempre podamos "volver atrás" ante cualquier error. No dejes de realizar esta guía paso a paso para salvaguardar tu blog.
- En Blogger, en el menú de la izquierda, dirígete a la opción "Plantilla" y pulsa "Editar HTML". Localiza la etiqueta "<body" (no pongas la etiqueta de cierre de body) y justo debajo inserta el código que extraiste de Facebook correspondiente al apartado del "<body>".
|
| Pantalla de edición de la plantilla HTML. pulsa CONTROL + F y busca la etiqueta "<body" |
<div id="fb-root"></div><script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/es_ES/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));</script>
NOTA: Debido a la última actualización que Facebook ha introducido en sus scripts, si te da errores en la plantilla al tratar de salvar el código anterior, utiliza este que a continuación te muestro.
Si este código ya lo tenías añadido con anterioridad por tener alguna funcionalidad de Facebook incorporada ya al Blog, no es necesario que vuelvas a meterlo y puedes pasar al siguiente punto.
- En Blogger accede a la edición del HTML de la plantilla pues Blogger
|
| Opción de diseño en Blogger. |
- En la página de Diseño pulsa "Añadir gadget" en la zona del Blog donde desees insertar el "Widget" de comentarios de Facebook y selecciona el Gadget "HTML/Javascript".
|
| Pulsa sobre "Añadir Gadget" en la zona donde deseas insertar el Like-Box |
- Añade el código fuente que recuperaste de Facebook:
<div class="fb-like-box" data-href="https://www.facebook.com/FacebookDevelopers" data-width="292" data-show-faces="true" data-stream="true" data-show-border="true" data-header="true"></div>
|
| Añade el código fuente del Like-Box |
- Pulsa "Guardar Disposición" y ¡ya lo tienes!
Sin lugar a dudas, cualquiera de estos componentes acercarán más tus contenidos a los usuarios de la red social.
Buenas tardes, Miguel. Como siempre, muy interesante tu blog.
ResponderEliminarSin embargo, he tratado de desplegar cada uno de los epígrafes que presentas y no he podido abrir ninguno. Apretando el botón secundario del ratón Chrome me da la opción de abrir el enlace en una pestaña nueva o en una nueva ventana y en ambos casos me aparece en blanco. Con Firefox tampoco me resulta y con iE ni lo intento porque no quiero instalarlo.
Supongo que será algún desliz en la programación, pero ya me comentarás si puedes.
Pero ya te digo: el post, de lo más acertado. En cuanto pueda me pongo a trastear con él.
Un saludo.
¡Ya está arreglado Octavio!, es que es muy complejo ocultar capas de texto en una misma HTML... gracias por avisar. Ya está listo para utilizarse.
EliminarMuchísimas gracias Miguel. El día que me ponga a organizar el blog no saldré del tuyo. Me gusta mucho cómo explicas todos los contenidos. Un saludo enorme!
ResponderEliminarMuchisimas gracias a ti. Yo disfruto si te sirve y te ayuda en tus necesidades con tu blog. Para cualquier cosa aquí estaré. ¡Un saludo!
EliminarTengo tantas cosas pendientes de hacer de las que explicas aquí, que voy a necesitar una segunda vida para instalarlo todo ;)
ResponderEliminarGracias por compartirlo!
Tengo tantas cosas pendientes de hacer de las que explicas aquí, que voy a necesitar una segunda vida para instalarlo todo ;)
ResponderEliminarGracias por compartirlo!
Tengo tantas cosas pendientes de hacer de las que explicas aquí, que voy a necesitar una segunda vida para instalarlo todo ;)
ResponderEliminarGracias por compartirlo!
Tengo tantas cosas pendientes de hacer de las que explicas aquí, que voy a necesitar una segunda vida para instalarlo todo ;)
ResponderEliminarGracias por compartirlo!
Gracias a ti Ana!
EliminarBuenas tardes, Miguel. ¿Sabrías cómo implementar en una web el contenido de una nota de mi perfil de Facebook? Más concretamente: me gustaría "embeber" aquí (http://www.otcsolucionesintegrales.com/blog) esta nota de Facebook (https://www.facebook.com/notes/octavio-topham-camejo/elecciones-al-colegio-de-abogados-de-lanzarote/184563581749923), para que la entrada que voy a hacer al blog sobre las elecciones colegiales se actualice automáticamente cada vez que cambio la nota en Facebook. No se si me explico. ¡Gracias!
ResponderEliminarSe puede hacer pero es complejo. El tema es que los usuarios para verlo es posible que debieran estar autenticados en facebook. Déjame investigar y te digo algo.
Eliminar¡Un saludo amigo!.
Hola. Hace un tiempo hice el botón me gusta y lo puse en mi blog, los me gusta llegaron casi a 1000, pero solo en el blog. Es posible trasladar esos me gusta a una nueva página que tengo en facebook??
ResponderEliminarAhí me pillas. No lo sé, yo si he conseguido convertir mi perfil normal en página y conservar los me gusta.
EliminarLo que haría es pillar el perfil de los 1000 me gusta y hacerlo página.
Lo hice buscando en Google: convertir perfil Facebook en página y metiéndome en el resultado de la ayuda de Facebook para explicar los pasos y en qué consiste el proceso. Ya me cuentas.
Un saludo!.
Excelente tutorial, te cuento que estaba buscando y no ubicaba un buen paso a paso, éste fue el mejor sin duda (y probé más de 10...) Gracias, saludos!
ResponderEliminarEncantado de que te haya servido, esa es la mejor recompensa. Muchas gracias a ti por comentarlo. Un saludo!!!
EliminarGracias me vino genial éste post!
ResponderEliminarMe alegro mucho de que te funcionara. Cualquier cosa aquí me tienes. Un saludo,
EliminarMe alegro mucho de que te funcionara. Cualquier cosa aquí me tienes. Un saludo,
EliminarHola. En primer lugar, muchas gracias por este post, llevábamos tiempo buscándolo.
ResponderEliminarHemos llevado a cabo tus pasos, pero a la hora de guardar la plantilla HTML nos da error:
Error al analizar XML, línea 1616, columna 64: The reference to entity "version" must end with the ';' delimiter.
¿Nos podrías decir a qué se debe para solucionarlo?
Gracias por adelantado.
Un saludo.
Encantado de ayudar.
EliminarEl error da en el & donde debes poner & seguido de amp. Conéctate a esta guía y busca directamente este texto: http://www.diariosdelanube.com/2013/06/mete-la-caja-de-comentarios-de-facebok.html busca el texto en esta guía para ver el ejemplo: "NOTA: Debido a la última actualización que Facebook ha introducido en sus scripts, si te da errores en la plantilla al tratar de salvar el código anterior, utiliza este que a continuación te muestro." Justo debajo tienes el código que necesitas.
Cualquier cosa aquí estoy. Un saludo!
Hola de nuevo, te comento más detalladamente el caso. Desde hace tiempo tenemos habilitado en nuestro blog el botón "me gusta" correspondiente a nuestra fanpage , y ahora lo que queremos agregar es el botón "me gusta" correspondiente a cada entrada del blog. El problema que tenemos es que a la hora de llevar a cabo tu tutorial nos aparecen en la parte inferior de la última entrada los dos botones "me gusta" antes mencionados, justo sobre la barra gris de botones de google ( a parte del que ya teníamos nosotras con anterioridad). Y no sabemos que falla o qué estamos haciendo mal. Gracias de nuevo. Un saludo!
EliminarEl problema es que la mayor parte de los componentes para redes sociales suelen utilizar la URL canónica (la de la página donde se encuentra) y eso puede producir conflictos si se usa el mismo componente para el mismo fin. Podrías utilizar condicionales para mostrar el me gusta de un tipo en la página principal y el me gusta de otro tipo en el detalle de cada entrada (así los dos no se mezclarían en el mismo sitio). Para los condicionales puedes utilizar esta guía: http://www.diariosdelanube.com/2014/09/como-utilizar-condiciones-en-blogger.html
EliminarCualquier duda aquí me tienes para lo que necesites.
Un saludo!
Todo muy interesante, tengo el navegador lleno de pestañas de Diarios de la Nube ;-)
ResponderEliminarMuchas gracias Rafa, aquí estoy siempre intentando darle al coco para ver qué nos puede venir bien a todos los creadores de Blogs y noshaga la vida más fácil. Gracias por tu feedback tan positivo.
EliminarHola, he seguido los pasos y se puede comentar, darle "me gusta" compartir. Pero no logro resolver lo de la app, porque no llegan las notificaciones, ¿me podrían ayudar?
ResponderEliminarGracias por por los tips de sitio.
Prueba con esta guía detallada a tal efecto: http://www.diariosdelanube.com/2013/06/mete-la-caja-de-comentarios-de-facebok.html Cualquier duda me preguntas allí y vamos resolviéndola. Esto es ir poco a poco y al final sale todo, paciencia.
EliminarUn saludo!
En mi caso la mejor red social es Google+, esto depende de los análisis que haga cada uno, prueba esto para ver la red social que más te conviene: http://www.diariosdelanube.com/2014/11/que-red-social-es-la-que-mas-le.html
ResponderEliminarUn saludo!
Hola! Magnifico blog. Estoy aprendiendo mucho, poco a poco claro. No me salen muchas cosas. Ahora estoy intentando averiguar porqué cada vez que comparto una entrada en facebook, me sale el titulo de la entrada (correcto) pero siempre debajo de este, aparece la descripción de mi blog y no de ese trabajo en concreto. No se si me explico bien. Me podrías ayudar?
ResponderEliminarHola Pilar,
Eliminares posible que se deba a que tienes una meta-etiqueta antes del <head en tu plantilla en la que ponga og:description... Estas etiquetas le dicen a Facebook (y a otras redes sociales que utilizan esa manera de notificar descripciones) que prevalece la descripción que acompañe a "og:" antes que la que tengas como entrada del blog.
Un saludo!.