レスポンシブwebデザインなWordPressのテーマを自作してみた

最近、スマホからのアクセスも増えているし、いいかげんレスポンシブwebデザインに対応しておかないとまずいよな〜と思ったので、ブログのテーマをレスポンシブwebデザインなテーマに変更してみました。今さらですが。

最初は、出来合いのテーマでよさげなのを探そうと思っていたのですが、気が付いたら自作していました。どうも、プログラマの悪癖である「車輪の再発明」が出てしまったようです。

運営しているちゃんねるレビューとかは、一応スマホ対応はしてるのですが、レスポンシブwebデザインではありません。なので、今回ブログをレスポンシブwebデザインに対応させたことで、レスポンシブなCSSの勉強になってよかったかなと思います。

WordPressも最初にインストールしたまま、たいしていじりもせず使っていたのですが、いろいろいじくると面白いですね。プログラマな人はテーマの自作に挑戦してみるといいと思いますよ。

ちなみに、今回テーマの自作で参考にしたのは次のページです。

PHPが分かる人ならチュートリアルな記事でファイルの構造を理解して、後は、テンプレートタグの使い方さえ分かればWordPressはだいたい理解できそうです。

基本的にはindex.htmlとstyle.cssの2つのファイルだけを最初に作るところからはじめるといいと思います。最初に最小単位を作って、レスポンシブなデザインを決めて、各パーツ毎にファイルを分割します。テンプレートタグの入れ込みについては、上記のテンプレートタグの説明を読みつつ、WordPressにデフォルトで付いるテーマのファイルを参考にしながら入れ込むと分かりやすいかと思います。

まぁ、今さらながらの記事ですが、自分のブログの対応は、後手後手に回っている人が多いようなので、一度見直してみるといいかもしれないですね。

Twitterでも情報配信中!




コメントを残す

メールアドレスが公開されることはありません。



次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

※コメントは承認制です。承認されるまで表示されません。