初音メトロ

VOCALOID、IT、地下鉄/メトロなどに関する情報を収集しているサイト!

RSS フィード コメントの RSS フィード

テーマを変えました(ついにオリジナル・テーマが完成!)

昨晩に、こっそりと自作のテーマに変えました。今晩も少し改良を加えています。

このサイトを開設した当初から目標だったオリジナル・テーマ作成を実現することができました。

テーマを変えようと思った理由

  • IE8ではカスタムスタイルシートが反映されない
  • 重い
  • コメント欄がダサい
  • ところどころ英語のメッセージがある
  • IE6に対応していない

既存のテーマをカスタマイズすることも検討しましたが、一から自分で作ることにしました。

  • 他人のテーマの構造が分かりにくい
  • テーマ作成の勉強になる

テーマの特色

テーマ名は「Inside Theme 1」と言います。これからまたテーマを作るかも知れないということで1とついています。

コメント、ナビゲーション、ウィジェットなど、基本的な機能には対応しています。また、ビジュアル・エディタのスタイル適用にも対応しています。

IE6に対応するためXHTML1.0で作成しています。その割にはCSS3を使いまくっていますがw ブラウザによって見た目が違ってもそれほど問題がないと思ったので…。角丸、ドロップシャドウはおまけですw グラデーションはIE8でも効くようにしています(IE独自の実装)。※ただし表示は違う場合があります。

もちろん、IE9.js(IE8以下をIE9相当の表示にしてくれるスクリプト)とie7-squish.js(IE6のバグを修正)も入れました。

配布元は以下で。

ただし、全て再現されるわけではないようです。説明は以下のサイトを参照して下さい。

実際、IE10のIE7、IE8互換モード確認したところ、表示が崩れました。XP環境でインターネットがつながらなくなったので、IE6での確認もまだしていません…。現状はIE9以上か、Firefox、Chromeでご覧になることをお勧めします。

現在のところ表示は以下の環境で行っています。

  • Windows 7
    • IE10(IE7/8/9互換モードを含む)
    • Firefox最新版
    • Chrome最新版
  • iPhone (iOS7)
    • Safari(背景のグラデーションが途中で途切れることがあります。原因不明です…。表示上の問題だけなので、支障はないでしょう)

レスポンシブという最近はやりのデザインには対応していませんw 面倒くさいってことと、私はスマホでもPCと同じ表示で見るので、レスポンシブサイトはなくてもいいと思っているからです。

なお、このテーマの配布予定はありません。個人で使うテーマとして作ったからです。配布テーマとしてはまだまだ機能不足です。

テーマ制作のすすめ

WordPressを使っている方は、一からテーマを作成してみることをお勧めします。次のようなメリットがあるからです。

  • 自分の好きなデザインにできる
  • HTML、CSS、PHPの勉強になる
  • テーマの構造も分かる

私はエビスコム著「WordPress レッスンブック 3.x対応」を見ながらテーマを作りました。3年前と古い本ですが、今でも通用します。新しい本も読もうと思いますが、読んでいないので、分かりません…。ただし、この本では、HTMLやCSSの説明はしていないので、基礎知識は必要です。

今後もさらに改良したテーマを作っていきたいです。XPのサポートが終了したらIE6、IE7の対応はしないつもりです。現時点でもちゃんと表示されるかどうか怪しいし…。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です


BACK TO TOP