[Userscript] Show Context Sentence Immediately (with Vocab Highlight)

WaniKani API And Third-Party Apps
1

WARNING: This is a third-party script/app and is not created by the WaniKani team. By using this, you understand that it can stop working at any time or be discontinued indefinitely.

INSTALL RIGHT FROM HERE (GreasyFork)

What does this script do?

It displays a Japanese context sentence immediately when a vocabulary review appears placed directly inside the purple character header, just below the vocab itself. The target word is highlighted in yellow within the sentence so your eye finds it instantly. Click the sentence to toggle the English translation, and use the ↻ button to cycle through alternative example sentences.

I built this because the existing context sentence scripts I tried either showed the sentence only after answering, or placed it in a separate block below the question. I wanted the sentence to feel like part of the question itself visible at a glance, with the vocab visually anchored inside it.

Screenshot

image
image930Γ—541 23.7 KB

(Vocab ε…‰ is highlighted in yellow inside the sentence γ‚«γƒΌγƒ†γƒ³γ‹γ‚‰ε…‰γŒε…₯る。)

Features

  • Sentence appears the moment the card loads, not after answering

  • Click the Japanese sentence β†’ toggles the English translation (hidden by default to avoid spoiling the meaning)

  • Target vocab is highlighted in bright yellow inside the sentence

  • Handles conjugation: vocab ι£ŸγΉγ‚‹ correctly highlights 食べ in 食べた/食べて/etc.

  • ↻ button cycles through all available example sentences (most vocab has 3)

  • Auto-hides on radical/kanji reviews (no context sentences exist for those)

  • Works across Turbo navigation no need to reload after coming from the dashboard

Prerequisites

Installation

  1. Make sure Tampermonkey/Violentmonkey is installed in your browser

  2. Install Wanikani Open Framework if you don’t already have it

  3. Install this script: [Greasyfork link] (source code on [GitHub link])

Where it runs

  • /subjects/review β€” regular reviews

  • /subjects/extra_study β€” extra study sessions

  • /subject-lessons/*/quiz β€” lesson quizzes

It does not run on the Self-Study Quiz (different page, different DOM).

Customization

The highlight color is easy to change. Edit the script in your userscript manager and find this block near the bottom:

css

#wk-ctx-imm .wk-ctx-imm__hl {
    color: #fff35a;
    font-weight: 700;
}

Replace #fff35a with any color you like, or swap to a highlighter-style background:

css

background-color: rgba(255, 235, 59, 0.35);
padding: 0 2px;
border-radius: 3px;

How does this compare to existing context sentence scripts?

There are several great context sentence scripts already, and you might prefer one of them depending on your workflow:

This script’s niche: immediate display, inline with the vocab, with the target word visually highlighted. If you find seeing the sentence upfront too spoilery for your reading practice, one of the others is probably a better fit.

Notes

  • Highlighting uses exact match first, then strips trailing kana for verb/i-adjective stems, then gracefully falls back to no highlight rather than risk highlighting wrong characters

  • Built with help from Claude β€” I’m not a heavy JS dev, so bug reports and PRs are very welcome

  • Source code: [GitHub]

Hope it’s useful to someone else! :blush:

2

Why is this here and not in the API and Third Party Scripts subcategory?

3

Thank you for the information, i just moved it to that subcategory :smiley: