JQuery Plugin

the embedagram jQuery plugin!

The jQuery plugin allows you to embed your instagram photos within any element on your site. Simply include the plugin script, and bind it to an element.

example

NOTE: You must replace <your-instagram-id> with:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
    <script type="text/javascript" src="./js/jquery-1.6.1.min.js"></script>
    <script type="text/javascript" src="./js/jquery-embedagram.pack.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#slideshow').embedagram({
                instagram_id: <your-instagram-id>
            });
        });
    </script>
</head>  
<body>
    <ul id="slideshow"></ul>
</body>
</html>                    

options

The current options are:

  • instagram_id – your instagram id.
  • thumb_width – thumbnail width. instagram provides images of width 150, 306, and 612. depending on the set width, embedagram serves an appropriate size. defaults to 100.
  • wrap_tag – the html tag that wraps the thumbnails. defaults to li.
  • link_type – where the images link to. ‘web’ for instagram and ‘img’ for large version of the image. defaults to ‘web’.
  • limit – the number of images you’d like returned. defaults to 20.
  • success – accepts a function, to be triggered once the images load.