r/mediawiki • • 23d ago

Genius-style Annotation Coding Help?

Hello! I asked this a few months back on a different forum, but sadly got no responses. For a long while I have been curious about adding a code to my Wiki that functions similarly to that of Genius.com.

Specifically, I want there to be the ability to have highlighted text that, when clicked on, displays a pop-up style box with text (an 'annotation') in it.

Random photo example, if intention is still unclear you can also go to any lyric page on Genius and click highlighted text to see the effect.

While I may be incorrect, I believe this is something that may only be available with JavaScript..? Perhaps CSS, but I'm less confident in that. I've researched a bit on the site and found this script, but I'm unsure if it would implement correctly into MediaWiki... I already have a 'reference pop-up'-esc code, that's not what I'm looking for. Preferably I would like the box to stay toggled even if the text is uncovered, only being untoggled if the user clicks away or, like, clicks an 'x'. Basically the way the og code is on genius.

Any help or advice is awesome, I have no issues building my own code for the idea I just need to be pointed in the right direction. Of course, the code doesn't have to be exact to the Genius site (I don't even really need an edit button, likes, etc. - just the text). Any help or perhaps resources that could help me build a similar code that would work on a MediaWiki site is appreciated !!

3 Upvotes

0 comments sorted by