javascript - poner - Cómo incrustar el feed de una página de Facebook en mi sitio web
plugin de facebook para mi web (6)
Ahhh, eso es súper simple, no requiere programación.
Ver: https://developers.facebook.com/docs/plugins/page-plugin
Querrá mantener activada la opción de show stream . Puede ajustar el ancho y el alto y algunas otras cosas.
Estoy trabajando con un grupo para ayudar a promover un evento de caridad. La página que me gustaría incluir no es mi perfil de Facebook, sino una página de Facebook que alguien ha creado.
Me gustaría mostrar esa fuente de noticias en mi página web. Si necesito obtener información / acceso desde esta página, házmelo saber. Si alguien más tiene un ejemplo de trabajo, házmelo saber. He estado usando jsfiddle.net para diseñarlo.
Aquí está la página: http://www.facebook.com/pages/Chefs-Classic-Knock-OUT-Bout/225835004169328
Corrígeme si me equivoco, pero parece que Facebook desactivó el complemento de Feed de actividad. Además, ya no parece haber ningún complemento sustituto para la actividad.
Aquí está el enlace: https://developers.facebook.com/docs/plugins/activity
El plugin Like Box / Page es básicamente un iframe y feo: D
Así que creé mi propio complemento gratuito al que llamo el complemento Famax para mostrar los feeds de FanPage. Es similar al cuadro similar pero tiene una mejor interfaz de usuario y es más personalizable.
Además, dado que el cuadro Me gusta se muestra en un marco flotante con un ancho y una altura fijos, etc., no es realmente receptivo.
En el nuevo https://developers.facebook.com/docs/plugins/page-plugin puede hacer múltiples pestañas en su sitio web. El complemento de la página le permite incrustar fácilmente y promover cualquier página de Facebook en su sitio web. Al igual que en Facebook, sus visitantes pueden hacer clic en Me gusta y compartir la Página sin salir de su sitio.
- Incluya el SDK de JavaScript en su página una vez, idealmente justo después de la etiqueta
<body>apertura.
<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/en_US/sdk.js#xfbml=1&version=v2.5&appId={APP_ID}";
fjs.parentNode.insertBefore(js, fjs);
}(document, ''script'', ''facebook-jssdk''));</script>
- Coloque el código de su complemento donde desee que aparezca el complemento en su página.
<div class="fb-page"
data-href="https://www.facebook.com/YourPageName"
data-tabs="timeline"
data-small-header="false"
data-adapt-container-width="true"
data-hide-cover="false"
data-show-facepile="true">
<div class="fb-xfbml-parse-ignore">
<blockquote cite="https://www.facebook.com/facebook">
<a href="https://www.facebook.com/facebook">Facebook</a>
</blockquote>
</div>
</div>
También puede cambiar la siguiente configuración:
También ahora puede tener las pestañas de línea de tiempo, eventos y mensajes con el nuevo complemento de página:
- Pestaña Línea de tiempo: mostrará las publicaciones más recientes de la línea de tiempo de su página de Facebook.
- Pestaña de eventos: las personas pueden seguir los eventos de su página y suscribirse a los eventos del complemento.
- Pestaña Mensajes: las personas pueden enviar mensajes a su página directamente desde su sitio web. Las personas deben iniciar sesión para usar esta función.
<div class="fb-page"
data-tabs="timeline,events,messages"
data-href="https://www.facebook.com/YourPageName"
data-width="380"
data-hide-cover="false">
</div>
Para los desarrolladores de sitios web, otra opción que tienes es seguir un tutorial de Facebook Graph API como codeofaninja.com/2014/10/… .
Pero si necesita una solución rápida donde pueda personalizar e insertar un feed de página de Facebook al instante, debe usar complementos de sitios web como displaysocialmedia.com/… .
Aquí hay una guía paso a paso:
- Obtenga una clave gratis o clave de pago .
- Vaya a esta página de inicio de sesión y use la tecla para iniciar sesión.
- Una vez que haya iniciado sesión, haga clic en el botón "+ Crear alimentación personalizada".
- En la ventana emergente, nombre su feed personalizado de página de Facebook.
- En el menú desplegable, selecciona la opción "Publicación de página de Facebook en tu sitio web".
- Ingrese su ID de página de Facebook.
- Haga clic en el botón "Continuar". Esto te mostrará las opciones de personalización.
- Haga clic en el botón "Insertar en el sitio web" ubicado en la esquina superior derecha de la pantalla.
- En la ventana emergente, copie el código de inserción haciendo clic en el botón "Copiar código".
- Pegue el código de inserción en su sitio web.
Visite el displaysocialmedia.com/… del displaysocialmedia.com/… para ver una demostración en vivo allí también.
Si está buscando un código personalizado en lugar de un complemento, entonces esto podría ayudarlo. El gráfico de Facebook ha sufrido algunos cambios desde que evolucionó. Estos pasos son para la última API de gráficos que probé recientemente y funcionó bien.
Hay dos pasos principales involucrados: 1. Obtener el token de acceso de Facebook, 2. Llamar al API de gráfico para pasar el token de acceso.
1. Obtener el token de acceso : aquí está el proceso paso a paso para obtener el token de acceso para su página de Facebook. - Incrustar feed de página de Facebook en mi sitio web . De acuerdo con esto, debe crear una aplicación en la página de desarrolladores de Facebook que le daría un ID de aplicación y un Secreto de aplicación. Usa estos dos y obtén el token de acceso.
2. Llamar a Graph API : esto sería bastante simple una vez que obtenga el token de acceso. Solo necesita formar una URL para Graph API con todos los campos / propiedades que desea recuperar y hacer una solicitud GET a esta URL. Aquí hay un ejemplo de cómo hacerlo en asp.net MVC. Incrustar feeds de facebook usando asp.net mvc . Esto debería ser bastante similar en cualquier otra tecnología, ya que solo sería una solicitud HTTP GET.
Ejemplo de consulta FQL: https://graph.facebook.com/FBPageName/posts?fields=full_picture,picture,link,message,created_time&limit=5&access_token=YOUR_ACCESS_TOKEN_HERE