WordPress3.3のデフォルトテーマの構成を理解する

この記事が良ければ、ぜひシェアお願いします

WordPress3.x~デフォルトのテーマは『TwentyTen』でしたが、WordPress3.3からデフォルトのテーマは『TwentyEleven』に変わっています。(『TwentyTen』も同梱)意気込みとしては、”最新を攻める!”なので、『TwentyEleven』をベースに話を進めていきたいと思います。

インストールしてすぐの画面なので、みなさんご存知かと思いますが、このような画面が表示されていると思います。(ただし、TOPにある写真はいくつかランダムで表示されますので、その点は異なるかもしれません。)




『TwentyEleven』のファイル構成を知る

themeフォルダに入っているファイルはどのようなものなのか、lsを取った結果を表に纏めてみました。

TwentyEleven template
Path FileName
twentyeleven index.php
twentyeleven 404.php
twentyeleven archive.php
twentyeleven author.php
twentyeleven category.php
twentyeleven comments.php
twentyeleven content-aside.php
twentyeleven content-featured.php
twentyeleven content-gallery.php
twentyeleven content-image.php
twentyeleven content-intro.php
twentyeleven content-link.php
twentyeleven content-page.php
twentyeleven content-quote.php
twentyeleven content-single.php
twentyeleven content-status.php
twentyeleven content.php
twentyeleven editor-style-rtl.css
twentyeleven editor-style.css
twentyeleven footer.php
twentyeleven functions.php
twentyeleven header.php
twentyeleven image.php
twentyeleven license.txt
twentyeleven page.php
twentyeleven readme.txt
twentyeleven rtl.css
twentyeleven screenshot.png
twentyeleven search.php
twentyeleven searchform.php
twentyeleven showcase.php
twentyeleven sidebar-footer.php
twentyeleven sidebar-page.php
twentyeleven sidebar.php
twentyeleven single.php
twentyeleven style.css
twentyeleven tag.php
twentyelevencolors dark.css
twentyelevenimages comment-arrow-bypostauthor-dark-rtl.png
twentyelevenimages comment-arrow-bypostauthor-dark.png
twentyelevenimages comment-arrow-bypostauthor-rtl.png
twentyelevenimages comment-arrow-bypostauthor.png
twentyelevenimages comment-arrow-dark-rtl.png
twentyelevenimages comment-arrow-dark.png
twentyelevenimages comment-arrow-rtl.png
twentyelevenimages icomment-arrow.png
twentyelevenimages comment-bubble-dark-rtl.png
twentyelevenimages comment-bubble-dark.png
twentyelevenimages comment-bubble-rtl.png
twentyelevenimages comment-bubble.png
twentyelevenimages search.png
twentyelevenimages wordpress.png
twentyelevenimagesheaders chessboard-thumbnail.jpg
twentyelevenimagesheaders chessboard.jpg
twentyelevenimagesheaders hanoi-thumbnail.jpg
twentyelevenimagesheaders hanoi.jpg
twentyelevenimagesheaders lanterns-thumbnail.jpg
twentyelevenimagesheaders lanterns.jpg
twentyelevenimagesheaders pine-cone-thumbnail.jpg
twentyelevenimagesheaders pine-cone.jpg
twentyelevenimagesheaders shore-thumbnail.jpg
twentyelevenimagesheaders shore.jpg
twentyelevenimagesheaders trolley-thumbnail.jpg
twentyelevenimagesheaders trolley.jpg
twentyelevenimagesheaders wheel-thumbnail.jpg
twentyelevenimagesheaders wheel.jpg
twentyelevenimagesheaders willow-thumbnail.jpg
twentyelevenimagesheaders willow.jpg
twentyeleveninc theme-options.css
twentyeleveninc theme-options.js
twentyeleveninc theme-options.php
twentyeleveninc widgets.php
twentyelevenincimages content-sidebar.png
twentyelevenincimages content.png
twentyelevenincimages dark.png
twentyelevenincimages light.png
twentyelevenincimages sidebar-content.png
twentyelevenjs html5.js
twentyelevenjs .js
twentyelevenlanguages ja.mo
twentyelevenlanguages ja.po
twentyelevenlanguages twentyeleven.pot



テンプレート構成に注目してみる

テーマ『TwentyEleven』には色々なファイルが入っていますが、テーマ作成/カスタマイズする際に着目するのは”.php”ファイルです。『TwentyEleven』では、基本的なファイルはテーマディレクトリ直下にあり、一部独自に作られているテンプレートファイルは別のディレクトリに格納されているのが分かります。

テンプレートを役割ごとに分けたものが下記のイメージになります。




数としては、そんなに多くはないですよね?もっと数を減らすことはできますので、最もシンプルなブログサイトを目指すことも可能です。このテンプレート構成を念頭に話を進めていきたいと思います。

 

スポンサーリンク

この記事が良ければ、ぜひシェアお願いします

もぐ
年齢 : 30代半ばの1児の新米パパ。ITネットワークから始まり、WEBディレクター、WEBシステム系のプロマネ、データ分析など色々やってるエンジニアです。WordPress、Webサービス構築、BIツール、IoTなどがトレンド。新しくて面白い仕事募集中。
スポンサーリンク