Like Buttons

Let users engage with your content in a single tap.


Dependencies: fliplet-like:0.2

This package is currently in Beta. We recommend adding the version number :0.2 to ensure the feature continues to work in your app if and when the package is upgraded.

Add fliplet-like:0.2 to your page dependencies to include the resources for setting up your Like button.

LikeButton(options)

For the following HTML code:

<div id="target"></div>

Use the following JavaScript code to set up a Like Button for users to like the page they are currently viewing:

LikeButton({
  target: '#target',
  dataSourceId: 12345,
  content: {
    pageId: Fliplet.Env.get('pageId')
  }
});

Or use the following JavaScript code to set up a Like Button for users to like a data source entry:

LikeButton({
  target: '#target',
  dataSourceId: 12345,
  content: {
    dataSourceEntryId: 16789
  }
});

Usage

LikeButton(options)

Methods

The LikeButton() function returns an object with the following methods.

For example:

var btn = LikeButton({
  target: '#target',
  dataSourceId: 12345,
  content: {
    pageId: Fliplet.Env.get('pageId')
  }
});

// Capture 'liked' event
btn.on('liked', function(data){
  console.log('Liked. New like count: ' + data.count);
});

// Capture 'unliked' event
btn.on('unliked', function(data){
  console.log('Unliked. New like count: ' + data.count);
});

// Programmatically trigger like
// Returns a Promise that resolves with the latest count
btn.like();

// Programmatically trigger unlike
// Returns a Promise that resolves with the latest count
btn.unlike();

// Programmatically toggle like
// Returns a Promise that resolves with the latest count
btn.toggleLike();
btn.toggleLike(true); // Same as btn.like()
btn.toggleLike(false); // Same as btn.unlike()

// Get like count
btn.getCount();

// Get like status
btn.isLiked();

// Get target (returns jQuery object)
btn.getTarget();

Back to API documentation