\ バックスラッシュになる原因と対処方法">

エス技研

WordPress、CakePHP、PHP、baserCMSなどの Web系システムを中心に情報を提供します!


WordPressで ¥円マークが \ バックスラッシュになる原因と対処方法

      2018/03/21

¥円マークが \バックスラッシュになる原因はフォント

 

WordPressで「¥」が「\」に変換される

 
WordPressを使っていて、ある日「¥」が「\」に変わっていることに気づきました。
 
このブログでもその現象がありましたが、技術ブログですので「c:\wordpress\data」といった感じで表示されていても分かってもらえるだろう、とスルーしていました。
 
ですが、このブログではない女性のユーザが多い子育てブログの方でも同じ現象に遭遇することになりました。「価格:¥1,980」とするところが「価格:\1,980」と表示されてしまったのです。
これを見た時に、さすがにこのままスルーするわけにはいかないと思い、今回の対処方法を検討することになりました。
 
 

「¥」が「\」に変換される理由

 
「¥」が「\」に変換される理由は、フォントの問題です。
 
「¥」は
日本語フォントでは「¥」ですが
欧文フォントでは「\」になります。
 
より詳細には
「¥」と「\」はどちらも unicode表記では同じ「U+005c」のコードを使用していて、日本語フォントでは「¥」を表示し、欧文フォントであれば「\」と表示するようになっているためです。
 
これは WordPressの問題なのではなく、HTMLの仕様上そうなっているのです。
 
 
では、なぜ、WordPressでこの「¥」が「\」に変換される問題が多発するのでしょうか?
 
その原因は、WordPressのテーマの cssに記述されているフォントの指定にあります。
 
 
このブログのテーマの場合、
 /{WordPress}/wp-content/themes/{テーマ}/style.css
の中の「font-family:」が記述されている箇所を見てみると、下記の様に記述してあります。
 
—————

—————
 
この内容は利用しているテーマによって全く違いますが、多くのテーマで「font-family:」の最初のフォントとして欧文フォントが指定してあるためにこの問題が発生しています。
(「font-family:」で指定してある先頭から順番に使えるフォントを利用していきます。そして、半角文字の「¥」には欧文フォントが割り当てられ、その他の日本語には日本語フォントが割り当てられていきます。)
 
WordPressが世界中で使われている CMSだからこそ起こる問題ともいえる現象でしょう。
自分で作ったテーマなど、最初から日本語で使うことを前提で作成し、日本語フォントを指定してあるテーマであればこういうことは起こらないことでしょう。
 
 
テーマの編集に関しては、「WordPressのテーマ管理方法とテーマのHTML編集のポイント解説」に記事を書いていますのであわせて参照してください。
 
 

対処方法1・文字参照による表記

 
この記事でも利用している方法ですが、文字参照による表記を利用する方法です。
文字参照(数値文字参照、文字実体参照)の解説は「数値文字参照コード変換ツール(HTML特殊文字コード変換ツール)」に記事を書いていますのでそちらを参照してください。
 
「¥」は「¥」「&#165」
「\」は「&#92」
とそれぞれ文字参照で記述することで希望する記号を編集することができます。
 
ちなみに「¥」は文字実体参照の表記で、「&#165」は数値文字参照による表記です。
「\」には文字実態参照の表記方法はなさそうです。
 
 
この方法のメリットは、「¥」を「¥」に置き換えるだけで確実に表示できるという点です。
 
逆にこの方法の問題点は、「¥」を編集するたびにその都度変換することが面倒である点です。
「¥」の文字参照はなんだったっけ?と毎回悩む場面も出てくるでしょう。
 
そんな場合はプラグイン「AddQuicktag」を使って WordPressのエディタに「¥」をあらかじめ登録しておく、という方法が有効でしょう。
「AddQuicktag」については「AddQuicktagを使って WordPressの投稿を楽にする」に記事を書いていますので、参照してください。
 
もしくは、IMEの辞書に「¥」を登録しておく方法もあるでしょう。
 
WordPressの投稿を複数の端末で行う可能性がある方は前者の方が便利だと思いますが、私の様に WordPressのエディタをあまり使っていない方は後者の方が便利でしょう。
 
 


 

対処方法2・フォントの lang属性を指定する

 
表示するフォントの言語(lang属性)を指定する方法です。
 
「¥」を表示したい場合
<span lang=”ja”>\</span>
 
\」を表示したい場合
<span lang=”en”>\</span>
<span style=”font-family: Arial;”>\</span>
 
ただし、これだけではブラウザの設定、テーマの設定によっては正しく表示されない場合がありますので、下記の設定を「style.css」に追記しておきましょう。(フォントの指定は、それぞれのテーマに記載してあるフォントを指定しましょう。)
 
—————

—————
 
「style.css」は先ほど記載しましたが下記になります。
 /{WordPress}/wp-content/themes/{テーマ}/style.css
 
追加する場所は、先に書いた「font-family」が指定してある行の下あたりに追加しておけばいいでしょう。
 
 
この方法のデメリットは、「style.css」に設定を追加する必要がある上に、入力する際も「spanタグ」で lang属性を指定する必要がある点です。
「対処方法その1」と比較してメリットが見いだせません。
 
強いてメリットを上げるとすれば、「¥」を和文フォントとして表示させますので、日本語の見慣れたフォントで表示させることが可能という点です。
 
