• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.
Highlight search results

Highlight search results

Brogan

XenForo moderator
Staff member
#1
Brogan submitted a new resource:

Highlight search results - Stop searching for search results

This is a very simple tweak but does help to highlight search results.

Search results use the highlight CSS class, which only has font-weight:bold applied by default.

You can use that class to style the results to make them stand out more.
Simply add this to EXTRA.css for example to make the matched search result text color orange:
Code:
.highlight
{
    color: @secondaryMedium;
}
You can obviously style it to suit.

Before:
View attachment 79019

After:...
Read more about this resource...
 

Brogan

XenForo moderator
Staff member
#6
You're missing a 0 from #FF0000.

Code:
//Highlight search results
.highlight
{
font-weight: bold;
color: #FF0000;
}
 

Brogan

XenForo moderator
Staff member
#8
It works for me, on a default and custom style.

Perhaps there is something wrong with your EXTRA.css template further up?
Or it could be a style issue.

Adding !important may help.
 

teletubbi

Well-known member
#12
I have UI.X Dark

UI.X Dark (the original theme, not visible for user)
-UI.X Dark changing (here i made all changings, not visible to users)
--Dark (visible to users)
 

Brogan

XenForo moderator
Staff member
#14
If the highlight class isn't applied when using a wildcard then it won't be possible to style the results.
 

Aivaras

Active member
#15
Do you think it's worthwhile to make a suggestion in XenForo Suggestions to have the software apply such a class? From a user's perspective I don't see a difference between the need to highlight the whole word or a portion of it as both are equally a search result.
 

Brogan

XenForo moderator
Staff member
#16
There's no reason why you can't suggest it.

If the dev's consider it feasible and worthwhile, they may implement it.