MyBB Community Forums

Full Version: Thread Rating CSS Issue - How To Fix
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2 3 4 5
I have seen many questions asking how to fix this problem when viewing a subforum or a thread:

[Image: threadratingtk1.jpg]

This is caused by the CSS (Cascading Style Sheet) for the thread ratings not being included in your theme. Basically the ratings show as plain HTML as there is no style for them, and we all need a bit of style. This is a very simple fix, and now, I will show you how to do it.

First, you must go to your ACP. Choose Templates and Styles from the top menu, and then Themes. Click your theme, and then on the new page that you see, click 'Add Stylesheet'. You will then see this page (click to enlarge):

[attachment=10957]

Type in the name box, 'star_ratings.css'.

Make sure the 'Globally' option is selected.

Click 'Write my own content', and paste in the CSS found here: http://community.mybboard.net/cache/them...atings.css

Then save the stylesheet. You should now see your thread ratings displaying properly.

I hope this is helpful - if anyone has any problems, please post in this thread rather than making a new one, and I, or someone else, will assist you. I would also appreciate it if I am not PM'd about this - I will check this thread regularly to see if anyone is having any problems. Also post in here if you feel anything should be explained better or something's missing.

Smile
well done mate..
thanks for the fix. Smile
Excellent m8 just what the doctor ordered Smile
Thank you Smile
Thanks Matt

If like me, you had 'star_ratings.css' missing, you may be missing other files. I only had global.css listed in "Stylesheets in MyBB Default"

modcp.css
http://community.mybboard.net/cache/them.../modcp.css

showthread.css
http://community.mybboard.net/cache/them...thread.css

usercp.css
http://community.mybboard.net/cache/them...usercp.css

star_ratings.css
http://community.mybboard.net/cache/them...atings.css

Follow same procedure as in Matt's first post with each file. I hope I am not missing any Confused

Regards

Gordon
To get rid of the rating completely here's what you have to do:

Step 1: Goto Admin CP --> Templates & Style --> Templates --> Default Templates

Now expand Show Thread Templates --> showthread_ratethread

Choose full edit, delete everything in there and paste this in it's place:

After you pasted this, move on to step 2 in this post.

<!--
<div style="margin-top: 6px; padding-right: 10px;" class="float_right">
		<script type="text/javascript" src="jscripts/rating.js?ver=1400"></script>
		<div id="success_rating_{$thread['tid']}" style="float: left; padding-top: 2px; padding-right: 10px;">&nbsp;</div>
		<strong style="float: left; padding-right: 10px;">{$lang->thread_rating}</strong>
		<div class="inline_rating">
			<ul class="star_rating{$not_rated}" id="rating_thread_{$thread['tid']}">
				<li style="width: {$thread['width']}%" class="current_rating" id="current_rating_{$thread['tid']}">{$ratingvotesav}</li>
				<li><a class="one_star" title="{$lang->one_star}" href="./ratethread.php?tid={$thread['tid']}&amp;rating=1&amp;my_post_key={$mybb->post_code}">1</a></li>
				<li><a class="two_stars" title="{$lang->two_stars}" href="./ratethread.php?tid={$thread['tid']}&amp;rating=2&amp;my_post_key={$mybb->post_code}">2</a></li>
				<li><a class="three_stars" title="{$lang->three_stars}" href="./ratethread.php?tid={$thread['tid']}&amp;rating=3&amp;my_post_key={$mybb->post_code}">3</a></li>
				<li><a class="four_stars" title="{$lang->four_stars}" href="./ratethread.php?tid={$thread['tid']}&amp;rating=4&amp;my_post_key={$mybb->post_code}">4</a></li>
				<li><a class="five_stars" title="{$lang->five_stars}" href="./ratethread.php?tid={$thread['tid']}&amp;rating=5&amp;my_post_key={$mybb->post_code}">5</a></li>
			</ul>
		</div>
</div>
-->

Step 2: Now open Forum Display Templates --> forumdisplay_thread_rating

And again choose full edit and replace all of the coding in it with this:

