Highlight search phrases in content like Google does

briansol

Well-known member
Google has on-the-fly on-page highlighting of keyword results by means of an appended hash tag ala,
Code:
#:~:text=Highlight%20This

It would be neat to do the same from within XF search engine, carrying over the keywords searched to highlight the content on page

example
thread:
Code:
https://xenforo.com/community/threads/better-vote-post-attribution-which-post-the-icons-are-attributed-to-layout-design.184417/

random search that would produce that thread as a result:
Code:
It may

produces this link to click as a search result:

Code:
https://xenforo.com/community/threads/better-vote-post-attribution-which-post-the-icons-are-attributed-to-layout-design.184417/#:~:text=It%20may

which, when clicked, it is highlighted in context.

This may be limited to Chrome.
xfsearch.png
 
Upvote 4

Chromaniac

Well-known member
Related. Google has an official Chrome app for this. I use it multiple times a day. Sadly, the links break on several websites like reddit. Even Twitter mangles unless I use a third party link shortener.

XenForo search result page already bolds the keywords. I imagine there are code based solutions to highlight keywords when you open a search result page that would work in all browsers. Because this is a fairly common feature on web apps I think.

Google's solution might not work here if keywords are scattered across the page? Unless you do a quote enclosed search?
 

beerForo

Well-known member
I'm on the fence. I usually use the "find in page" option if I need to and find that the highlighting can be annoying at times.
 

Chromaniac

Well-known member
I also just realized that the chrome's feature can highlight text at multiple locations. I have seen Google search result create links like that. It is pretty incredible that Google decided to add a feature to Chrome just to make the job of their search engine team easy lol.

Found this link from few days ago in my chat history that shows how it works:

https://www.prnewswire.com/news-releases/nordvpn-is-rolling-out-nordlynx--new-generation-vpn-protocol-that-makes-vpn-connection-faster-than-ever-301046715.html#:~:text=%22NordLynx%20is%20the%20most%20significant,customers%2C%20and%20a%20VPN%20industry.&text=NordVPN's%20double%20NAT%20system%20allows,while%20the%20session%20is%20active

Works in Chromium based browsers including Edge and Vivaldi. Doesn't work in Firefox.
 
Top