theme(テーマ)がサイトの外観を決める
WordPressで構築されたWebサイトの外観(と内容)を決める雛形を定めているのがthemeです。themeはサイトの内容や外観を定めたファイルから構成されています。WordPress自体の機能やplug-inという機能追加プログラムを組み合わせてバリエーションに富んだWebサイトの挙動や外観が実現できます。
最もシンプルなthemeはstyle.cssとindex.phpだけで動く
WebMatrixでファイルの作業領域を選択しwp-content>themesフォルダを開きます。themesフォルダの中にthemeがインストールされています。画面でtwentyeleveというフォルダとtwentytwelveというフォルダがありますが、この2つのthemeがインストールされているのです。
フォルダの中にはたくさんのファイルがありますが、themeが動くのに最低限必要なファイルはstyle.cssとindex.phpです。試しにkwaというフォルダを作ってその中にstyle.cssとindex.phpのファイルを作ってみます。
themeフォルダを選択した状態で「新規」アイコンをクリックしkwaフォルダを作成します。
kwaフォルダができたらその中でstyle.cssとindex.phpを作成します。
今度はWebブラウザからWordPressの管理画面のテーマを選んでください。利用可能なthemeとしてkwaが表示されています。WordPressがthemeとして認識したのです。
style.cssはthemeのスタイルシート
styleシートはそのthemeのスタイルシートです。Webの外観の設定ファイルです。
色々なところで無料のスタイルシートが配布されています。気に入ったスタイルシートを採用してWordPressのthemeに作り変えることができます。
index.phpはWebコンテンツを記載するファイル
index.phpにはWebで表示したいコンテンツをhtmlにしたがって記載します。またファイルの末尾が.phpとなっていることからもわかる様にphp言語によるプログラムを埋め込む事もできます。
phpによるプログラムを埋め込む事でWebページの表現や内容を状況に応じて変化させたりWeb閲覧者が入力したデーターをWebサーバーで取り込んだりバラエティーに富んだWebサイトが構築できます。
Hello World
試しにindex.phpファイルを編集して、kwaがどのように表示されるか試してみます。
WebMatrixのファイルの作業領域に戻ってindex.phpをダブルクリックして、Hello World
と入力し保存します。
次にWebブラウザに戻ってakwを有効化します。
最後にWebMatrixからサイトを表示させると、WebブラウザにHello Worldと表示されました。
次はスタイルシートファイルをカスタマイズしながらWebサイトの構築する手順をご紹介したいと思います。
[smartslider3 slider=5]