<!--
<td align="center" class="{$bgcolor}" id="rating_table_{$thread['tid']}">
		<ul class="star_rating{$not_rated}" id="rating_thread_{$thread['tid']}">
			<li style="width: {$thread['width']}%" class="current_rating" id="current_rating_{$thread['tid']}">{$ratingvotesav}</li>
		</ul>
		<script type="text/javascript">
		<!--
			Rating.build_forumdisplay({$thread['tid']}, { width: '{$thread['width']}', extra_class: '{$not_rated}', current_average: '{$ratingvotesav}' });
		// -->
		</script>
	</td>

One last step that I just worked out to completely remove it:

open --> forumdisplay_threadlist

and copy & paste this
<div class="float_left">
	{$multipage}
</div>
<div class="float_right">
	{$newthread}
</div>
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="clear: both;">
	<tr>
		<td class="thead" colspan="{$colspan}">
			<div style="float: right;">
				<span class="smalltext"><strong><a href="misc.php?action=markread&amp;fid={$fid}">{$lang->markforum_read}</a> | <a href="usercp2.php?action={$add_remove_subscription}subscription&amp;type=forum&amp;fid={$fid}">{$add_remove_subscription_text}</a>{$clearstoredpass}</strong></span>
			</div>
			<div>
				<strong>{$foruminfo['name']}</strong>
			</div>
		</td>
	</tr>
	<tr>
		<td class="tcat" colspan="3" width="66%"><span class="smalltext"><strong><a href="{$sorturl}&amp;sortby=subject&amp;order=asc">{$lang->thread}</a> {$orderarrow['subject']} / <a href="{$sorturl}&amp;sortby=starter&amp;order=asc">{$lang->author}</a> {$orderarrow['starter']}</strong></span></td>
		<td class="tcat" align="center" width="7%"><span class="smalltext"><strong><a href="{$sorturl}&amp;sortby=replies&amp;order=desc">{$lang->replies}</a> {$orderarrow['replies']}</strong></span></td>
		<td class="tcat" align="center" width="7%"><span class="smalltext"><strong><a href="{$sorturl}&amp;sortby=views&amp;order=desc">{$lang->views}</a> {$orderarrow['views']}</strong></span></td>
		
		<td class="tcat" align="right" width="20%"><span class="smalltext"><strong><a href="{$sorturl}&amp;sortby=lastpost&amp;order=desc">{$lang->lastpost}</a> {$orderarrow['lastpost']}</strong></span></td>
		{$inlinemodcol}
	</tr>
	{$announcementlist}
	{$threads}
	<tr>
		<td class="tfoot" align="right" colspan="{$colspan}">
			<form action="forumdisplay.php" method="get">
				<input type="hidden" name="fid" value="{$fid}" />
				<select name="sortby">
					<option value="subject" {$sortsel['subject']}>{$lang->sort_by_subject}</option>
					<option value="lastpost" {$sortsel['lastpost']}>{$lang->sort_by_lastpost}</option>
					<option value="starter" {$sortsel['starter']}>{$lang->sort_by_starter}</option>
					<option value="started" {$sortsel['started']}>{$lang->sort_by_started}</option>
					{$ratingsort}
					<option value="replies" {$sortsel['replies']}>{$lang->sort_by_replies}</option>
					<option value="views" {$sortsel['views']}>{$lang->sort_by_views}</option>
				</select>
				<select name="order">
					<option value="asc" {$ordersel['asc']}>{$lang->sort_order_asc}</option>
					<option value="desc" {$ordersel['desc']}>{$lang->sort_order_desc}</option>
				</select>
				<select name="datecut">
					<option value="1" {$datecutsel['1']}>{$lang->datelimit_1day}</option>
					<option value="5" {$datecutsel['5']}>{$lang->datelimit_5days}</option>
					<option value="10" {$datecutsel['10']}>{$lang->datelimit_10days}</option>
					<option value="20" {$datecutsel['20']}>{$lang->datelimit_20days}</option>
					<option value="50" {$datecutsel['50']}>{$lang->datelimit_50days}</option>
					<option value="75" {$datecutsel['75']}>{$lang->datelimit_75days}</option>
					<option value="100" {$datecutsel['100']}>{$lang->datelimit_100days}</option>
					<option value="365" {$datecutsel['365']}>{$lang->datelimit_lastyear}</option>
					<option value="9999" {$datecutsel['9999']}>{$lang->datelimit_beginning}</option>
				</select>
				{$gobutton}
			</form>
		</td>
	</tr>
</table>
<div class="float_left">
	{$multipage}
