TIP LikePlugin is not installed on Foswiki.org.

LikePlugin

Like-style voting for content

This plugin lets you vote on topics, attachments and comments by means of a like thumb_up or a dislike thumb_down. All "likes" are stored within Foswiki, that is: they are not stored with the help of an external social platform such as Facebook or the like. In fact, only then will this feature make sense on an intranet install where no external information is supposed to be leaked to the outside world for obvious reasons.

Likes are used for social filtering, to

Like buttons are highly customizable coming with a set of look and feels to match common css frameworks such as jquery-ui or flat design.

In general, there are two different kinds of Likes

  • youtube style: you may vote thumb up and down
  • facebook style: only positive likes are collected.

Note that this plugin does not implement a star rating. Use the social rating feature of SocialFormfieldsPlugin.

Examples

(plugin not installed, output simulated)

You type You get
%LIKE{theme="simple"}%
LikeSnap1.png
%LIKE{theme="default"}%
LikeSnap2.png
%LIKE{theme="lightgray"}%
LikeSnap3.png
%LIKE{theme="gray"}%
LikeSnap4.png
%LIKE{theme="black"}%
LikeSnap5.png
%LIKE{theme="padding"}%
LikeSnap6.png
%LIKE{theme="ui"}%
LikeSnap7.png
%LIKE{theme="pattern"}%
LikeSnap8.png
%LIKE{theme="flat"}%
LikeSnap9.png
%LIKE{
    theme="simple"
    showdislike="off"
    showcount="off"
    likeicon="fa-thumbs-o-up fa-flip-horizontal fa-lg"
    likelabel="Like"
    likedlabel="Liked"
  }%
LikeSnap15.png
%LIKE{
    theme="simple"
    showlabel="off"
  }%
LikeSnap10.png
%LIKE{
    likeicon="heart"
    showdislike="off"
    likelabel="This was helpful"
    likedlabel="I found this helpful"
    theme="padding"
  }%
LikeSnap11.png
%LIKE{
    theme="simple"
    showlabel="off"
    likeicon="heart"
    dislikeicon="cross"
  }%
LikeSnap12.png
%LIKE{
    theme="ui"
    likelabel="Agree"
    likedlabel="Agreed"
    dislikelabel=""
  }%
LikeSnap13.png
%LIKE{
    theme="ui"
    showlabel="off"
  }%
LikeSnap14.png

Syntax

Here's the full syntax of all options of the %LIKE macro.

Parameter Description Default
topic topic to vote on current topic
type meta data to vote on as stored in topic; refers to the topic itself if left empty; other sensible values are COMMENT, FILEATTACHMENT, etc  
id name of the meta data to vote on, e.g. the name of an attachment or the id of a comment; this setting is only used when type is set as well  
theme one of black, default, flat, gray, lightgray, padding, pattern, simple, ui default
class an arbitrary css class to be added to the widget  
likeformat format for the like button
<div class='jqLikeButton %buttonClass% %likeSelected%'>
  <span class='jqLikeButtonText %buttonText%'>
    <a href='#' title='%MAKETEXT{\"Click to vote\"}%'>
      %likeIcon%%thisLikeLabel%
    </a>%count%
  </span>
</div>
likelabel label to be used in likeformat
%MAKETEXT{"I like this"}%
likedlabel label to be used in likeformat when the current user has liked the specified object same as likelabel
likeicon icon to be used in likeformat; this can be any of the icons accessible via VarJQICON, i.g. any famfamfam or fontawesome icons fa-thumbs-up
likeiconformat format string to render teh like icon
%JQICON{\"$likeIcon\" class=\"%iconClass%\"}%
dislikeiconformat format string to render the dislike icon
%JQICON{\"$dislikeIcon\" class=\"%iconClass%\"}%
dislikeformat format string for the dislike button
<div class='jqDislikeButton %buttonClass% %dislikeSelected%'>
  <span class='jqLikeButtonText %buttonText%'>
    <a href='#' title='%MAKETEXT{\"Click to vote\"}%'>
      %dislikeIcon%%thisDislikeLabel%
    </a>%count%
  </span>
</div>
dislikelabel label to be used in dislikeformat
%MAKETEXT{"I don&#39;t like this"}%
dislikedlabel label to be used in dislikeformat when the current user has disliked the specified object same as dislikedlabel
dislikeicon icon to be used in dislikeformat; this can be any of the icons accessible via VarJQICON, i.g. any famfamfam or fontawesome icons fa-thumbs-down
editable boolean flag to indicate whether the user may like or the widget is in read-only mode controlled by authentication (only logged-in users are allowed to vote)
header header string to be prepended to the widget  
format format string for the overall widget containing both, the like and the dislike button
<div class='jqLike %class% %wrapperClass% %editable%' %params%>
    %like%%dislike%
  </div>
footer footer string to be appended to the widget  
showcount boolean flag to show/hide counters on
showdislike boolean flag to enable/disable disliking on
showlabel boolean flag to show/hide button labels on
showicon boolean flag to show/hide icons on
hidenull boolean flag to hide the widget when no votes have been made yet off

The format, likeformat and dislikeformat parameters may come with a set of variables to display current values as follows:

Variable Description
%like% used in format to insert the result of likeformat
%dislike% used in format to insert the result of dislikeformat
%params% used in format to insert the html5 data attributes for the jquery like plugin
%likeLabel%, %likedLabel%, %dislikeLabel%, %dislikedLabel% labels of the like/dislike buttons
%thisLikeLabel% current value to be used; this is either the likelabel or the likedlabel of the current state
%thisDislikeLabel% current value to be used; this is either the dislikelabel or the dislikedlabel of the current state
%likeIcon%, %dislikeIcon% value of likeicon and dislikeicon
%likeCount%, %dislikeCount%, %totalLikeCount% current counts of votes done by all users
%likeSelected%, %dislikeSelected% either empty or the string "selected" depending on the state of the button
%editable% either the string "editable" or empty depending on the mode of the widget
%web% web of the current object being voted on
%topic% topic of the current object being voted on
%metaType% meta type
%metaId% meta id
%class% the custom class string

Perl API

The plugin a registration handler that other plugins may contact in order to be notified whenever a user liked an object.

registerAfterLikeHandler()

Example:

use Foswiki::Plugins::LikePlugin();

Foswiki::LikePlugin::registerAfterLikeHandler(sub {
  my ($web, $topic, $type, $id, $user, $likes, $dislikes) = @_;

});

For example MetaCommentPlugin updates the META:COMMENT data to cache like and dislike counts as part of the meta data to be able to seamlessly sort and hide comments based on likes.

getCore()

This function offers access to the core singleton object responsible for like/dislike services.

Example:

use Foswiki::Plugins::LikePlugin();

my $likeCore = Foswiki::Plugins::LikePlugin::getCore();
my ($likes, $dislikes) = $likeCore->getLikes($web, $topic, $type, $id);
my ($myLikes, $myDislikes) = $likeCore->getLikesOfUser($web, $topic, $type, $id, $wikiName);

JavaScript API

Each %LIKE macro will be powered by a piece of jQuery to communicate with the backend counting likes and dislikes. This is done using a vote JSON-RPC handler that takes the following parameters:

Parameter Description
web, topic address of the object to be liked
type meta data type, e.g. COMMENT or FILEATTACHMENT
id name of the meta data to be voted on
username username that the vote is counted for (only for testing and admins)
like the vote; possible values are 0 or 1
dislike the vote; possible values are 0 or 1

A change.likes event is emitted Whenever a user votes. This allows you to listen to a %LIKE widget and be notified on any vote event. All %LIKE widgets on the same page are listening on this change.likes event and update themselves whenever another widget for the same object has been updated. You may notice that when installing this plugin and testing the above examples that clicking on one button will update all others simultaneously as long as they refer to the same object being voted on.

Installation Instructions

You do not need to install anything in the browser to use this extension. The following instructions are for the administrator who installs the extension on the server.

Open configure, and open the "Extensions" section. "Extensions Operation and Maintenance" Tab -> "Install, Update or Remove extensions" Tab. Click the "Search for Extensions" button. Enter part of the extension name or description and press search. Select the desired extension(s) and click install. If an extension is already installed, it will not show up in the search results.

You can also install from the shell by running the extension installer as the web server user: (Be sure to run as the webserver user, not as root!)
cd /path/to/foswiki
perl tools/extension_installer <NameOfExtension> install

If you have any problems, or if the extension isn't available in configure, then you can still install manually from the command-line. See https://foswiki.org/Support/ManuallyInstallingExtensions for more help.

Note that you will need a database driver for the DBI interface used to store values into an SQL database backend. By default SQLite is used.

Skin integration

NatSkin

LikePlugin is well integrated into NatSkin so that no further customizations are required. Topics are like-enabled by displaying a "thumb-up" as part of the topic actions. You may further customize the location of the like button in the SiteTopicActions web component.

PatternSkin

To enable topic-voting add the like identifier to the SKIN setting, e.g.

   * Set SKIN = like, natedit, pattern

In case you've got BreadcrumbsPlugin, TopicInteractionPlugin and/or SolrPlugin then use

   * Set SKIN = like, breadcrumbs, solr, topicinteraction, natedit, pattern

Dependencies

NameVersionDescription
Foswiki::Plugins::DBIPlugin>=1.00Required
Foswiki::Plugins::JQueryPlugin>=6.00Required
Foswiki::Contrib::JsonRpcContrib>=2.21Required
Foswiki::Plugins::DBCachePlugin>=8.10Optional
Foswiki::Plugins::SolrPlugin>=4.10Optional

Change History

31 Jan 2024 mysql and mariadb require utf8mb4_bin collation and characterset
03 May 2022 rewrite using Foswiki:Extensions/DBIPlugin
18 Nov 2019 added likeiconformat and dislikeiconformat paramerters
02 Sep 2016 add support for fontawesome icon; initial support for WebSocketPlugin
15 Oct 2015 normalize web before putting it into an sql query ... fixes counts in subwebs
21 Sep 2015 initial release

I Attachment Action Size Date Who Comment
LikePlugin.md5md5 LikePlugin.md5 manage 153 bytes 31 Jan 2024 - 15:48 MichaelDaum  
LikePlugin.sha1sha1 LikePlugin.sha1 manage 177 bytes 31 Jan 2024 - 15:48 MichaelDaum  
LikePlugin.tgztgz LikePlugin.tgz manage 721 K 31 Jan 2024 - 15:48 MichaelDaum  
LikePlugin.zipzip LikePlugin.zip manage 741 K 31 Jan 2024 - 15:48 MichaelDaum  
LikePlugin_installerEXT LikePlugin_installer manage 8 K 31 Jan 2024 - 15:48 MichaelDaum  
LikeSnap1.pngpng LikeSnap1.png manage 2 K 31 Jan 2024 - 15:48 MichaelDaum  
LikeSnap10.pngpng LikeSnap10.png manage 900 bytes 31 Jan 2024 - 15:47 MichaelDaum  
LikeSnap11.pngpng LikeSnap11.png manage 2 K 31 Jan 2024 - 15:46 MichaelDaum  
LikeSnap12.pngpng LikeSnap12.png manage 1 K 31 Jan 2024 - 15:46 MichaelDaum  
LikeSnap13.pngpng LikeSnap13.png manage 2 K 31 Jan 2024 - 15:46 MichaelDaum  
LikeSnap14.pngpng LikeSnap14.png manage 1 K 31 Jan 2024 - 15:46 MichaelDaum  
LikeSnap15.pngpng LikeSnap15.png manage 906 bytes 31 Jan 2024 - 15:46 MichaelDaum  
LikeSnap2.pngpng LikeSnap2.png manage 2 K 31 Jan 2024 - 15:47 MichaelDaum  
LikeSnap3.pngpng LikeSnap3.png manage 2 K 31 Jan 2024 - 15:47 MichaelDaum  
LikeSnap4.pngpng LikeSnap4.png manage 2 K 31 Jan 2024 - 15:47 MichaelDaum  
LikeSnap5.pngpng LikeSnap5.png manage 2 K 31 Jan 2024 - 15:47 MichaelDaum  
LikeSnap6.pngpng LikeSnap6.png manage 2 K 31 Jan 2024 - 15:47 MichaelDaum  
LikeSnap7.pngpng LikeSnap7.png manage 3 K 31 Jan 2024 - 15:47 MichaelDaum  
LikeSnap8.pngpng LikeSnap8.png manage 4 K 31 Jan 2024 - 15:47 MichaelDaum  
LikeSnap9.pngpng LikeSnap9.png manage 3 K 31 Jan 2024 - 15:47 MichaelDaum  
Topic revision: r7 - 31 Jan 2024, MichaelDaum
The copyright of the content on this website is held by the contributing authors, except where stated elsewhere. See Copyright Statement. Creative Commons License    Legal Imprint    Privacy Policy