
登場から早数か月、やっとFirefox Quantumに乗り換えたのを切っ掛けに、ブログの執筆に使用していたアドオンを「Make Link」から「Format Link」に変更した。登録可能な項目数が9個とあまり多くない点を除けば、変数などもシンプルなので比較的スムーズに移行作業は終わったのだが、使用している間にHTMLの特殊文字、例えば「<」(小なり)や「&」(アンパサンド)をエスケープしてくれないことに気がついた。
確かMake Linkだと「HTMLエンティティを使用する」のチェックボックスをONにするだけで、この辺の処理を自動でやってくれたと思うのだが、そういった設定項目はないらしい。
とはいえ「HTMLエンティティが使えないので、手動でわざわざ変更しなければいけない」というわけではない。Format Linkの変数には正規表現が使えるので、それで使用者自らが必要に応じて設定しろ、ということのようだ。実際に公式ページには、英語ではあるが解説が書かれている。
string substitution: {{variable.s("foo","bar")}}
<a href="{{url.s("\"",""")}}">{{text.s("<","<")}}</a>
というわけで上記を参考にして、自分がブログを書く時に使うのにちょうどいい感じの変数を考えてみた。HTMLのタグを使用しながらテキストを書く必要がある人には、参考にしてみてほしい。
URL - {{url}}
URLにはあまり変な文字が使われることはないので、最低限のエスケープ処理だけすればいいように感じた。具体的には冒頭でも触れた「&」と「"」(ダブルクォーテーション)だけ。したがって、変数も短くて済む。
{{url.s("&","&").s("\"",""")}}
TITLE - {{title}} & TEXT - {{text}}
タイトルとテキストでは普通の文章が使われるので、気をつけなければいけない文字が多い。HTMLのタグになってしまう「<」や「>」はまさにその典型だが、企業ページなどでは「®」(商標マーク)や「™」(トレードマーク)などが使われることがあって、環境によってはエディタに正常にコピーできない場合がある。それも含めて対処した変数となっている。
{{title.s("&","&").s("\"",""").s("®","®").s("™","™").s("©","©").s("<","<").s(">",">")}}
{{text.s("&","&").s("\"",""").s("®","®").s("™","™").s("©","©").s("<","<").s(">",">")}}
とりあえず今はこのような変数を設定しているが、使っているうちにHTMLエンティティ化の必要がある文字に気がついたら、随時変更していく必要がありそうだ。
この記事へのコメント
コメント機能を利用するにはログインする必要があります。「Disqus」または「Twitter」「Google」「Facebook」などのアカウントが使用できます。