WordPressで中国語をちゃんと表示させる

WordPressで中国語を表示させるとフォントがごちゃまぜになってたので修正しました。
よっしーが運営しているAliグッズ放浪記というサイト、中国の通販サイトのAliExpressから購入した商品のレビューをメインにしているのですが、中国ということでちょくちょく中国語の表記をそのまま使っています。
しかしフォントが対応していないのか、ゴシック体と明朝体が混ざった表記によくなります。
例えば中国からの配送方法で、Cainiao Super Economy for Special Goodsというのがあり、これの中国語表記が菜鸟特货专线-超级经济。
スマホではちゃんと表示できるのですが、うちのWindows10のブラウザで見るとこんな感じで表示されます。


なんかむず痒い
というわけでググってみたところ中国語のWEBフォント – 思源宋体 | karakというサイトを発見。
こちらのサイトを参考にNoto Sans SCというWebフォントを導入。
ただうちの環境(Luxeritasテーマ)ではこのままではうまく表示されず、CSSのフォントファミリー指定に!importantを追記しました。
.cn {
font-family: 'Noto Sans SC',sans-serif!important;
}
これで無事、菜鸟特货专线-超级经济がちゃんと表示されるようになりました。


完璧
ちなみに、Windows10には標準で中国語のフォントが入っていて、ゴシック体はMicrosoft YaHei、

明朝体はSimSunというフォント名になっています。
