salad-spinner
v0.0.10
Published
Salad Spinner - embed Instagram media on your website, fast!
Downloads
10
Maintainers
Readme
SaladSpinner - Easily embed multiple Instagram feeds on your blog or website
SaladSpinner makes it easy to add Instagram feeds to your website. SaladSpinner requires that your feeds be authenticated with BitSalad.co, first.
Installation
Download the script and include it in your HTML:
<script type="text/javascript" src="path/to/salad-spinner.min.js"></script>
Basic Usage
Fetch and show your feed:
<script type="text/javascript">
SaladSpinner({
userId: 'your_bitsalad_user_id',
users: [authenticated_user_id, another_authenticated_user_id],
sortBy: 'created_time',
links: false,
resolution: 'low_resolution',
id: 'dom-element-id'
}).show();
</script>
Requirements
All you need is a userId from BitSalad.co and at least one Instagram user_id. Head over to BitSalad., signin with your Instagram account and create your first feed.
Options
userId
- Required. Your user id from BitSalad.co.id
- The ID of the DOM element where you want to add the images to.template
- Custom HTML template to use for images. See templating.filterByTags
(array of strings) - Retun only media with certain tags.sortBy
(string) - Sort your media. Available options are:created_time
- Newest to oldest.likes.count
- Highest # of likes to lowest.comments.count
- Highest # of comments to lowest.
links
- Wrap media with a link to its source on Instagram.limit
- Maximum number of items to return.resolution
- Size of the images to get. Available options are:thumbnail
(default) - 150x150low_resolution
- 306x306standard_resolution
- 612x612
Templating
The template option allows you to control the markup for each feed item.
Basic example:
<script type="text/javascript">
SaladSpinner({
userId: 'your_bitsalad_user_id',
users: [authenticated_user_id, another_authenticated_user_id],
id: 'dom-element-id',
template: "<div class='image'><img src='<%= url %>' width='<%= width %>' height='<%= height %>' /><%= likes.count %></div>"
}).show();
</script>