Difference between revisions of "How to display detailed ratings on list pages"

From JReviews Documentation
Jump to: navigation, search
Line 16: Line 16:
  
  
Find the code that starts with <span style="color: green"><nowiki><!-- BEGIN RATINGS COLUMN --></nowiki></span>
+
Find this code:
 +
<source lang="php">
 +
<!-- BEGIN RATINGS COLUMN -->
 +
<td class="columnLast">
 +
<?php if($listing['Criteria']['state'] == 1 && ($this->Config->author_review || $this->Config->list_show_user_rating)):?>
 +
<table border="0" cellpadding="0" cellspacing="0" class="rating_table">
 +
<?php if($this->Config->author_review):?>
 +
<tr>
 +
<td class="rating_label"><?php echo $Html->image($this->viewImages.'review_editor.png',array('width'=>14,'height'=>14,'title'=>__t("Editor rating",true),'alt'=>__t("Editor rating",true)));?></td>
 +
<td><?php echo $Rating->drawStars($listing['Review']['editor_rating'], $this->Config->rating_scale, $this->Config->rating_graph, 'editor');?></td>
 +
<td class="rating_value"><?php echo $Rating->round($listing['Review']['editor_rating'],$this->Config->rating_scale);?><?php if ( $listing['Review']['editor_rating_count'] > 1 ) echo ' (',$listing['Review']['editor_rating_count'],')';?></td>
 +
</tr>
 +
<?php endif;?>
 +
<?php if($this->Config->list_show_user_rating):?>
 +
<tr>
 +
<td class="rating_label"><?php echo $Html->image($this->viewImages.'review_user.png',array('width'=>14,'height'=>14,'title'=>__t("User rating",true),'alt'=>__t("User rating",true)));?></td>
 +
<td><?php echo $Rating->drawStars($listing['Review']['user_rating'], $this->Config->rating_scale, $this->Config->rating_graph, 'user');?></td>
 +
<td class="rating_value"><?php echo $Rating->round($listing['Review']['user_rating'],$this->Config->rating_scale);?> (<span style="cursor:help;" title="<?php __t("User reviews");?>"><?php echo (int) $listing['Review']['user_rating_count'];?></span>)</td>
 +
</tr>
 +
<?php endif;?>
 +
</table>
 +
<?php endif;?>
 +
</td>
 +
<!-- END RATINGS COLUMN -->
  
Replace it with this:
+
</source>
 +
 
 +
 
 +
And replace it with this:
  
 
<source lang="php">
 
<source lang="php">

Revision as of 02:02, 4 January 2010

It is possible to display detailed ratings on list pages (blogview, tableview, thumbview), but detailed ratings take a lot of space so you will need to modify the layout.


I will show you how to add detailed ratings on a tableview list page because it has more room then other views.


This is how the ratings look by default on tableview page:

ListRatings1.png


We will modify the code to display detailed ratings like on listing detail page.

Open this theme file:

  • \com_jreviews\jreviews\views\themes\{theme_name}\listings\listings_tableview.thtml


Find this code:

<!-- BEGIN RATINGS COLUMN -->
<td class="columnLast">
	<?php if($listing['Criteria']['state'] == 1 && ($this->Config->author_review || $this->Config->list_show_user_rating)):?>
	<table border="0" cellpadding="0" cellspacing="0" class="rating_table">
		<?php if($this->Config->author_review):?>
		<tr>
			<td class="rating_label"><?php echo $Html->image($this->viewImages.'review_editor.png',array('width'=>14,'height'=>14,'title'=>__t("Editor rating",true),'alt'=>__t("Editor rating",true)));?></td>
			<td><?php echo $Rating->drawStars($listing['Review']['editor_rating'], $this->Config->rating_scale, $this->Config->rating_graph, 'editor');?></td>
			<td class="rating_value"><?php echo $Rating->round($listing['Review']['editor_rating'],$this->Config->rating_scale);?><?php if ( $listing['Review']['editor_rating_count'] > 1 ) echo ' (',$listing['Review']['editor_rating_count'],')';?></td>
		</tr>
		<?php endif;?>
		<?php if($this->Config->list_show_user_rating):?>													
		<tr>
			<td class="rating_label"><?php echo $Html->image($this->viewImages.'review_user.png',array('width'=>14,'height'=>14,'title'=>__t("User rating",true),'alt'=>__t("User rating",true)));?></td>
			<td><?php echo $Rating->drawStars($listing['Review']['user_rating'], $this->Config->rating_scale, $this->Config->rating_graph, 'user');?></td>
			<td class="rating_value"><?php echo $Rating->round($listing['Review']['user_rating'],$this->Config->rating_scale);?> (<span style="cursor:help;" title="<?php __t("User reviews");?>"><?php echo (int) $listing['Review']['user_rating_count'];?></span>)</td>
		</tr>
		<?php endif;?>										
	</table>
	<?php endif;?>
</td>
<!-- END RATINGS COLUMN -->


And replace it with this:

<!-- BEGIN RATINGS COLUMN -->
<td class="columnLast">
	<?php echo $this->element('detailed_ratings',array('review'=>$listing,'reviewType'=>'user'));?>
</td>
<!-- END RATINGS COLUMN -->


Now the detailed ratings are displayed like this:

ListRatings2.png


To display editor detailed ratings use this code:

<?php echo $this->element('detailed_ratings',array('review'=>$listing,'reviewType'=>'editor'));?>


Customizing the layout of detailed ratings for the list page

The code that generates the layout for detailed ratings is in:

  • \com_jreviews\jreviews\views\themes\default\elements\detailed_ratings.thtml


That file is used to display detailed ratings on the listing detail page, so if you want to modify the layout only for detailed ratings on list pages, copy that file and rename it to:

  • \com_jreviews\jreviews\views\themes\default\elements\detailed_ratings_list.thtml


When adding new files anywhere in JReviews folders you have to clear the File Registry in JReviews so it recognizes the files.


To call the new file in listings_tableview.thtml file use this code:

<?php echo $this->element('detailed_ratings_list',array('review'=>$listing,'reviewType'=>'user'));?>


The same code will work in listings_blogview.thtml and listings_thumbview.thtml if you use those layouts, but it will require more layout customizations to make the detailed ratings look good.