先日、フォーラムのトピックモバイル表示時の改行部分に・が入るという不具合報告がありました。
今回は、その解決方法紹介したいと思います。
目次
Android版Chromeの不具合
その不具合というのは、テーマや文章内に を用いた半角スペース（実際は半角スペースではない）を挿入すると、普段はこう表示されているものが、
Android版Chromeを使用してみると、以下のように表示されるようです。
原因について調べてみると、どうやらAndroid版Chromeによるバグが原因ではないかということになりました。
Googleのプロダクトフォーラムには、以下のように書かれていました。
Android 版 Chrome 40 において， が”・”として表示される不具合が報告されています。
自分の Android 端末でも”・”と表示される問題を確認しました。
もし何かしらの関連があれば、Android 版の問題が解決すると、こちらも解決する可能性もあります。
他のテーマでも、不具合が報告されています。
参考 【STINGER5】AndroidのChromeで＆nbsp;が「・」になってる気がする | ビビビッ
不具合を回避する方法
「・」が出る不具合は、Chrome由来のものなので、根本的にはGoogleに修正してもらうしかありません。
ただ、Android版Chromeの不具合を回避する方法は、今のところ2種類ほどあるようです。
- 不具合の出ないフォントに変更する
- を代替のもの（ ）などに置換する
フォントの変更
僕の利用しているテーマは、フォントが以下のように設定されていました。
body {
font-family: "Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
}これを以下のように、Helvetica（ヘルベチカ）を優先したフォント指定にしてやると・は出なくなるようです。
body {
font-family: Helvetica,"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
}ただ、この方法の場合Wordpressテーマで意図したフォントと英数字部分が変わってしまいます。
参考 STINGER5の半角スペースが点「・」で表示される対策（Android Chrome）
を代替のもの（ ）などに置換する
フォント表示を変更したくない場合は、 を置換する方法もあります。
を使用する代わりに、他の代替となるものを利用すると不具合は発生しないようです。
代替となるようなものには、以下のようなものがあります。
-  （nと同じ幅のスペース）
-  （mと同じ幅のスペース）
-  （細い幅のスペース）
詳しくは、以下のページがとても参考になります。
参考 ＆nbsp; は半角スペースではないというお話 (フェンリル | デベロッパーズブログ)
これを踏まえて、Wordpress側で 対策をするなら以下のようにすれば良いかとコードを書いてみました。
functions.phpで を置換する方法
とりあえず、 さえ表示されなければ、・は表示されないそうなので、以下のように、本文部分をフックして を に置換してやる処理を書きました。
//Android Chromeで が・に表示される不具合対策
function replace_nbsp_to_ensp($the_content) {
if ( is_singular() ) {
$the_content = str_replace(' ', ' ', $the_content);
}
return $the_content;
}
add_filter('the_content','replace_nbsp_to_ensp');これを、functions.phpにコピペすれば、とりあえず見た目も変更もなく、Chromeの不具合対策が行えます。
まとめ
と、こんな感じで不具合対策ができます。
最初に不具合を報告された方からも、解決した旨の書き込みをいただきました。
Chromeの・について不具合報告した者です。 最新版の1.5をインストールし使ってみました。 確認したところ・は消えていました！
とりあえずこれで、目ざわりな・は表示されなくなったようです。
Chromeも、おそらく不具合には気づいていると思うので、そのうち対策されると思います。ただ、対策されるまでは、functions.phpの方法をペタッと貼り付けておいても良いかもしれません。
Chrome側で、対策されたら、貼り付けた部分を削除すればOKです。（削除し忘れても、特に害はないと思います。）
×nbsb
○nbsp
引用した文章とかをちゃんと見てりゃ気付くでしょうに