Vamos a ver cómo añadir el botón de guardar en Facebook en tu blog o página web, este botón falicita el consumo de la información de dicha web a posteriori en Facebook.
La definición oficial de Facebook es la siguiente:
El botón «Guardar» permite a las personas guardar artículos o servicios en una lista privada de Facebook, compartirlos con los amigos y recibir notificaciones relevantes. Por ejemplo, una persona puede guardar un artículo de ropa, un viaje o un enlace a algún servicio que le interese y volver a la lista para consumirlo en otro momento, o recibir una notificación cuando esté de oferta.
En este post voy a hablar sobre el botón para guardar noticias/artículos, URL y similares. Antes de entrar en materia os dejo estas interesantes entradas:
Configuración del botón de guardar en Facebook
Para obtener el código del botón devemos ir a su página oficial y tras la descripción nos encontramos con la configuración:
Los campos a rellenar son los siguientes:
- Enlace de un sitio web o producto a guardar: Insertamos la URL en donde queremos colocar el botón.
- Tamaño del botón: small para pequeño y large para grande.
- Para terminar clickamos en ‘Obtener código‘ para obtener el HTML resultando.
El código resultante está compuesto por 2 bloques:
1 2 3 4 5 6 7 8 |
<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 = 'https://connect.facebook.net/es_ES/sdk.js#xfbml=1&version=v2.10&appId=779906972186650'; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> |
El bloque superior es para insertarlo justo después de la apertura del tag <body>.
1 |
<div class="fb-save" data-uri="https://www.instagram.com/facebook/" data-size="small"></div> |
Este otro código lo debemos poner en el lugar en donde queremos que salga el botón de guardar en Facebook.