サイトに自動的にルビ(よみがな)を振ってくれる

メニューにルビを自動的に付けたい人向け
今見ているURLのルビ用リンクを作る
1. ルビを『付ける』『付けない』両方出す
2. 現在のURL次第でルビ付ける・付けないリンクを作る

メニューにルビを自動的に付けたい人向け

URLを後ろにつけるだけで自動的にルビ(よみがな)を振ってくれるシステムを今日知った。
指定の仕方は

https://trans.hiragana.jp/ruby/【ルビつけたいURL】

これだけ。
※ルビ対象URLには『https://』も付けるよ
表示例として、
まずは通常表記がこちら

https://trans.hiragana.jp/ruby/

サイトに自動的にルビ(よみがな)を振ってくれる

メニューにルビを自動的に付けたい人向けURLを後ろにつけるだけで自動的にルビ(よみがな)を振ってくれるシステムを今日知った。指定の仕方はvar myset = { seturl : "", target : "",};document.wr...

それを

https://trans.hiragana.jp/ruby/https://qooga.jb-jk.net/wp/automatic-reading/

https://trans.hiragana.jp/ruby/https://qooga.jb-jk.net/wp/automatic-reading/

としてアクセスしてみる
と…
おおおお！
全部の漢字にルビが振られている！
ふりがな、たまに間違えてるけどね。
なぜか日本語サイトに変わりはないのに、Chromeに英語サイト判定されて、勝手に文字を変えられる。
日本語から日本語に変換して、文章内容変えるってどうなのさ…
てかこっちで変えるから勝手に変えないでってChromeに思ってる。
ブログカード表示、ちょっとおかしくなるんだけど、これのせいだろうか？
ちなみにリンクも自動的にルビ付きにしてくれる親切設計。
ルビ用リンクには、そのリンクの前に『https://trans.hiragana.jp/ruby/』が付いちゃう
※どういうことかわからなければ、変換後のページで⇧のブログカードのURLを確認してみてね
「コレって延々と付くのかな？」と思って２回試すと503になった。
制作者の方ごめんなさい案件である。
たまにレイアウトが崩れることもある。
ちなみに携帯(ガラケー)から表示させると

携帯けいたい情報じょうほう

みたいな表示になってしまっていたけど、もうないから、そこは安心だね
では、動的にリンク作る方法を以下に書いておきますねー

今見ているURLのルビ用リンクを作る

当然だけど『使った後のページ』からは、ルビのない状態に戻せない。
だが、JSで出せば大体解決である。

ルビを『付ける』『付けない』両方出す

<script type="text/javascript">
myset = {
    seturl : "https://trans.hiragana.jp/ruby/",
};
myset.find = document.location.href.indexOf(myset.seturl);
if (myset.find==-1) {
    myset.targeturl = document.location.href;
}else{
    myset.targeturl = document.location.href.substring(myset.seturl.length,document.location.href.length);
}
document.write("<a href='"+myset.targeturl+"'>ルビなし</a>　<a href='"+myset.seturl+myset.targeturl+"'>ルビあり</a>");
</script>

⇩こんな感じで表示される
ルビなし　ルビあり

現在のURL次第でルビ付ける・付けないリンクを作る

WordPressのメニューに付けるならばこっち。

<script type="text/javascript">
myset = {
    seturl : "https://trans.hiragana.jp/ruby/",
};
myset.find = document.location.href.indexOf(myset.seturl);
if (myset.find==-1) {
    myset.targeturl = document.location.href;
    document.write("<a href='"+myset.seturl+myset.targeturl+"'>ルビ付ける</a>");
}else{
    myset.targeturl = document.location.href.substring(myset.seturl.length,document.location.href.length);
    document.write("<a href='"+myset.targeturl+"'>ルビ消す</a>");
}
</script>

⇩こんな感じで状態によって変わるよ
ルビ付ける
おためしあれ