先日、「【JINカスタマイズ】プロフィールにボタンをつける」という記事を書きました。
試してくれた人がいてウハウハ喜んでたところ、こんなツイートが。
なぬー!なんで??
ということで今回は、トラブル発生と解決のお話です。
備忘録として解決方法も書いてますが、必要ない方は華麗にスルーでお願いします。
半角をコピペすると全角に変換される問題
原因を探るため、キングボンビー似のショッティさんのブログを確認します。
HTMLの記載に誤りがあったんです。
誤:<div class="”profile_link”">
ダブルクォーテーションが全角と半角2つある
正:<div class="profile_link">
ダブルクォーテーションが1つ
ダブルクォーテーションが重複してたので、原因はすぐ判明。HTMLやCSSは1文字でもミスがあったら正常に動いてくれないんですよね。
最初は入力ミスだと思ってたんですが・・・解決しませんでした。
コピペしたのにダブルクォーテーションが重複するってどいうこと?
しかも、ダブルクォーテーションのひとつは勝手に全角に変換されてるし。問題が2つに増えとるぞ。
原因はWordPress
まずは全角に変換される問題から。原因はなんと、WordPress!
犯人は意外と近くにいるんですよね。調べたらすぐに分かりました。 知識不足でごめんちゃい。
WordPressには、入力された文字列を自動に変換する機能が実装されています。
自動変換される理由はいくつかありますが、ダブルクォーテーションの場合、見やすくするためだと考えられます。開発者の親切心ですね。
普通の記事ならありがたい自動変換ですが、コードを書くときは困っちゃう。
読者さんに「コピペしても使えないじゃん。何このブログ。」と思われたらマズイので、なにか手を打たねばなりませぬ。
対応 ⇒ ボタン設置完了のご報告
またまた調べたら、またまたあっさり分かりました。自動変換を防ぐ方法が。
早速ブログを修正。
よかったよー。ショッテイさん、ボタン設置完了。
できたツイートがあるまで、ヒヤヒヤして待ってました。正直、ブログ書いたときより頭使いましたね。緊張から開放されて眠くなっちゃいましたから。
WordPressやブログについては毎日新しい技術が生まれてるし、知らないことが山程あります。日々勉強ですね。
WordPressブログのコピペで全角変換を防ぐ方法
実際に行った対策を記載しておきます。不要な場合は読み飛ばしてくださいませ。
コード
remove_filter('the_content', 'wptexturize');
remove_filter('the_excerpt', 'wptexturize');
remove_filter('the_title', 'wptexturize');
追加場所
「外観」⇒「テーマエディター」⇒「テーマのための関数(functions.php)」
コード内の3行をコピペするだけです。
FTPソフトも必要ないので簡単でした。
HTMLやCSSなどブログ内でコードを紹介する場合は、自動変換を防ぐ方法をやっておいてくださいね。
ダブルクォーテーション重複の原因は謎
全角への自動変換は原因と解決方法が分かりました。でも、ダブルクォーテーションの重複は原因が判明せず。
メモ帳やEvernoteを使ったり、Macの言語設定などでも自動変換されるようです。
でも、自分でコピペを試しても再現しないし、重複については分かりませんでした。
後日改めて調べる予定です。
もし、コピペでダブルクォーテーションが重複する原因を知ってる方がいましたら、お手数ですがご連絡をお願いします。
失敗しながら成長していく
今回は、自動変換問題と一応解決するまでのお話でした。
- WordPressブログでは、特定の記号をコピペすると全角に自動変換される仕様になってる。
- 自動変換を回避する方法がある。
- 問題解決すると喜んでもらえる。
こちらの知識不足で手間と時間をかけてしまいましたが、最後にはありがとうと言ってもらえました。嬉しいですね。
問題が発生しても、解決方法を見つけて発信していけば成長することを実感しました。
過去の失敗談は「WordPressで複数ブログを運営するコツと方法は?」という記事でも書いてるので、よかったらよんでみてくださいね。
ではでは。