Kamesame issue

Hi everyone! I’m new here and I’ve only just started using WaniKani a few days ago.

Somehow, I found my way to KameSame. I’ve been trying to use it, but I can’t get the most out of it because some characters are just not loading. Instead of properly displaying stuff, I get squares. I tried looking up in the forums, but I can’t find a similar issue. Has someone else experienced this? How do you resolve this? I’ve already tried reloading, but I’m still getting squares.

If it helps, I’m using the Brave web browser [Version 1.5.115 Chromium: 80.0.3987.149 (Official Build) (64-bit)]. Here’s a screenshot:

If this is not the right place to ask, kindly direct me.

Thanks. I hope you everyone is staying safe and healthy!

2 Likes

I think you’re missing hiragana fonts?

2 Likes

Seems like it. They also do not appear as I type. But where am I missing them and where do I need to add them? This is only happening in Kamesame.

I think someone mentioned this problem on Opera as well. You might have no other choice but to use another browser for KS (if you want to keep using Brave).

I don’t really like the idea of needing another browser just for this one thing, but I can consider it. Do you use KameSame? On what browser do you use it?

I usually only use KS on my phone, so Firefox on Android.

Thanks. I might try that eventually. For now, I hope someone’s got a solution.

I’m on Vivaldi, and I have the same issue (also a Chromium based browser). Not sure why the kanji show up but not the hiragana.

I ended up creating my own Chrome extension to fix the issue, but I’ve emailed the developer with what I did to fix it in hopes that they’ll make the appropriate changes. Basically a few minor tweaks to the css to line it up with how WaniKani loads in fonts.

1 Like

Well you can also post your solution here, in case other people want to use it until KS fixed this issue on their end.

1 Like

I don’t suppose it’s an extension you can share, is it?

1 Like

The website creator already responded and it sounds like they are on board with fixing the issue, but here’s the source for the chrome extension I made in the meantime (not sure on the policy with sharing entire zip files in here):

styles.css:

body {
    font-family: "NotoSansCJK", "Noto Sans JP", system-ui, emoji, sans-serif !important;
}

input {
    font-family: "NotoSansCJK", "Noto Sans JP", system-ui, emoji, sans-serif !important;
}

fontloader.js:

var link;

link = document.createElement("link");
link.href = "https://fonts.googleapis.com/css?family=Noto+Sans+JP:400,700&display=swap&subset=japanese";
link.type = "text/css";
link.rel = "stylesheet";
document.getElementsByTagName("head")[0].appendChild(link);

manifest.json:

{
  "name": "KameSame Font Changer",
  "version": "1.0",
  "description": "Modify fonts in KameSame",
  "manifest_version": 2,
  "permissions": [
      "activeTab"
  ],
  "content_scripts": [
    {
      "matches": ["https://www.kamesame.com/*"],
      "all_frames": true,
      "js": ["fontloader.js"],
      "css": ["styles.css"]
    }
  ]
}
1 Like

I’m happy to report that the issue has been fixed already! That was fast. I’ll leave that code up in case anyone needs to change fonts on a Japanese learning website in future.

1 Like

Why this order?

"NotoSansCJK", "Noto Sans JP"

Try searching google for how to install proper/full/complete Japanese support on your device/browser. Often someone somewhere has already run into a similar issue. It’s pretty rare to be the first ever, these days. :blush:

Because that’s the order WaniKani sets them in the source css. Also, the input css bit was needed for the input field, which was using Arial for the font instead of a proper font. I suspect Chrome does some custom fixes that aren’t natively in the Chromium codebase, so if sites aren’t comprehensive about font families then they won’t look right in certain browsers. Japanese-only websites look fine for me, so it’s just edge cases like KameSame that sometimes don’t look right in all browsers.

I understand the input, I was just confused that the superset has precedence. Didn’t know that that’s how WK has it. Thanks for the clarification.

I also love the Brave browser. My company is a verified content creator. :slight_smile:

1 Like