home ＞ Movable Type ＞ 画面が白くなる場合（文字化け）

« コードを整形するプラグイン（MTPrecode） | Movable Type4.15 beta2 »

画面が白くなる場合（文字化け）

2008 05 ／ 13

現在このブログは「Movable Type4.15 beta１」で運営してます（早くfinalでないかな）。

見た目もデフォルトのままで何も変更していないのにFireFoxではブログの表示がされるのに、IEでは真っ白い画面で表示されていました。

原因は文字コードで正しく文字コードが選択されないため画面が真っ白になってしまったようです。IEのツールバー「表示→エンコード→日本語(シフトJIS)」にチェックがついてました。ここで「Unicode（UTF-8）」を選択すると無事表示されました。

文字化けしないように文字コードの設定meta要素を使って指定します。そしてこの文字コードを指定するmeta要素はどうやらtitleタグの前に指定しなければいけないものらしいのです。そのため正しくブラウザで文字コードが選択されないことがあるようです。今まで意識せずheadタグの下に記載してましたが・・・。

Movable Type4.15 beta１では「HTMLヘッダーモジュール」の一番最初にこのmeta要素が記載されているのですが、titleタグは「HTMLヘッダーモジュール」の前に記載されているのです。そのためIEでは画面が真っ白になってしまったようです。

meta要素をメインテンプレートや各アーカイブテンプレートのtitleタグの前に持ってくるか、逆にtitleをHTMLヘッダーのmeta要素の後に持ってくるか(そうすると条件分岐必要だけど)する必要があります。

私はいづれ独自テンプレートにする予定なので楽なほう（titleタグの前にmeta要素移動）を選びました。

修正箇所

１．HTMLヘッダーからmeta要素を削除

<meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />

２．以下のテンプレートの<head>タグと<title>タグの間にｍｅｔａ要素を追加

  • メインページ
  • アーカイブページ
  • ウェブページ
  • カテゴリ別ブログ記事リスト
  • ブログ記事
  • 月別ブログ記事リスト

必要ないかもしれないけど修正部分のソースを記載しておきます。

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
    <title><$MTBlogName encode_html="1"$></title>
<$mt:include module="HTMLヘッダー"$>
 <head>
    <meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
    <title><$MTBlogName encode_html="1"$>: アーカイブ</title>
    <$mt:include module="HTMLヘッダー"$>
 <head>
    <meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
    <title><$MTPageTitle encode_html="1"$> - <$MTBlogName encode_html="1"$></title>
    <$mt:include module="HTMLヘッダー"$>
 <head>
    <meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
    <title><$MTBlogName encode_html="1"$>: <$MTArchiveTitle$>アーカイブ</title>
    <$mt:include module="HTMLヘッダー"$>
 <head>
    <meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
    <title><$MTEntryTitle encode_html="1"$> - <$MTBlogName encode_html="1"$></title>
    <$mt:include module="HTMLヘッダー"$>
 <head>
    <meta http-equiv="Content-Type" content="text/html; charset=<$MTPublishCharset$>" />
    <title><$MTBlogName encode_html="1"$>: <$MTArchiveTitle$>アーカイブ</title>
    <$mt:include module="HTMLヘッダー"$>

Category: Movable Type

Tag: トラブル

この記事のURL

トラックバックURL

この記事へコメントする

お気軽にコメントしてください。

記事に関係ないと判断したコメント、間違って2重投稿になったコメントなどについてはかってに削除させていただきます。