Where can i change the color of the stars?
This plugin uses a special Font to display the stars, not images, so to change the color, simply override the plugins stylesheet with your own font color for the div that holds and displays the stars, like so:
div.rr_stars_container { color:#FC0 !important; }
#FC0 is a gold-ish color, you may choose a different color, or just use the word, like color:red;
Sorry but i am i litlle newbie..
Do i have make the change in de rich-reviews.css?
No, sorry I wasn’t more clear. Add that style to your Theme’s style.css file…..if you add it to the plugin’s stylesheet, then your changes will be overwritten when the plugin gets updated…..it’s better to control it with your own theme’s styles.
You might comment it so that you know what the style does….Open your (theme’s) style.css and add these lines:
/* styles for reviews form and display */
div.rr_stars_container, div.stars { color:#FC0 !important; }
I added the , div.stars because I noticed that when it displays the reviews, those stars were also in B/W.
You can modify your style.css file using any text editor, OR you can go to Appearance >Editor (in your WP Admin area) to modify it BUT be sure to back it up first, just in case.
Great it works for me!
Can i also make de ” smaller
Look at my site http://www.dedjfabriek.nl/#referenties
The plugin developer is controlling that through his stylesheet, so when you want to change the way he has styled it, look first at the source code to identify which element you want to change, then at his stylesheet to see what he is doing, then add a new style to *your own* stylesheet to override his ….. so in this case, to make the quotation mark smaller, he is setting that in his stylesheet with this declaration:
.testimonial_group .testimonial .rr_review_text .drop_cap{position:absolute;font-size:100px;top:-5px;left:-20px;line-height:100px;zoom:1;filter:alpha(opacity=25);opacity:0.25}
You might change it to play around with the font-size until you have it the size that you want – maybe start at 75px instead of 100px as he has it……just add that style declaration to YOUR stylesheet, BUT be sure to add !important to it – THAT’S what overrides his styles….. like so:
.testimonial_group .testimonial .rr_review_text .drop_cap{font-size:75px !important;}
(If the only thing you want to change about it is the font-size, then only add that style)
Ian
(@foxytechnology)
Thanks for helping Trisha!
Yes, I removed a lot of the default stylings for elements, and completely redid the css (abstracting it into a sass stylesheet instead) I thought about it, and after extensive experience dealing with OTHER people’s plugins, one huge pet peeve that I have is when a plugin author forces, say, a certain color for their styles which is invisible or clashes when put up on the site. So I figured letting the stars be the same color as text as the default was the best solution.
One big thing I’d like to put in is a color picker and, overall, some more automated visual styles that are easier to change for the enduser
I have tried using the method described above (adding lines to my themes style.css) but it completely destroys the formatting on my webpage and everything is all over the place and unreadable. As soon as I remove the new lines the formatting is perfect.
This is how my style.css looks with addes lines
/*
Theme Name: Etherna WP 1.2
Theme URI: http://themeforest.net/user/evgreen/portfolio
Description: Business & Portfolio Themes – designSentry.
Author: evgreen
Author URI: http://themeforest.net/user/evgreen/portfolio
*/
/* styles for reviews form and display */
div.rr_stars_container, div.stars { color:#FC0 !important; }
@import “css/style.css”;
Please could someone help as to what I am doing wrong.
