How to replace hearts as symbols that represent rating score with another shape

Answered

Public

Tyson Martin asked November 23, 2011

The site design is great and I want to change the shape of the heart to something else for items that have been rated on my site. Can anyone tell me how to do this.

Please check out the site at http://www.freshestaudio.com

Half way down on the left side of the site you can see items most reviewed. Here the hearts show.

Irisite

1 answer

Vote Up

Vote Down

tomc ⋅0.00 $tone November 24, 2011

Public

Greetings:

The css (and identified relative images) for that element can be found within the theme.css file, within the following path . . .

/skin/frontend/default/jm_irisite/css/theme.css

starting at line 1411 . . .

Code:

/*RATINGS
----------------------------------------------------------------*/
.ratings { line-height: 12px; margin: 0 0 10px; }


.rating-box {
	background: url(../images/product_rating_blank_star.png) repeat-x;
	height: 14px;
	margin-bottom: 5px;
	margin-right: 10px;
	position: relative;
	overflow: hidden;
	width: 83px;
	float: left;
}


.rating-box .rating {
	background: url(../images/product_rating_full_star.png) repeat-x;
	height: 14px;
	left: 0;
	position: absolute;
	top: 0;
}

As you can see, the relative images are called product_rating_blank_star.png and product_rating_full_star.png

You can create your own custom images and replace the current with your new images accordingly.

Hope that helps guide you in the right direction.