【プラグインなし】WordPressで文字の上にフリガナ(ルビ)を簡単にふる方法

WordPressの使い方 WordPressで文字の上にふりがな(ルビ)を簡単にふる方法

こちらの記事では、プラグインを使わずにワードプレスで簡単にフリガナを付ける方法を紹介します。

通常4〜5秒でルビを振れてしまいますよ！
（長い文字列や、タイピングスピードが遅い方だともう少し秒数はかかると思います）

実はWordPressにはフリガナをふるためのプラグインも存在しています。

でも私はプラグインを使わなくても簡単に対応できる機能であれば安易にプラグインを入れるべきではないと考えます。

「ワードプレスのサイトが真っ白になるエラー」について聞いたことはあるでしょうか？

そのエラーが最も多く発生するタイミングがプラグイン更新時なんです！

もちろん、エラーの対処法は簡単なので必要以上に恐れることはないです。

でも今後ずっとWordPressを運営していくとしてプラグイン1つあたり何回のアップデートがリリースされるのかを考えてみると…？

入れるプラグインは１つでも少ない方が不安の種を減らしておけますよね。

それに、サイト真っ白ほどのシビアなエラーではない場合でもプラグイン同士が干渉し合ってワードプレスのパフォーマンスが最大限発揮できないことは普通にあります。

こういった理由から、私はプラグインを使わずにルビを振ることをおすすめしています。

目次

スポンサーリンク

動画で解説｜WordPressで文字の上にフリガナを振る方法

フリガナを振る方法を画面スクショ付きで解説！

こちらの記事ではClassic Editorというプラグインをインストールしてあることが前提で解説しています。

（グーテンベルクの方はhtmlのブロックでこの作業をしてください）

ワードプレスでプラグインを使わずにルビを振るには

<ruby>文字<rt>カナ</rt></ruby>

というコードを使います。

ワードプレスの記事作成画面で…テキストタブをクリックし、テキストモードにします。

↓

例えば薔薇という文字の上にバラというフリガナを振って薔薇バラとしたい場合は

<ruby>薔薇<rt>バラ</rt></ruby>

と入力します。

また、心太という文字の上にところてんというルビを振って心太ところてんとしたい場合は

<ruby>心太<rt>ところてん</rt></ruby>

と入力します。

必ずテキストタブをクリックしてから入力してくださいね。

ビジュアルモードのままで入力しても、

醤油しょうゆ小さじ1杯

とは表示されず

<ruby>醤油<rt>しょうゆ</rt></ruby>小さじ1杯

と表示されてしまうだけです。

フリガナをふる際の注意点

せっかく「親切で分かりやすい情報をユーザーに届けよう」と思ってルビを振っても、逆に見づらくなってしまったら意味がありませんよね。

ルビの振りすぎに注意

例えば

名古屋市東区主税町ちからまちにあるカフェ「○○」に行ってきました。

ここ主税町ちからまちは〜〜〜〜。

そんな主税町ちからまちの〜〜〜〜〜〜〜〜。

というように毎回毎回フリガナが振ってあったら、しつこいし逆に見づらいですよね。

基本的にルビは初めの1箇所だけ振れば良いと思います。

あとは、漢字の難易度に応じて

  • 超難読漢字には初めの2箇所ぐらいに振る
  • やや難読めな漢字、かつルビを振ってからかなり間が空いて2回めが登場する場合は2回めも振る

などは臨機応変に対応してみてください。

見出しにはルビを振らない方が良いかも

こちらで紹介するのは単純に見た目の好みの問題ですので、気にならない方はスルーしていただければと思います。

見出しにもルビを振ると、こんな感じ↓で…

WordPressでフリガナ(ルビ)をふる時の注意点一見よさそうに思えますよね。

でも、見出しから自動的に拾われる目次を確認してみると…

WordPressでフリガナ(ルビ)をふる時の注意点このように横並びになってしまいます。

無駄に見出しが長くなってしまうので、このように…

WordPressでフリガナ(ルビ)をふる時の注意点見出しではフリガナを振らず、本文で振るのがスッキリ見えると私は思います。

さらに簡単にフリガナを振る方法

こちらのコード↓を

<ruby>文字<rt>カナ</rt></ruby>

パソコンに辞書登録しておくと、毎回どこかからコピペしてくる必要がなくなるのでオススメです。

るびという読みで登録しておくのがオススメです。

単語登録の方法はパソコンや文字入力システムの環境によって違うかもしれませんが、参考までに私のパソコンの登録方法を紹介しますと…

ツールバーの あ のところをクリックし、

単語登録

  単語登録 をクリックし、

  1. 単語のところに<ruby>文字<rt>カナ</rt></ruby>と入力
  2. よみのところにるびと入力

すれば単語登録ができます。

実際にフリガナを振る時は『るび』と入力すると、変換候補に

  • ルビ
  • <ruby>文字<rt>カナ</rt></ruby>
  • るび
  • 瑠
  • 流

のような感じで上がってくるので

<ruby>文字<rt>カナ</rt></ruby>

を選択すればOKです。

さいごに

WordPressで文字の上にフリガナ（ルビ）を振る方法を紹介しました。

ぜひ適度にルビを振って分かりやすいブログを運営していきましょう！

フリガナ機能に限らず簡単に対応できることなのに安易にプラグインを入れることはおすすめしていません。

JINをお使いの方は下記の記事も参考にしてみてくださいね。

関連記事
【WordPressを軽く】テーマ｢JIN｣に設定不要な相性の良くないプラグインは6つ以上もあった！

ワードプレスでブログを運営するにあたり導入すべきプラグインはたくさんありますが、JINのテンプレートを使っていればインストールしなくて済むプラグインが6つもあります！ またエックスサーバーでサーバーを契約し[…]

WordPressの使い方の最新記事8件