あきぞらです。
UTF-8
とUTF-8-MAC
の文字コードの違いで、
濁点や半濁点が2文字になってしまう問題がおきることがあります。
今回はこの問題について、(力技で)対処してみようと思います。
目次
UTF-8の濁点や半濁点が2文字結合になる問題
UTF-8
とUTF-8-MAC
の文字コードの違いによって、
濁点と半濁点の文字が異なる文字になることがあります。
UTF-8-MAC
で書かれた濁点や半濁点では、たとえば以下のようになってしまいます。
アキゾラ → アキソ゛ラ プリン →フ゜リン
WindowsとMacで作業が行われている場合にこの問題が起きがちだと思います。
UTF-8
としてはUTF-8-MAC
で濁点が2文字結合で書かれていても問題ないようなのですが、
Windowsで確認しようとしたときに
「なんか2文字になっている・・?」
といったことが発生しそうです。
WordPressで2文字結合の文字が発生
今回、Wordpressの記事で、この文字コードによる問題が発生しました。
文字コードが違っている場所を特定できればよかったのですが、
どこに潜んでいるか特定できず、一括で置換を行うことにしました。
functions.phpに文字を置換する処理を挿入する
そこで、functions.php
でフィルターフックを用いて、
記事内容のテキストを置換する力技を考えました。
以下がそのコードです。(かなり力技です)
以下をfunctions.php
の適当な場所に書いてあげます。
function replaceUtf8mac($content) { $moji_code = substr(json_encode($content), 1, -1); // ひらがなを置換 $table = [ // が行 "\u304b\u309b" => '\u304c', "\u304d\u309b" => '\u304e', "\u304f\u309b" => '\u3050', "\u3051\u309b" => '\u3052', "\u3053\u309b" => '\u3054', // ざ行 "\u3055\u309b" => '\u3056', "\u3057\u309b" => '\u3058', "\u3059\u309b" => '\u305a', "\u305b\u309b" => '\u305c', "\u305d\u309b" => '\u305e', // だ行 "\u305f\u309b" => '\u3060', "\u3061\u309b" => '\u3062', "\u3064\u309b" => '\u3065', "\u3066\u309b" => '\u3067', "\u3068\u309b" => '\u3069', // ぱ行 "\u306f\u309a" => '\u3071', "\u3072\u309a" => '\u3074', "\u3075\u309a" => '\u3077', "\u3078\u309a" => '\u307a', "\u307b\u309a" => '\u307d', // ば行 "\u306f\u309b" => '\u3070', "\u3072\u309b" => '\u3073', "\u3075\u309b" => '\u3076', "\u3078\u309b" => '\u3079', "\u307b\u309b" => '\u307c', ]; $search = array_keys( $table); $replace = array_values( $table); $moji_code = str_replace($search, $replace, $moji_code); // カタカナを置換 $moji_code = str_replace("\u3099",'\u309b',$moji_code); $moji_code = str_replace("\u309a",'\u309c',$moji_code); $decode_content = json_decode(sprintf('"%s"', $moji_code)); $decode_content = mb_convert_kana($decode_content,"aks","utf-8"); $decode_content = mb_convert_kana($decode_content,"KV","utf-8"); return $decode_content; } add_filter('the_content', 'replaceUtf8mac');
カタカナは一度、濁点・半濁点の半角カナにしたあと全角カナに戻して1文字の全角カナにもどすという処理をしています。
ひらがなは半角カナはないので…みてもらうとお分かりの通り、
頑張ってマッピングテーブルを作り、
合致したものを置換するという処理にしています。
フィルターフックを使いテキストを置換
以下の処理で、フィルターフックを呼び出しています。
the_content
を指定することによって、記事内容を取得し、
replaceUtf8mac
の関数の中で使用することができます。
add_filter('the_content', 'replaceUtf8mac');
処理が重くなる可能性があるので注意
上の処理ですが、記事内容が重かったりすると処理が重くなる可能性があります。
データを書き換えられるのであれば、データそのものをUTF-8で統一した方がよいです。
まとめ
実装してみて改めて思いましたが、文字コードって面倒くさいですね…。
複数人でかつそれぞれが異なる環境で作業する場合は気を付けたいです。
では、また。