Difference between revisions of "How to change the rating star images"

From JReviews Documentation
Jump to: navigation, search
Line 1: Line 1:
Star images are located in <span style="color: blue">\com_jreviews\jreviews\views\themes\{theme_name}\theme_css\images\</span> folder.
 
  
Edit those images or create your own, but make sure new images have the same dimensions, otherwise you'll have to modify css styles also.
+
If you want to change the rating stars, you only need to define a different stars background image. There are several sprite images for rating stars available:
 +
 
 +
[[File:RatingStars.jpg]]
 +
 
 +
By default, rating_stars.png is used. If you want to use different stars, just add this into your custom_styles.css and change the file name:
 +
 
 +
<source lang="css">
 +
.rating_star_user,
 +
.rating_star_editor ,
 +
.rating_star_user div,
 +
.rating_star_editor div {
 +
    background-image: url(images/rating_stars2.png);
 +
}
 +
 
 +
/* rating form */
 +
.ui-stars-star a {
 +
    background-image: url(images/rating_stars2.png);
 +
}
 +
</source>
 +
 
 +
If you want to use your own stars image, place the image file in \theme_css\images\ folder.
 +
Make sure your custom stars have the same dimensions, otherwise you will need to modify styles for dimensions also.
  
  

Revision as of 15:50, 23 August 2011

If you want to change the rating stars, you only need to define a different stars background image. There are several sprite images for rating stars available:

RatingStars.jpg

By default, rating_stars.png is used. If you want to use different stars, just add this into your custom_styles.css and change the file name:

.rating_star_user, 
.rating_star_editor , 
.rating_star_user div, 
.rating_star_editor div { 
    background-image: url(images/rating_stars2.png); 
}
 
/* rating form */
.ui-stars-star a {
    background-image: url(images/rating_stars2.png);
}

If you want to use your own stars image, place the image file in \theme_css\images\ folder. Make sure your custom stars have the same dimensions, otherwise you will need to modify styles for dimensions also.