改訂版：FC2ブログで中国語を表示させるには
この前は「よーしこれでできた」と思った方法が実はWindows XPでは全然通じなくてがっかりでした。その後いろいろ調べて、ついに新たな秘術（そんな大そうなものでないが）を編み出しました。スタイルシートをいじることになりますが、その方法は２通りあります。
(1)「環境設定｣−「テンプレートの設定｣を選び、画面下の「スタイルシートの編集｣の窓から、
ここに以下のように2つのフォント名を挿入します。
記事を書いているときには一部の中国語が文字化けするかもしれませんが構わず保存してやれば、表示は化けないはずです。
この方法の表示見本は昨日の記事の[第２段落]をご覧ください。
(2) 上の方法の欠点は、
・日本語の部分のフォントまで変わってしまうこと。
・ごく一部の簡体字は美しくはないこと。
です。そこで、第２の方法です。
まずは「環境設定｣−「テンプレートの設定｣−「スタイルシートの編集｣の窓のいちばん末尾に行きます。その末尾に、次のような行を挿入します。
記事を書くときには中国語の部分は必ず<span lang="zh", class="zhcn">...</span>で囲むようにします。
(2)の方法は、中国語の部分をいちいちタグで囲む必要があって少し面倒です。でも見栄えは(1)よりも良いはずです。下は、(2)の方法で入力した中国語の表示見本です。
我越来越发现懂得的东西太少了。
なお、HeiというフォントはMacで中国語を表示できるようにするために指定していますが、私には確かめることができません。どなたか確認できましたらお知らせいただけると幸いです。
また、この秘法の開発にあたっては、「はてな」のページが参考になりました。質問者（私じゃないです)と回答者には感謝いたします。
(1)「環境設定｣−「テンプレートの設定｣を選び、画面下の「スタイルシートの編集｣の窓から、
font-family: "ヒラギノゴシック Pro W6",...となっている行を探します。"ヒラギノゴシック"は一つの例で、テンプレートにより違っていても構いません。また、"font-family"で始まる行は2箇所あると思いますが、最初の行だけを変更すれば良いはずです。
ここに以下のように2つのフォント名を挿入します。
font-family: "MS UI Gothic", "Hei", "ヒラギノゴシック Pro W6",...変更できたら「更新」のボタンを押します。これでOK。
記事を書いているときには一部の中国語が文字化けするかもしれませんが構わず保存してやれば、表示は化けないはずです。
この方法の表示見本は昨日の記事の[第２段落]をご覧ください。
(2) 上の方法の欠点は、
・日本語の部分のフォントまで変わってしまうこと。
・ごく一部の簡体字は美しくはないこと。
です。そこで、第２の方法です。
まずは「環境設定｣−「テンプレートの設定｣−「スタイルシートの編集｣の窓のいちばん末尾に行きます。その末尾に、次のような行を挿入します。
.zhcn{ font-family :SimSun, 'MS UI Gothic', Hei, sans-serif; }挿入したら｢更新｣のボタンを押します。
記事を書くときには中国語の部分は必ず<span lang="zh", class="zhcn">...</span>で囲むようにします。
(2)の方法は、中国語の部分をいちいちタグで囲む必要があって少し面倒です。でも見栄えは(1)よりも良いはずです。下は、(2)の方法で入力した中国語の表示見本です。
我越来越发现懂得的东西太少了。
なお、HeiというフォントはMacで中国語を表示できるようにするために指定していますが、私には確かめることができません。どなたか確認できましたらお知らせいただけると幸いです。
また、この秘法の開発にあたっては、「はてな」のページが参考になりました。質問者（私じゃないです)と回答者には感謝いたします。
中国語表示のためにスタイルシートをいじるテスト
[第１段落]
オリジナルの「パンダ」テンプレートで中国語をじかに入力するとこうなります。
我越来越发现懂得的东西太少了。
[wǒ yùeláiyùe fāxiàn dǒngde de dōngxi tàishǎole]
[第２段落]
ではスタイルシートをいじって、font-familyの先頭に"MS UI Gothic"を追加してみまししょう。
我越来越发现懂得的东西太少了。
[wǒ yùeláiyùe fāxiàn dǒngde de dōngxi tàishǎole]
[第３段落]
今度は、font-familyの先頭に"SimSun"を追加してみましょう。
我越来越发现懂得的东西太少了。
[wǒ yùeláiyùe fāxiàn dǒngde de dōngxi tàishǎole]
[第４段落]
最後に上のfont-familyのままで、中国語とピンインの部分は<span lang="zh">...</span>で囲ってみます。
我越来越发现懂得的东西太少了。
[wǒ yùeláiyùe fāxiàn dǒngde de dōngxi tàishǎole]
さて、Windows2000+IE6.0とWindows XP+IE6.0の環境でどう見えたかといえば、
[第１段落]では中国語の一部が文字化けして見えます。ピンインはきれいです。
[第２段落]では文字化けはしませんが、「小董」の字がややつぶれて見劣りします。また、日本語の部分もよく見ると[第１段落]とはフォントが異なっているのがわかります。どっちが見やすいかは意見がわかれるかもしれません。
[第３段落]ではWindows2000では文字化けしませんが、Windows XPでは[第１段落]とまったく同じで、一部が化けます。また、Windows2000では日本語の部分はダサダサです。ピンイン部分はちょっと見づらいと感じます。
[第４段落]ではWindows2000、XPとも中国語はいちばんきれいに表示されています。いっぽうで日本語部分はダサダサです。ピンインもちょっと見づらいです。
以下は少し技術的になりますが、何をやったかのメモです。
「パンダ」テンプレートのスタイルシートを見るとfont-familyは以下のようになっています。
font-family: "ヒラギノゴシック Pro W6", Osaka, "ＭＳ Ｐゴシック", "trebuchet MS", trebuchet, "verdana", arial, sans-serif;
そこでこのスタイルシートの最後に以下のような行を追加しました。
こうしておいてから、第２段落では１行ずつ<span class="MSUIG">...</span>で囲み、
第３段落は<span class="SimSun">...</span>で、
第４段落は<span lang="zh", class="SimSun">...</span>で囲んでみました。
オリジナルの「パンダ」テンプレートで中国語をじかに入力するとこうなります。
我越来越发现懂得的东西太少了。
[wǒ yùeláiyùe fāxiàn dǒngde de dōngxi tàishǎole]
[第２段落]
ではスタイルシートをいじって、font-familyの先頭に"MS UI Gothic"を追加してみまししょう。
我越来越发现懂得的东西太少了。
[wǒ yùeláiyùe fāxiàn dǒngde de dōngxi tàishǎole]
[第３段落]
今度は、font-familyの先頭に"SimSun"を追加してみましょう。
我越来越发现懂得的东西太少了。
[wǒ yùeláiyùe fāxiàn dǒngde de dōngxi tàishǎole]
[第４段落]
最後に上のfont-familyのままで、中国語とピンインの部分は<span lang="zh">...</span>で囲ってみます。
我越来越发现懂得的东西太少了。
[wǒ yùeláiyùe fāxiàn dǒngde de dōngxi tàishǎole]
さて、Windows2000+IE6.0とWindows XP+IE6.0の環境でどう見えたかといえば、
[第１段落]では中国語の一部が文字化けして見えます。ピンインはきれいです。
[第２段落]では文字化けはしませんが、「小董」の字がややつぶれて見劣りします。また、日本語の部分もよく見ると[第１段落]とはフォントが異なっているのがわかります。どっちが見やすいかは意見がわかれるかもしれません。
[第３段落]ではWindows2000では文字化けしませんが、Windows XPでは[第１段落]とまったく同じで、一部が化けます。また、Windows2000では日本語の部分はダサダサです。ピンイン部分はちょっと見づらいと感じます。
[第４段落]ではWindows2000、XPとも中国語はいちばんきれいに表示されています。いっぽうで日本語部分はダサダサです。ピンインもちょっと見づらいです。
以下は少し技術的になりますが、何をやったかのメモです。
「パンダ」テンプレートのスタイルシートを見るとfont-familyは以下のようになっています。
font-family: "ヒラギノゴシック Pro W6", Osaka, "ＭＳ Ｐゴシック", "trebuchet MS", trebuchet, "verdana", arial, sans-serif;
そこでこのスタイルシートの最後に以下のような行を追加しました。
.MSUIG {
font-family: "MS UI Gothic", "ヒラギノゴシック Pro W6", Osaka, "ＭＳ Ｐゴシック", "trebuchet MS", trebuchet, "verdana", arial, sans-serif;
}
.SimSun {
font-family: "SimSun", "ヒラギノゴシック Pro W6", Osaka, "ＭＳ Ｐゴシック", "trebuchet MS", trebuchet, "verdana", arial, sans-serif;
}
こうしておいてから、第２段落では１行ずつ<span class="MSUIG">...</span>で囲み、
第３段落は<span class="SimSun">...</span>で、
第４段落は<span lang="zh", class="SimSun">...</span>で囲んでみました。
中国語入力・表示の再々テスト
前回の謎はtableを使ったせいかもしれません。というわけでtableをやめてみました。
<font face="Arial"> 怎么样 ○×
<font face="Arial Unicode MS"> 怎么样 ○○
<font face="Serif"> 怎么样 ×△
<font face="sans-serif"> 怎么样 ○×
<font face="Lucida Sans Unicode"> 怎么样 ○×
<font face="MS UI Gothic"> 怎么样 ○○
<font face="SimHei"> 怎么样 ○○
<font face="SimSun"> 怎么样 ○×
<span lang="zh"> 怎么样 ××
<span style="font-family:Arial"> 怎么样 ○×
<span style="font-family:'Arial Unicode MS'"> 怎么样 ○○
<span style="font-family:Serif"> 怎么样 ×△
<span style="font-family:sans-serif"> 怎么样 ○×
<span style="font-family:'Lucida Sans Unicode'"> 怎么样 ○×
<span style="font-family:'MS UI Gothic'"> 怎么样 ○○
<span style="font-family:SimHei"> 怎么样 ○○
<span style="font-family:SimSun"> 怎么样 ○×
<span lang="zh", style="font-family:SimSun"> 怎么样 ○○
○が２つ並んだもののうち、見映えがいいのは<span style="font-family:'MS UI Gothic'">ですね。
でも<span lang="zh", style="font-family:SimSun">も使えることは新たな可能性を感じます。
というわけで、以下の中国語が化けていればまたコメントください。
<span style="font-family:'MS UI Gothic'"> 我越来越发现自己懂得的东西太少了。
<span lang="zh", style="font-family:SimSun"> 我越来越发现自己懂得的东西太少了。
私の環境では両者はほとんど同じですが「小董」の文字だけ後者が良く見えます。
<font face="Arial"> 怎么样 ○×
<font face="Arial Unicode MS"> 怎么样 ○○
<font face="Serif"> 怎么样 ×△
<font face="sans-serif"> 怎么样 ○×
<font face="Lucida Sans Unicode"> 怎么样 ○×
<font face="MS UI Gothic"> 怎么样 ○○
<font face="SimHei"> 怎么样 ○○
<font face="SimSun"> 怎么样 ○×
<span lang="zh"> 怎么样 ××
<span style="font-family:Arial"> 怎么样 ○×
<span style="font-family:'Arial Unicode MS'"> 怎么样 ○○
<span style="font-family:Serif"> 怎么样 ×△
<span style="font-family:sans-serif"> 怎么样 ○×
<span style="font-family:'Lucida Sans Unicode'"> 怎么样 ○×
<span style="font-family:'MS UI Gothic'"> 怎么样 ○○
<span style="font-family:SimHei"> 怎么样 ○○
<span style="font-family:SimSun"> 怎么样 ○×
<span lang="zh", style="font-family:SimSun"> 怎么样 ○○
○が２つ並んだもののうち、見映えがいいのは<span style="font-family:'MS UI Gothic'">ですね。
でも<span lang="zh", style="font-family:SimSun">も使えることは新たな可能性を感じます。
というわけで、以下の中国語が化けていればまたコメントください。
<span style="font-family:'MS UI Gothic'"> 我越来越发现自己懂得的东西太少了。
<span lang="zh", style="font-family:SimSun"> 我越来越发现自己懂得的东西太少了。
私の環境では両者はほとんど同じですが「小董」の文字だけ後者が良く見えます。
中国語入力・表示の再テスト
前回のテストはWindows XP + IE6.0 の環境では全滅でした。
なもんで今日は新しいアイディアをひっさげての再挑戦です。
注：
*1 Office2000 CDから追加インストールが必要。詳細はたとえばこちら。
*2 文字は化けませんが、文字と文字がかぶって表示されます。
あれ？Windows XPでもほぼ正常に表示されますね。どうして昨日のテストと違うのでしょう？1歩前進、しかし謎もまた1つ増えました。
なもんで今日は新しいアイディアをひっさげての再挑戦です。
| タグ | 見本 | W2KIE6 | WXPIE6 |
|---|---|---|---|
| <font face="Arial"> | 怎么样 | ○ | ○ |
| <font face="Arial Unicode MS"> | 怎么样 | ○*1 | ○ |
| <font face="Serif"> | 怎么样 | × | △*2 |
| <font face="sans-serif"> | 怎么样 | ○ | ○ |
| <font face="Lucida Sans Unicode"> | 怎么样 | ○ | ○ |
| <font face="MS UI Gothic"> | 怎么样 | ○ | ○ |
| <font face="SimHei"> | 怎么样 | ○ | ○ |
| <font face="SimSun"> | 怎么样 | ○ | ○ |
| <span lang="zh"> | 怎么样 | × | × |
| <span style="font-family:Arial"> | 怎么样 | ○ | ○ |
| <span style="font-family:'Arial Unicode MS'"> | 怎么样 | ○*1 | ○ |
| <span style="font-family:Serif"> | 怎么样 | × | △*2 |
| <span style="font-family:sans-serif"> | 怎么样 | ○ | ○ |
| <span style="font-family:'Lucida Sans Unicode'"> | 怎么样 | ○ | ○ |
| <span style="font-family:'MS UI Gothic'"> | 怎么样 | ○ | ○ |
| <span style="font-family:SimHei"> | 怎么样 | ○ | ○ |
| <span style="font-family:SimSun"> | 怎么样 | ○ | ○ |
| <span lang="zh", style="font-family:SimSun"> | 怎么样 | ○ | ○ |
*1 Office2000 CDから追加インストールが必要。詳細はたとえばこちら。
*2 文字は化けませんが、文字と文字がかぶって表示されます。
あれ？Windows XPでもほぼ正常に表示されますね。どうして昨日のテストと違うのでしょう？1歩前進、しかし謎もまた1つ増えました。
FC2ブログで中国語を表示させるには
ちょっと試してみたところ、FC2ブログでの中国語の表示については、２とおりの方法があるようです。
(1) 下の記事のように、中国語の部分を<font face="Arial">...</font>タグで囲む。
編集画面では一部の漢字が「・」に化けるかもしれませんが、構わず保存してやれば、表示は正常にできるようです。
または、
(2) タグ囲みしなくても中国語を表示できるテンプレートを使う。
ココログと同じで、テンプレートによって、素直に中国語を表示できたりできなかったりするようです。試した限りでは、「skin07」テンプレートではタグ囲みなしでも正常に中国語を表示してくれましたが、「panda」テンプレートではタグ囲みしないとダメでした。
上記(1)の方法で中国語を書いてみます。
用汉语这个怎么说？
もし上の文章中に文字化けが見える方がいらっしゃったら、ぜひコメントでお知らせください。ついでに、OSやブラウザの種類、それからたとえばYahoo!中国などは正常に見えているかなどもお知らせいただければ幸いです。
(1) 下の記事のように、中国語の部分を<font face="Arial">...</font>タグで囲む。
編集画面では一部の漢字が「・」に化けるかもしれませんが、構わず保存してやれば、表示は正常にできるようです。
または、
(2) タグ囲みしなくても中国語を表示できるテンプレートを使う。
ココログと同じで、テンプレートによって、素直に中国語を表示できたりできなかったりするようです。試した限りでは、「skin07」テンプレートではタグ囲みなしでも正常に中国語を表示してくれましたが、「panda」テンプレートではタグ囲みしないとダメでした。
上記(1)の方法で中国語を書いてみます。
用汉语这个怎么说？
もし上の文章中に文字化けが見える方がいらっしゃったら、ぜひコメントでお知らせください。ついでに、OSやブラウザの種類、それからたとえばYahoo!中国などは正常に見えているかなどもお知らせいただければ幸いです。