</div>
<div class="float_right" style="margin-top: 4px;">
	{$newthread}
</div>
<br style="clear: both;" />
<br />
<div class="float_left">
	<div class="float_left">
		<dl class="thread_legend smalltext">
			<dd><img src="{$theme['imgdir']}/newfolder.gif" alt="{$lang->new_thread}" title="{$lang->new_thread}" /> {$lang->new_thread}</dd>
			<dd><img src="{$theme['imgdir']}/newhotfolder.gif" alt="{$lang->new_hot_thread}" title="{$lang->new_hot_thread}" /> {$lang->new_hot_thread}</dd>
			<dd><img src="{$theme['imgdir']}/hotfolder.gif" alt="{$lang->hot_thread}" title="{$lang->hot_thread}" /> {$lang->hot_thread}</dd>
		</dl>
	</div>

	<div class="float_left">
		<dl class="thread_legend smalltext">
			<dd><img src="{$theme['imgdir']}/folder.gif" alt="{$lang->no_new_thread}" title="{$lang->no_new_thread}" /> {$lang->no_new_thread}</dd>
			<dd><img src="{$theme['imgdir']}/dot_folder.gif" alt="{$lang->posts_by_you}" title="{$lang->posts_by_you}" /> {$lang->posts_by_you}</dd>
			<dd><img src="{$theme['imgdir']}/lockfolder.gif" alt="{$lang->locked_thread}" title="{$lang->locked_thread}" /> {$lang->locked_thread}</dd>
		</dl>
	</div>
	<br style="clear: both" />
</div>

<div class="float_right" style="text-align: right;">
	{$inlinemod}
	{$searchforum}
	{$forumjump}
</div>
<br style="clear: both" />
{$inline_edit_js} 

And here is what the end result will look like: http://codeshq.site88.net/cheat-codes-f-32.html
(2008-09-11, 01:39 AM)Gordone Wrote: [ -> ]Thanks Matt

If like me, you had 'star_ratings.css' missing, you may be missing other files. I only had global.css listed in "Stylesheets in MyBB Default"

modcp.css
http://community.mybboard.net/cache/them.../modcp.css

showthread.css
http://community.mybboard.net/cache/them...thread.css

usercp.css
http://community.mybboard.net/cache/them...usercp.css

star_ratings.css
http://community.mybboard.net/cache/them...atings.css

Follow same procedure as in Matt's first post with each file. I hope I am not missing any Confused

Regards

Gordon

You're completely right. I have seen a few User CPs and Mod CPs with the menu on the left showing as just plain links - if you have this problem, like Gordone said, use the procedure in the first post, but change the name and the actual CSS you use Toungue
(2008-09-11, 02:54 AM)scylla Wrote: [ -> ]To get rid of the rating completely here's what you have to do:

Step 1: Goto Admin CP --> Templates & Style --> Templates --> Default Templates

Now expand Show Thread Templates --> showthread_ratethread

Choose full edit, delete everything in there and paste this in it's place:

After you pasted this, move on to step 2 in this post.

<!--
<div style="margin-top: 6px; padding-right: 10px;" class="float_right">
		<script type="text/javascript" src="jscripts/rating.js?ver=1400"></script>
		<div id="success_rating_{$thread['tid']}" style="float: left; padding-top: 2px; padding-right: 10px;">&nbsp;</div>
		<strong style="float: left; padding-right: 10px;">{$lang->thread_rating}</strong>
		<div class="inline_rating">
			<ul class="star_rating{$not_rated}" id="rating_thread_{$thread['tid']}">
				<li style="width: {$thread['width']}%" class="current_rating" id="current_rating_{$thread['tid']}">{$ratingvotesav}</li>
				<li><a class="one_star" title="{$lang->one_star}" href="./ratethread.php?tid={$thread['tid']}&amp;rating=1&amp;my_post_key={$mybb->post_code}">1</a></li>
				<li><a class="two_stars" title="{$lang->two_stars}" href="./ratethread.php?tid={$thread['tid']}&amp;rating=2&amp;my_post_key={$mybb->post_code}">2</a></li>
				<li><a class="three_stars" title="{$lang->three_stars}" href="./ratethread.php?tid={$thread['tid']}&amp;rating=3&amp;my_post_key={$mybb->post_code}">3</a></li>
				<li><a class="four_stars" title="{$lang->four_stars}" href="./ratethread.php?tid={$thread['tid']}&amp;rating=4&amp;my_post_key={$mybb->post_code}">4</a></li>
				<li><a class="five_stars" title="{$lang->five_stars}" href="./ratethread.php?tid={$thread['tid']}&amp;rating=5&amp;my_post_key={$mybb->post_code}">5</a></li>
			</ul>
		</div>
