Hoverlinks

Hoverlinks!

It's like Wikipedia! Need I say more?

Originally made by Croquembouche Croquembouche for use in scp-9001SCP-9001 — FractalTurns out that you can plug your own articles in components. Who's gonna complain? You?-, Hoverlinks are intended for that thin sliver of use case where you'd love to crosslink an interesting and relevant page in the middle of your story, but you don't want the reader to feel like they're missing out if they haven't read it. By using a Hoverlink you can succinctly summarise the context of that link and keep moving, with less risk of the reader getting distracted and abandoning your article forever.

Usage

On any wiki, pop this at the top of your page, above any CSS themes:

[[include component:hoverlinks]]

You only need one of these, no matter how many Hoverlinks you have on your page.

Then, for each Hoverlink you want on the page, copy the following syntax (or use the generator below), and paste them wherever you want.

Generator

Use this tool to generate a Hoverlink for a page. All you need is the page URL (it can be the full URL or just the slug, e.g. 'scp-173'). Then, you can ask Crom to fill out the rest of the info for you. The generator has a random SCP written in it already so you can try it out immediately.

The data that Crom uses is actually not really ideal for a Hoverlink - e.g. the preview text is written by the page's author, and is usually more of a blurb than a useful summary, and most pages don't have one anyway. You should use Crom's data as a starting point, and make sure you customise the Hoverlink for your specific need.

See also: How to change this data for your articleCrom for authorsAs an author, the first impression many people will have of your article will come from Crom. For instance, a Discord embed, a reply on Reddit, embedded search module on your site, or this very website. There are many aspects of how Crom presents your works that you can customize as the author.-

Usage notes

What should the hover text be?

You should heavily tailor the hover text to be specific to your article and the specific context of the link.

My recommendation is to think about why you're linking that article, and then state that reason as succinctly as possible, keeping it in-universe. E.g.:

  • If I'm writing a story about e.g. antimemes and I want to link SCP-055SCP-055Unknown object that cannot be remembered. The first antimeme acquired by the Foundation. because it was the first one, I might do exactly what I just did. Now the reader has access to the context behind my decision and they know it's just random worldbuilding they can ignore. They can keep reading my story.
  • If I'm writing a story with required reading - let's say it's set in the End of Death canon - I might link to the hub by saying something like "as a result of the ongoing ΩK-Class ScenarioEnd of Death - HubActive ΩK-Class Scenario precipitated by unknown events, resulting in the inability of any organism to die. All researchers are expected to be familiar.- something something etc". This lets the reader know, diegetically, that they probably should stop reading my story to go catch up.

Or, if you want to imply to the reader that they should go and read the linked page in full, or give the impression that they're reading a huge cohesive database of information, try adding enough text to the Hoverlink that it gets truncated and trails off - just like Wikipedia.

Avoid turning your Hoverlinks into blurbs, by e.g. including 'cool quotes' from the article, or reviews. The goal isn't to play salesperson by doing marketing on the reader. Instead, give them the tools they need to make an informed decision about whether they should click. Unless it's on an out-of-universe page, like your author page, in which case do whatever you want.

Avoid spoiling any twists in linked articles, too, if you can.

What's with the little ⓘ symbols?

I think it's a good idea to visually indicate to the reader that a link is actually a Hoverlink. The wiki's been using links for almost two decades, and that's a lot of built-up familiarity. If you don't make it clear that a link is a Hoverlink, the vast majority of users will never know.

You might not think it's a good idea. You can get rid of it if you want. Just remove the ^^ⓘ^^ from the syntax.

Should CSS themes style the Hoverlink?

Absolutely. If you are a creator of a Sigma theme, feel free to redecorate the Hoverlink to match. If you are a creator of a theme with a different base (BHL, Basalt), you should wait for the base theme to be updated to restyle this first.

Why not have an [[include]] for the Hoverlink itself?

Because you can't [[include]] things in the middle of a line of text, which is where most links are.

Can you have a Hoverlink that's not a link?

SureHoverlinks!Hoverlinks! Hoverlinks! Hoverlinks!. All you need to do is put [# LINK_TEXT] instead of [[[LINK_URL | LINK_TEXT]]]. It still looks like a link (and it needs to be, so it can still be activated with keyboard navigation), but it doesn't go anywhere.

Source CSS

Here's the CSS for Hoverlinks:

версия страницы: 1, Последняя правка: 04 Ноя. 2025, 20:36 (1 день назад)
Пока не указано иное, содержимое этой страницы распространяется по лицензии Creative Commons Attribution-ShareAlike 3.0 License.