Añadir fotos de Instagram a su sitio web mediante instafeed. js

Vista prévia

Descripción

instafeed. js es una pequeña y sencilla biblioteca de JavaScript que se utiliza para capturar y mostrar fotos de Instagram en función del usuario, la etiqueta, el popular y la ubicación, confiando en la API de Instagram.

Examples:

• < a href = "http:/hemeon.com/" > Hemeon. com
• < a href = "http:/vinthomas.com/" > VinThomas. com
• < a href = "http://www.kozikcocoon.com/" > el capullo de Kozik

Funcionamiento

Incluya el script instafeed. js en la página HTML.

<script src="instafeed.min.js"></script>

Crea un contenedor vacío para colocar tus fotos de Instagram.

<div id="instafeed"></div>

Busca y muestra fotos de Instagram dentro del contenedor que acabas de crear.

var feed = new Instafeed({



// insert your Instatram client ID here


clientId: 'YOUR_CLIENT_ID'



// More options here

});

feed.run();

Opciones disponibles.

// Your API client id from Instagram.
clientId: 'YOUR_CLIENT_ID'

// A valid oAuth token. Required to use get: 'user'.
accessToken: 'YOUR_ACCESS_TOKEN'

// The ID of a DOM element you want to add the images to.
target: 'instafeed',

// popular (default) - Images from the popular page
// // tagged - Images with a specific tag. Use tagName to specify the tag.
// location - Images from a location. Use locationId to specify the location
// user - Images from a user. Use userId to specify the user.
get: 'popular',

// Name of the tag to get.
 // Use with get: 'tagged'.
tagName: 'YOUR_TAG_NAME'

// Unique id of a location to get.
 // Use with get: 'location'.
locationId: 'UNIQUE_ID'

// Unique id of a user to get.
 // Use with get: 'user'.
userId: 'USER_ID'

// Size of the images to get.
 // 'thumbnail', 'low_resolution', 'standard_resolution'
resolution: 'thumbnail',

// Sort the images in a set order.
// most-recent - Newest to oldest.
// least-recent - Oldest to newest.
// most-liked - Highest # of likes to lowest.
// least-liked - Lowest # likes to highest.
// most-commented - Highest # of comments to lowest.
// least-commented - Lowest # of comments to highest.
// random - Random order.
sortBy: 'none',

// Wrap the images with a link to the photo on Instagram.
links: true,

// Set to true fetch data without inserting images into DOM.
 // Use with success callback.
mock: false,

// Maximum number of Images to add. Max of 60.
limit: 30

// By default, image urls are protocol-relative.
 // Set to true to use the standard http://.
useHttp: false

Funciones de devolución de llamada.

// called before fetching images from Instagram.
before (function)

 // called when images have been added to the page.
after (function)

 // called when Instagram returns valid data. (argument -> json object)
success (function)

// called when there is an error fetching images. (argument -> string message)
error (function)

 // used to exclude images from your results.
 // The function will be given the image data as an argument, and expects the function to return a boolean.
 filter (function)

Registro de cambios

11/10/2015

• v1.4.1