</div>
-->

Step 2: Now open Forum Display Templates --> forumdisplay_thread_rating

And again choose full edit and replace all of the coding in it with this:

<!--
<td align="center" class="{$bgcolor}" id="rating_table_{$thread['tid']}">
		<ul class="star_rating{$not_rated}" id="rating_thread_{$thread['tid']}">
			<li style="width: {$thread['width']}%" class="current_rating" id="current_rating_{$thread['tid']}">{$ratingvotesav}</li>
		</ul>
		<script type="text/javascript">
		<!--
			Rating.build_forumdisplay({$thread['tid']}, { width: '{$thread['width']}', extra_class: '{$not_rated}', current_average: '{$ratingvotesav}' });
		// -->
		</script>
	</td>-->

One last step that I just worked out to completely remove it:

open --> forumdisplay_threadlist

and copy & paste this
<div class="float_left">
	{$multipage}
</div>
<div class="float_right">
	{$newthread}
</div>
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" style="clear: both;">
	<tr>
		<td class="thead" colspan="{$colspan}">
			<div style="float: right;">
				<span class="smalltext"><strong><a href="misc.php?action=markread&amp;fid={$fid}">{$lang->markforum_read}</a> | <a href="usercp2.php?action={$add_remove_subscription}subscription&amp;type=forum&amp;fid={$fid}">{$add_remove_subscription_text}</a>{$clearstoredpass}</strong></span>
			</div>
			<div>
				<strong>{$foruminfo['name']}</strong>
			</div>
		</td>
	</tr>
	<tr>
		<td class="tcat" colspan="3" width="66%"><span class="smalltext"><strong><a href="{$sorturl}&amp;sortby=subject&amp;order=asc">{$lang->thread}</a> {$orderarrow['subject']} / <a href="{$sorturl}&amp;sortby=starter&amp;order=asc">{$lang->author}</a> {$orderarrow['starter']}</strong></span></td>
		<td class="tcat" align="center" width="7%"><span class="smalltext"><strong><a href="{$sorturl}&amp;sortby=replies&amp;order=desc">{$lang->replies}</a> {$orderarrow['replies']}</strong></span></td>
		<td class="tcat" align="center" width="7%"><span class="smalltext"><strong><a href="{$sorturl}&amp;sortby=views&amp;order=desc">{$lang->views}</a> {$orderarrow['views']}</strong></span></td>
		
		<td class="tcat" align="right" width="20%"><span class="smalltext"><strong><a href="{$sorturl}&amp;sortby=lastpost&amp;order=desc">{$lang->lastpost}</a> {$orderarrow['lastpost']}</strong></span></td>
		{$inlinemodcol}
	</tr>
	{$announcementlist}
	{$threads}
	<tr>
		<td class="tfoot" align="right" colspan="{$colspan}">
			<form action="forumdisplay.php" method="get">
				<input type="hidden" name="fid" value="{$fid}" />
				<select name="sortby">
					<option value="subject" {$sortsel['subject']}>{$lang->sort_by_subject}</option>
					<option value="lastpost" {$sortsel['lastpost']}>{$lang->sort_by_lastpost}</option>
					<option value="starter" {$sortsel['starter']}>{$lang->sort_by_starter}</option>
					<option value="started" {$sortsel['started']}>{$lang->sort_by_started}</option>
					{$ratingsort}
					<option value="replies" {$sortsel['replies']}>{$lang->sort_by_replies}</option>
					<option value="views" {$sortsel['views']}>{$lang->sort_by_views}</option>
				</select>
				<select name="order">
					<option value="asc" {$ordersel['asc']}>{$lang->sort_order_asc}</option>
					<option value="desc" {$ordersel['desc']}>{$lang->sort_order_desc}</option>
				</select>
				<select name="datecut">
					<option value="1" {$datecutsel['1']}>{$lang->datelimit_1day}</option>
					<option value="5" {$datecutsel['5']}>{$lang->datelimit_5days}</option>
					<option value="10" {$datecutsel['10']}>{$lang->datelimit_10days}</option>
					<option value="20" {$datecutsel['20']}>{$lang->datelimit_20days}</option>
					<option value="50" {$datecutsel['50']}>{$lang->datelimit_50days}</option>
					<option value="75" {$datecutsel['75']}>{$lang->datelimit_75days}</option>
					<option value="100" {$datecutsel['100']}>{$lang->datelimit_100days}</option>
					<option value="365" {$datecutsel['365']}>{$lang->datelimit_lastyear}</option>
					<option value="9999" {$datecutsel['9999']}>{$lang->datelimit_beginning}</option>
				</select>
				{$gobutton}
			</form>
		</td>
	</tr>