20141106_wp_01
 
ただ、この点も「¥25,980」という表記の場合は、この点も数字は欧文フォントで表示されながら、「¥」だけ和文フォントで表示されるという状況になりますので、これをどうとらえるかによるでしょう。
 
 

対処方法3・そもそも欧文フォントを指定しない

 
この方法は対処療法ではなく、根本的な問題点を解決する方法です。
 
この問題が発生する原因が、欧文フォントが先に指定してあるために起こることであるため、そもそも欧文フォントを指定せず、日本語フォントだけを指定するという解決方法です。
 
個人的にも、「そもそも日本語の記事なので、全て日本語フォントで表示することに何か不都合があるのだろうか?」と思いますので、思い切って「style.css」に記述してある「font-family」の指定をすべて日本語フォントにしてしまうというこの方法が簡単なんじゃないかと思います。
 
最初に書いた「font-family」の記述を例にとると、欧文フォントの「arial, helvetica, 」部分を削除し、下記の様に設定することで、全て日本語フォントで表示されるようになります。(「osaka」は MacOSの標準日本語フォントです。)
 
—————

—————
 
この方法の最大のメリットは、一度設定するとそれ以降の変換作業が必要ない、という点です。
普通に「¥」を入力すれば「¥」が表示されるようになります。
 
ただ、この方法の最大のデメリットは、「\」の文字参照である「&#92」を入力しても「¥」が表示されてしまう点です。
なぜなら、ほとんどの日本語フォントには「\」が存在しないからです。
 
とはいえ、「\」を編集する必要があるブログを書く方は非常に限られているんじゃないかと思いますので、これが理由でこれを選択しない理由はほぼないでしょう。
今のところこのブログでも「\」を編集する必要はありませんでしたので。
 
また、「style.css」の編集などをしたことがない方は、心理的なハードルが高い作業であることは否めません。
 
 

WordPressで「¥」が「\」になる対応のまとめ

 
今回の記事の WordPressで「¥」が「\」に変換されることの対応としては、「¥」を使う頻度が多ければ 3番の対応も検討していいと思いますが、「¥」を使う機会もそれほど多くないんじゃないかと思いますので、1番の対処療法で問題ない場合がほとんどじゃないかと思います。
 
ちなみに、WordPressには他にも置き換わってしまう文字がありまして、そちらに関してはまとめ記事として「WordPressの記事編集で文字が自動変換される要注意な文字列」を、詳細な解説記事として「WordPressでダブルクォートなどの文字が自動変換?原因と対処方法」を記事にしていますのであわせて参考にしてください。
また、文字参照(数値文字参照、文字実体参照)の解説と、変換ツールに関しての説明は「数値文字参照コード変換ツール(HTML特殊文字コード変換ツール)」に記事を書いていますのでそちらを参照してください。

 - WordPress

GoogleAdwords

GoogleAdwords

最後までお読みいただきましてありがとうございます。
この記事が参考になったと思いましたらソーシャルメディアで共有していただけると嬉しいです!

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

下記の空欄を埋めてください。 * Time limit is exhausted. Please reload CAPTCHA.

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)

※入力いただいたコメントは管理者の承認後に掲載されます。

  関連記事

Rich ReviewsでWordPressに口コミサイトを簡単に構築する方法

口コミサイトに必要なレビュー投稿機能を提供するプラグインです。独自のフォームをショートコードで編集する自由度が高い設計で、平均点の表示も用意されています。

Captchaを使って WordPressのコメントスパム対策をする

コメントスパム対策として入力させない対策の一つとしてCAPTCHAという方法がありそれを簡単に実装できるプラグインCaptchaの解説です。

Custom Field Templateで簡単にカスタムフィールドをフル活用

カスタムフィールドを簡単に設定するプラグイン。簡単にカスタムフィールドが管理で来て作業効率が数倍にアップします!

BackWPupでバックアップ・機能の基本設定 Settings

BackWPupその5。バックアップ設定のベースになるBackWPup自体の設定解説です。

WordPressの functions.phpがある場所

WordPressのカスタマイズには大切な functions.phpですが、最初はその場所がどこなのか分かりませんのでその説明をしています。

MW WP Formの使い方詳細解説・WordPressの確認画面付フォーム

WordPressの確認画面付お問い合わせフォームプラグイン「MW WP Form」の詳細解説をしています。

seesaaからWordPressに引越。インストールなど必要な全てを解説

seesaaブログからWordPressへの引越し解説。他のブログにはないseesaaブログからcanonicalとリダイレクトの設定方法を実装!

Contact Form 7使い方詳細解説・WordPressメールフォーム

WordPressの標準お問い合わせメールフォームである Contact Form 7の詳細な使い方の解説です。

WP Mail SMTPはPHP5.6、7.0系ではメール送信時にエラーが発生。その対処方法。
WP Mail SMTPはPHP5.6、7.0系ではメール送信時にエラーが発生。その対処方法。

PHPのバージョンを5.6(7系含む)にアップデートしたらプラグイン WP Mail SMTPを利用してSMTPサーバ経由して送信していたメールが送信できなくなった。その原因と対処方法を詳細解説。

WordPress データベースを管理するための強い味方のプラグイン WP-DBMANAGER

データベースを管理するための強い見方のプラグイン「WP-DBMANAGER」の使い方の説明です。