BritVSJapan

If you’re looking to use Anki as one of your main forms of studying Japanese then you’ve certainly made a good choice. There are a few things you will need to do in order to make it so that you can study with Anki efficiently though and one of these things is adding Furigana to your Anki flashcards.

I’ll show you how to add Furigana to normal Japanese Anki cards using the Japanese Support plugin as well as how to add it to your Subs2SRS flashcards as well if you use them (if you don’t use them then you’re missing out!).

If you’re interested in watching a video tutorial on how to do this then check out the video on my main channel below (skip to 4:25 for adding Furigana).

Adding Furigana to Japanese Flashcards in Anki

You will need to install the Japanese Support plugin in order for this to work!

Japanese Support plugin: https://ankiweb.net/shared/info/3918629684

In order to add Furigana to our flashcards in Anki we are going to need to edit our “Note Type”. Anki allows you to customize and create different notes, and you can use some basic programming in order to make them function in different ways.

For example you can make cards show pictures, play audio, change font sizes and colors etc using some HTML and CSS.

If you’re cards are not based on the Japanese Support plugin’s note type then you can follow the steps laid out below in the section; “Adding Furigana to Subs2SRS Flashcards”, as the same process applies, then all you have to do is convert all your old cards into the new note type by highlighting all your previously made cards in the Anki browser and converting them to the new note type by going to Edit -> Change Note Type.

As long as your Flashcards are created from the Japanese Support plugin’s note type you will be able to add Furigana easily by simply adding a small line of code onto your Card Layout.

To do this simply go to a Flashcard you want to add Furigana to and type “e” for “Edit”. This will bring up the following window:

Now my card already has Furigana on it and you can tell by the Hiragana inside the [] brackets. This is important to note as the Furigana generation isn’t always correct, but as long as those [] brackets are there then you can change the text inside them to be correct.

From the above screen you will need to click the “Cards” button in the top left which will take you to the following screen.

This is where we can find the code for our cards and edit it to our liking. By default the front of the card is shown on the right, with the code for displaying it on the left. We can change the view by clicking the front or back templates.

By default, the Japanese Support plugin will add Furigana to only the Reading field.

If you wish to add it to a different field then all you need to do is copy the syntax used on the Reading field, to a different field.

Simple put, whenever you see a field in these brackets

{{Reading}}

all you need to do for that field to display and generate Furigana is to add “furigana:” before the field name like so:

{{furigana:Reading}}

If you aren’t entirely sure then you can simply copy my code layout and it will work fine for you.

Simply click on each of the dots on the left side of the Card window and copying the corresponding code to the correct section.

Front Template

<span style=”font-family: Mincho; font-size: 40px; “>{{Expression}}</span>

Back Template

{{FrontSide}}

<hr id=answer>

<span style=”font-size: 40px; “>{{furigana:Reading}}</span><br>

<br>

<span style=”font-family: Mincho; font-size: 32px; “>{{furigana:Meaning}}</span>

Styling

.card {

font-family: Machino;

font-size: 32px;

text-align: center;

color: black;

background-color: white;

}

.expression {

font-size: 40px;

}

If you want to have Furigana on the Expression field (so that it appears on the front of the card as well) then use the following code for the Front Template instead:

<span style=”font-family: Mincho; font-size: 40px; “>{{furigana:Expression}}</span>

Adding Furigana to Subs2SRS Flashcards

If you wish to add Furigana to your Subs2SRS flashcards then we are going to have to create a new note type. You can do this in the “Manage Note Types” section under “Tools” on the main Anki home screen.

From here we can click “Add” to create a new note type.

Clicking Add will open a new window that looks very similar to the previous one. What we do here is decide what note type we want to base our new one off.

Here we select the Japanese (recognition) card from the Japanese Support plugin as our base to work from.

Then all we need to do is create new fields on our card so that it is the same layout as a Subs2SRS card but with the extra “Meaning” and “Reading” fields. To do this we simply find our new Note Type in the Manage Note Type section and click on the “Fields” button on the right.

Then we just start adding new fields with the same names as the ones in Subs2SRS by clicking “Add”, giving the field a name such as “Snapshot”, and then hitting “OK”.

Click “Yes” on the warning popup, and you will find the new field in the fields list.

Continue doing this until your fields list looks like mine below:

Now all you have to do to make this note type work like a normal Subs2SRS flashcard with Furigana added to it is to copy over the following code to the “Cards” section like we did before when adding Furigana to a normal Japanese Support note type.

To do this go back to the “Manage Note Types” window, select your new note type and click “Cards”. You then want to copy and paste the following code into each of the corresponding templates and styling sections so that your card layout looks the same as mine.

Front Template

<div class=expression>{{Expression}}</div>

<div>{{Snapshot}}</div>

Back Template

{{FrontSide}}

<hr/>

<div id=answer>

<div>{{Audio}}{{furigana:Reading}}</div>

<br/>

<div>{{furigana:Meaning}}</div>

Styling

.card {

font-family: Machino;

font-size: 32px;

text-align: center;

color: black;

background-color: white;

}

.expression {

font-size: 40px;

}

Example

Front Template

Back Template

Obviously, you can’t hear the Audio but as long as you pasted the above code correctly it should work fine for you.

If you want to add Furigana to the front of the card as well then you can use the following code for the Front Template instead:

<div class=expression>{{furigana:Expression}}</div>

<div>{{Snapshot}}</div>

If you’ve not created a Subs2SRS Flashcard before then I recommend checking out my full guide on how to use them effectively here, as well as my YouTube tutorials on how to use them here.

I hope you found this useful!

Click here for more information on language learning

マット

By Matthew Hawkins

26/07/2021

Massive thanks to Diederik, Eric, R, Harry and everyone else supporting me on Patreon. You guys are awesome! 🙂

Follow me on Twitter

Support me on Patreon