今回はほんとに、まれに起こる問題ですのでおおよそほとんどの方に興味もたれないかなぁと思うんです。しかし、短い記事ですので一度目を通しておいていただけるとその問題が起こったときに「あれかー！」と思えるようになるのでお読みいただければ幸いです。
最近数回、ホームページをみているときに L SEP という謎のマーク（あとで絵でお見せしますね）が表示されていることに気づきました。しかも環境によって見えたり見えなかったりします。その原因とWordPressの記事にそれが入ってるときの解決方法を考えました。
「L SEP」が見えている状態はこんな感じでした！
L SEP が見えちゃっている状態、というのはこういう感じです！
こんな感じ。拡大すると、
このように L SEP という文字が点線の四角で囲まれた感じにみえます。
「L SEP」が見えてる環境
この L SEP が見える環境、というのは限定的で Windows を使っている かつ Chromeを使っている のときだけのようです。
先ほどのPCにある、Firefoxで同じ記事を見たときには、
このようにL SEPは表示されません。Chrome以外のブラウザやMacではChromeにした場合でもこのL SEPは表示されません。
じゃ、一部だから気にしなくてもいいのかな？とも思いますが、
このようにChromeが52.3%と1位になっていました。この統計ではWindowsとMacが分けられないので、Safariも入っていますが、Macを除けばもっと多い数字になるのではないかと思います。
日本ではWindowsの方が多く使われていることを考えるとWindows を使っている かつ Chromeを使っている 方に、文字化けのような L SEP が見えてしまっている状態は解消した方がいいのではないかと思われます。
そもそも L SEP ってなに？なんではいるの？
これを最初に見つけたときに調べてみたのですが、L SEPとは、Line Separatorの略称のようです。おおよその環境ではこのコードが入っていても「何も表示されない」のですが、WindowsのChromeの時だけ、このような文字化けのような表示になるようです。
そして、どうしてこのようなコードが入るのかということを調べてみたところ
・Macで作成した文章
・原稿は Microsoft Office や i-Movie などソフトウェアで作成した文章をコピーしたものを貼り付け
たとき、に起こっているようです（身近な例なので限定的かもしれません）。また、コピペした本人はMacユーザーなので、この L SEP はどこにも見えません。
L SEPが入っているときの直し方
WindowsのChromeを使っていても、表画面では L SEP が表示されるのがわかりますが、ダッシュボードの編集画面（ビジュアル）では
このように、特に何も表示されないため修正は難しいです。
テキストタブで見たときも、
冒頭のL SEPは謎の空白、があるのでそこを削除すれば消えるかなと思いますが、行末は改行なのでわかりづらいです。まぁそのあたりの謎の空白を消せば消えるとは思いますが、なかなかに難しいものがあります。
L SEPのデータを見つけてみる
調べてみると、L SEP の部分は
16進数で表現すると e280a8 となることがわかりました。
L SEPのデータを消すようなコードを書いてみる
ということがわかったのでこのL SEPが画面表示の時には削除しておきたいと思います。
子テーマの functions.php に以下のようなコードを書いてみました。（子テーマではなく、コードスニペットを使ってる場合はこのコードを貼り付ければ動作すると思います）
// windows chrome で見えるL SEPを表示時に削除する
function usort_edit_lsep_contents($contents){
return hex2bin(str_replace("e280a8","",bin2hex($contents)));
}
add_filter('the_content', 'usort_edit_lsep_contents');
これを入れてから、WindowsのChromeで表示すると、
このようにL SEPが削除された状態で表示することができました。
追記2019/01/24:タイトルに L SEPが入っているとき
想定していなかったのですがタイトルにも L SEP が入ってしまう場合がありました。その場合は、
function usort_edit_lsep_title( $title ){
return hex2bin(str_replace("e280a8","",bin2hex($title)));
}
add_filter( 'the_title', 'usort_edit_lsep_title');
同じコードをタイトルのフィルターにもかけておくと消えるようになります。
おまけ：コードの説明
コードに興味のある方にこのコードでなにをしているかを説明します。
add_filter('the_content', 'usort_edit_lsep_contents');
the_contentというフィルターフックでに usort_edit_lsep_contents という指定をすることで本文を表示する前に、usort_edit_lsep_contentsという関数を通る指定ができます。
そのusort_edit_lsep_contentsでは、
$contents＜本文
を受け取って、
return hex2bin(str_replace("e280a8","",bin2hex($contents)));
で加工したものを本文として返しています。この部分は1行にしてしまいましたが、分解すると、
// $textは適当な変数名
// $contents（本文）をバイナリーから16進数に変換する
$text = bin2hex($contents);
// L SEP を表す e280a8 を ""（空白）に置き換え
$text = str_replace("e280a8","",$text);
// 16進数に変更した本文をバイナリーに戻してリターンする
return hex2bin($text);
こんな感じのことをしています。
蛇足：アイキャッチ画像がMacなのにL SEP見えてるって？と思った方。
えーと、私はMacにWindowsをブートキャンプで入れて使っていてまさにこのアイキャッチの画像のような状態であります。あきらかにまれで変態的な使い方なのですが、ここのところずっとそんなんで使っております。
ということで嘘じゃない(^_^;)ってことで！
コメント