</table>
<div class="float_left">
	{$multipage}
</div>
<div class="float_right" style="margin-top: 4px;">
	{$newthread}
</div>
<br style="clear: both;" />
<br />
<div class="float_left">
	<div class="float_left">
		<dl class="thread_legend smalltext">
			<dd><img src="{$theme['imgdir']}/newfolder.gif" alt="{$lang->new_thread}" title="{$lang->new_thread}" /> {$lang->new_thread}</dd>
			<dd><img src="{$theme['imgdir']}/newhotfolder.gif" alt="{$lang->new_hot_thread}" title="{$lang->new_hot_thread}" /> {$lang->new_hot_thread}</dd>
			<dd><img src="{$theme['imgdir']}/hotfolder.gif" alt="{$lang->hot_thread}" title="{$lang->hot_thread}" /> {$lang->hot_thread}</dd>
		</dl>
	</div>

	<div class="float_left">
		<dl class="thread_legend smalltext">
			<dd><img src="{$theme['imgdir']}/folder.gif" alt="{$lang->no_new_thread}" title="{$lang->no_new_thread}" /> {$lang->no_new_thread}</dd>
			<dd><img src="{$theme['imgdir']}/dot_folder.gif" alt="{$lang->posts_by_you}" title="{$lang->posts_by_you}" /> {$lang->posts_by_you}</dd>
			<dd><img src="{$theme['imgdir']}/lockfolder.gif" alt="{$lang->locked_thread}" title="{$lang->locked_thread}" /> {$lang->locked_thread}</dd>
		</dl>
	</div>
	<br style="clear: both" />
</div>

<div class="float_right" style="text-align: right;">
	{$inlinemod}
	{$searchforum}
	{$forumjump}
</div>
<br style="clear: both" />
{$inline_edit_js} 

And here is what the end result will look like: http://codeshq.site88.net/cheat-codes-f-32.html
True, nice fix. I have, however, found one small error (click to enlarge):
[attachment=10973]
To fix, remove the --> from the very end of the second piece of code.
<!--<td align="center" class="{$bgcolor}" id="rating_table_{$thread['tid']}"> <ul class="star_rating{$not_rated}" id="rating_thread_{$thread['tid']}"> <li style="width: {$thread['width']}%" class="current_rating" id="current_rating_{$thread['tid']}">{$ratingvotesav}</li> </ul> <script type="text/javascript"> <!-- Rating.build_forumdisplay({$thread['tid']}, { width: '{$thread['width']}', extra_class: '{$not_rated}', current_average: '{$ratingvotesav}' }); // --> </script></td>
I think it would be better if that when the user group settings say users of that group cannot rate threads, that column goes. I think that would be easier if you eved decide you want the column back.
Hmm. I don't see that error on my boards. Are you sure you followed the directions closely? And also, is this when your viewing a forum, or when your viewing threads?
Hmm... I found another error that needs fixing. When adding an announcement it adds another column to the right of the last post column when viewing forums....
I saw that when I was viewing threads, as far as I can remember.

Yeah I just noticed that too, wondered what that was Toungue
(2008-09-11, 02:47 PM)scylla Wrote: [ -> ]Hmm... I found another error that needs fixing. When adding an announcement it adds another column to the right of the last post column when viewing forums....


That's probably an issue with your theme. Do you have any customized templates in the Forum Display Templates group? Please post this issue in a new thread if are still having problems.
Pages: 1 2 3 4 5