Share |
Mark Lewis4.02.2013.

 

Thumbs up on the buses | Photo credit Flickr Brett Davies (CC BY-NC-SA 2.0)

Thumbs up on the buses | Photo credit Flickr Brett Davies (CC BY-NC-SA 2.0)

Newscoop 4.1 includes a new feature that allows logged in users to rate articles.  The article rating scores are then displayed on the article pages for all users. This is a great way to boost user engagement and easily allow readers to participate in the content. This How To blog will lead you through the implementation process in the latest version of Newscoop 4.1 that was released last week.

 

 

 

 

 

 

How it works

The rating controller provides two actions to retrieve and update article ratings respectively.  The show action takes one parameter for the articles unique article number and returns a JSON object with details about the articles current rating statistics.  The save action takes one parameter for the article number, and another for the new rating score.  A JSON object is returned with the updated rating statistics for the article with a field containing any errors that may have been thrown.  Save actions require that requests come from logged in users.

The Newscoop admin has been updated with a default article switch to enable/disable article rating at the article level, and the article info box will now display the current avg article rating.

 

Example Implementation

A 5 star rating example has been added to the the New Custodian Theme.  To see the example simply apply the theme to your publication in the newscoop admin ( CONFIGURE -> Themes ) and navigate to any article page on the frontend.  You will see the 5 star rating widget at the bottom of the article page, just above the share links and comments section. 

To include the article 5 star rating widget in your own custom templates you simply need to include the rating template (_tpl/article-rating.tpl) wherever you want the widget to display:

 

{{include file="_tpl/article-rating.tpl" }}

 

Customising the 5 star rating widget

If you want to customise the rating widget you can find the HTML, Javascript, and CSS below:

The rating controller

The rating controller is accessible from [domain]/rating url and implements two available actions. 

 

show action

parameters:

  • f_article_number

example request:

http://localhost/rating/show?f_article_number=101

example results:

{"widget_id":"101","number_votes":1,"total_score":3,"dec_avg":3,"whole_avg":3}

  

save action

parameters:

  • f_article_number
  • f_rating_score

example request:

http://localhost/rating/save?f_article_number=101&f_rating_score=5

example results:

{"widget_id":"101","number_votes":1,"total_score":5,"dec_avg":5,"whole_avg":5,"error":"Your rating has been updated"}

 For more information about the latest features in Newscoop 4.1 visit the latest release page. 

Recent Blog Posts RSS
All you can read

Get our newsletter: