WordPressで Expected COLON at… のエラーが出てテーマを保存できないときの対処法
WordPressで Expected COLON at… のエラーがでる… 全角は入っていないんだよ。どうすればいい？ と悩んでませんか？
僕もめっちゃ悩みました。
こんにちわ、きみひこです。
WordPressのテーマを編集してたら、赤い【にょろ】のエラーが出て、なぜか保存できなくなった…、そこそこよくあります。
とりあえず、このエラーが出たときの回避方法は分かったので、メモとして残しておきます！
それではいってみましょう！
WordPressで Expected COLON at… のエラーがでる原因
英語で「Expected COLON at line 2023,col 4」とエラーが出ています。これが手掛かりですね。
訳すと「2023行目の4列目にコロンが入るべきでは？」という意味ですかね。
で確認したんですが、コロンは正常に入っているように見える。周辺のコードも、一見問題なさそうなんです。
自分では分からないので、ググってみました。
同じ悩みは出て来たんですけど、「全角スペースが入ってました！解決！（てへぺろ）」というものばかりが出てきます。
でも自分のソースを見たところ、全角スペースは入って無いんですね。
で悩んでしまったんですけど、とりあえず解決する方法は分かりましたので書いておきます。
WordPressで Expected COLON at… のエラーの対処方法
赤丸×印で指摘されている行の、コードを書いている前の部分をすべて削除してください。
そうするとこのエラーは解消されますよ。
WordPressで Expected COLON at… のエラーの根本的な原因は？
ではこのエラーの原因って、結局は何だったのか？
残念ながら特定できてません。
とはいえ、外部のCSS検証サービスを使ってこのCSS全体を調査したところ、今回の箇所とは全く別のところでいくつかエラーがありました。
それらが原因となり今回のエラーが出ていないとは言い切れないのかなと思います。
参考までに今回出現したエラーの具体的な内容をあげておきますね。
- CSS内に謎の文字が入り込んでいる。
- 全角空白が入っている箇所が実はあった。
ひとつひとつもう少し具体的に書きますね。
CSS内に謎の文字が入り込んでいる。
分かりやすいよう秀丸エディタにコードを持ってきて見ているのですが、非常に小さいので分かりづらくて恐縮なのですが、、このaタグの前の部分。
何もない半角スペースのようなものが入っていますよね。
この部分がCSSバリデートでひっかかってます。
なんなのかは不明ですが、ハンスペではない何かが入っている模様。
全角空白が入っている箇所が実はあった。
今回の行とは全く別の行で、CSSエラーとなり得る全角空白が入ってしまっている箇所がありました。
ただ、前述のとおり、ググったときに見た情報では「全角エラーが原因でこのエラーが出てました！」ということだったんですね。
ただ僕のケースだと、全角スペースが入ってCSSチェックでエラーになるものの、WordPress上ではエラーは出ていない、ということになるんですけども。
全角スペースの入り方にもよるのかな？
とはいえCSSチェッカーではエラーが出ているので削除しておきました。
エラーの具体的な内容は以上です。
完全な解決には至っていないのが心苦しいのですが、同様に困っている人の参考になればと思い、メモとして残します。