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

WEBサービス作成

2019.09.10 2009.11.18

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

指定の仕方は


http://trans.hiragana.jp/ruby/
trans.hiragana.jp[ルビつけたいURL]

これだけ。

表示例として、
まずは通常表記がこちら

それを

としてアクセスしてみる
と…
おおおお！
というわけです。

因みに
リンクも自動的にルビ付きにしてくれる親切設計。

だが普通に貼ったのでは、ルビのない状態に戻せないし、ルビを更に付けようと遊ばれたり…。

しかも携帯(ガラケー)から表示させると

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

みたいな表示になってしまう。

そこでルビつける・つけないのリンク作成方法を以下に記載

<script type="text/javascript">
myset = {
	seturl : "http://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>");
document.write("<a href='"+myset.seturl+myset.targeturl+"'>ルビあり</a>");
</script>

つまりJSで出せば大体解決なのである。

因みに他にも注意が必要で
一部のレイアウト情報は無視されるし、
ふりがな、たまに間違えます。

wordpressのメニューに付けるならば

<script type="text/javascript">
myset = {
	seturl : "http://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>