[Userscript] Forum and some websites: Prioritize Japanese glyphs (Han unification)

I don’t know
but I would like to have the typefont changed
preferably to Comic Sans MS

1 Like

The only way to default to Japanese is to mark the whole forum as Japanese. But most of the forum is English, not Japanese. It would probably render everything better, but search engines might treat the forums differently if all the English text is marked as Japanese.

The right way to do it is to mark Japanese text as Japanese, like this:

Japanese:
<span lang="ja">直線、海、過ぎる、似る、角</span>
Result: 直線、海、過ぎる、似る、角

Chinese:
<span lang="zh">直線、海、過ぎる、似る、角</span>
Result: 直線、海、過ぎる、似る、角

That’s not exactly intuitive, so it would be great to have a button or something to mark text as Japanese. But since WK’s forums are hosted by Discourse, customization probably isn’t an option.

16 Likes

Everywhere I go…
I see him :pensive:
SansOverworldSprite

3 Likes

This script should attempt to import and use Noto Sans JP as a font, and then if not fallback on a variety of standard Japanese fonts.

// ==UserScript==
// @name         Japanese Fonts for Wanikani Forums
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  Try to import and use Noto Sans JP, and if not fall back on a standard Japanese font.
// @author       Michael Charles Aubrey
// @match        https://community.wanikani.com/*
// @icon         https://www.google.com/s2/favicons?domain=wanikani.com
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

const style = document.createElement("style");
style.innerText = `
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap');
* {
    font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, メイリオ, Meiryo, "MS Pゴシック", "MS PGothic", "MS ゴシック" , "MS Gothic", "Noto Sans CJK JP", TakaoPGothic, sans-serif;
}
code * {
    font-family: Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New", monospace !important;
}
`

const head = document.getElementsByTagName("head")[0];
head.appendChild(style);
})();
5 Likes

So THAT’S why my mac’s (chinese) handwriting input stubbornly will not recognize when I draw no matter how carefully I do it. Mystery solved.

4 Likes

<span lang="ja"> 直線、海、過ぎる、似る、角</span> doesn’t work for me.

It has to be

<span lang="ja-JP"> 直線、海、過ぎる、似る、角</span>.

(I have just noticed I don’t really need JP after ja- in my browser, but hyphen is needed…)

There might be another UserScript solution to inject lang="ja-JP" as well.

What browser are you using that requires a hyphen?? Whatever the case, it’s non-compliant.

Firefox on Arch Linux. But yeah, it appears to be fine in Firefox on Android.

EDIT: much easier option is just, don’t use ttf-droid (pacman -R ttf-droid).

: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.

It appears that forcing font can be quite overdone and unbeautiful. (Also, an ugly way to avoid styling code using !important.)

Anyway, my UserScript is born. Get it here - Wanikani Community Prioritize Japanese Glyphs.

// ==UserScript==
// @name         WaniKani Community prioritize Japanese glyphs
// @namespace    https://github.com/patarapolw
// @version      0.1.3
// @description  Prioritization of Japanese glyphs for Han unification
// @author       polv
// @license      MIT
// @match        https://community.wanikani.com/*
// @icon         https://www.google.com/s2/favicons?domain=community.wanikani.com
// @grant        none
// ==/UserScript==

(() => {
  function injectLangHTML(lang) {
    // I might not need to use MutationObserver at all...
    const obs = new MutationObserver(() => {
      if (document.documentElement.lang !== lang) {
        document.documentElement.lang = lang;
      }
    });
    obs.observe(document.documentElement, { attributeFilter: ["lang"] });

    // Only this part is the real thing.
    document.documentElement.lang = lang;
  }

  injectLangHTML("ja-JP");
})();

Edit: It appears to be extremely simple. Only <html lang="en"> needs to be edited. (And <html lang="ja"> doesn’t work in Firefox for Arch Linux for some reasons.)

2 Likes

interestingly installing the userscript did not change it at all for me. I guess its because I have japanese installed as a langauge with higher priority than chinese on my computer (i quite often experience the problem in the other direction tho)

wait how are you using the discourse editor to enforce the language tag??

Just type the span tags exactly as shown. Certain html tags and attributes are whitelisted in discourse. In fact, it was me and @seanblue that got the folks at discourse to whitelist the lang tag.

7 Likes

Actually, It’s not fixed even if the forum language is set to Japanese.

Even now, it is perfectly fine with Firefox on Android, but yes, the forum language just has to be set to Japanese.

I thought WaniKani Team isn’t interested in translating the forum, but somehow, most of the badges are translated.

badges

1 Like

Interesting.
By the way, when I mentioned marking the whole forum as Japanese, I meant adding a lang tag to a top-level html tag, rather than actually configuring your account language.

But hey, if it works…

1 Like

That’s because most of the badges are built into Discourse and Discourse includes a Japanese translation of the site. Notice that all the custom WaniKani badges (like the durtle ones) aren’t translated.

3 Likes

Actually, it becomes Chinese form again in Gmail app on Android.

I guess only certain Webviews can be fixed, otherwise it depends (mostly broken, though).

1 Like

You cannot grasp the true form of Discourse’s kanji!

I edited the UserScript a little to add more websites, not exactly sure whether this is an Arch Linux-specific issue. I also now realized that UserScript can be installed on Android.

Some websites to test (with 誤解).

誤解 variants

// @match https://www.kanjipedia.jp/*
// @match https://youglish.com/pronounce/*/japanese?
// @match https://*.immersionkit.com/*

Yeah, ImmersionKit too, @mathewthe2.

On Android (which should be standard-compliant with <html lang="ja">), Goo, Weblio, ALC, Yourei are OK; but the rest (Kanjipedia too) still have Chinese counterparts without the script.

It is possible to edit the UserScript to add more websites, as well as use regular expression, if @match isn’t sufficient.

Continually updated version that add more websites for mobile (Kiwi Browser for Android). The website that I added today is nihongoswitch.com

Actually, I’ve found the way to set language priorities in that mobile web browser, but I add the link to the always-updated script here, just in case (for myself).

This topic was automatically closed 365 days after the last reply. New replies are no longer allowed.