The Fivestar voting plugin adds a clean, attractive voting widget to views in Elgg. Fivestar is built using the jQuery Star Rating widget.

Features:

• jQuery rollover effects and AJAX no-reload voting.
• Graceful degradation to an HTML rating form when JavaScript is turned off.
• Configurable options to allow users to cancel or change their votes.
• Insert the fivestar widget into any view via configuration options (requires an understanding of Elgg views and html) or by manually inserting the view code.

Adding the widget:

To add the fivestar widget, edit the view code of the plugin you want to vote on and add the following line. Where you add the line will determine where the widget is displayed.

<?php echo elgg_view("elggx_fivestar/elggx_fivestar", array('entity' => $vars['entity'])); ?>

Some additional parameters to control styling are available:

• outerId
  • Specifies and ID to be used on the outermost div containing the fivestar widget.
• ratingTextClass
  • Specifies a class for the rating text.

As an example of controlling styling using the outerId I altered the way the widget is displayed when looking at izap_videos in list view.

In izap_videos/views/default/izap_videos/listElement.php the following was added just below the line that says <div class="contentWrapper">.

<?php echo elgg_view("elggx_fivestar/elggx_fivestar", array('entity' => $vars['video'], 'outerId' => 'fivestar_izap_videos_list')); ?>

In this case the outerId is specified as fivestar_izap_videos_list. The css classes for that attribute look like:

#fivestar_izap_videos_list {float:right;font-size:xx-small;width:120px;}#fivestar_izap_videos_list p {margin:0;float:left;}

And the end result can be seen at http://i45.tinypic.com/206geqd.png or clicking the second image in the images section.