instantfollowbtn.js

A follow button for Instagram.

Download .zip Download .tar.gz View on GitHub

Welcome!

What is instantfollowbtn.js?

instantfollowbtn.js allows you to add an Instagram follow button right on your website.

Dependencies?

Only one, jQuery. jQuery actually makes the plugin unbelievably easy to use.

How to use instantfollowbtn.js?

1. First, drop in any version of jQuery. *Version 2.0+ is recommended.*

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

2. Next, put in instantfollowbtn.js and the stylesheet (don't forget about it!).

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="path/to/instantfollowbtn.js"></script>
<link rel="stylesheet" href="path/to/instantfollowbtn.css">

3. And lastly, your Javascript.

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="path/to/instantfollowbtn.js"></script>
<link rel="stylesheet" href="path/to/instantfollowbtn.css">
<script>
$(document).ready(function() {
  $(".myButton").instantfollowbtn();
});
</script>

Don't forget your HTML! It's quite important!

You can leave out the href because the plugin will add a href once you click on the button (it will take you to the user's profile page).

Examples

Here is a working example on Codepen: http://codepen.io/theawesomecoder61/pen/bCHEz

See the Pen instantfollowbutton.js Demo by Andrew (@theawesomecoder61) on CodePen.

Options

* accessToken - string

Allows the plugin to access your Instagram account to get the user's info. We don't see, use or track this information, so you're safe!

* clientID - string

Access the Instagram API and allows you to get info such as profiles or pictures.

primaryText - string

Customize the button's text on the left side.

secondaryText - string

Customize the button's text on the right side. Choose from:

  • #followers# - get the user's followers count
  • #following# - get the user's following count
  • < whatever you want > - set your own text (don't actually put < whatever you want >)

* userID - integer

The ID of a user you want for the follow button. Don't know your user ID? Scroll down to see a user ID finding tool.


The options with a * means it is required and the plugin won't function without that option.