WordPressのテーマについて 初めて編

WordPressのテーマについて 初めて編

こんにちは、ちゃんけいです。

先日だらだらとリニューアルしたい!と言ってから早速新しいロゴマークを作っています。

さて、今回はテーマの構造の1歩目だけを紹介したいと思います。

本当に1歩目だけです。

WordPressのテーマはこれがあれば動く!

まずは、テーマフォルダの直下にこのファイルがあればWordPressのテーマとして認識されます。

  • index.php
  • style.css

この2つのファイルがあればWordPressの管理画面から選ぶことができます。
ちなみに、style.cssの中身は空で大丈夫です。本来ならテーマのバージョンだったり、テーマ名だったりを書くのがこのstyle.cssになります。

index.phpは色々なところのベースになります。あれ?なにそれ?という方はとりあえずスルーしましょう。

え?index.phpがトップページじゃないの?

上の画像を見ると、index.phpに描かれている内容とこのサイトのトップページの内容が違うじゃん!と感じる方がいると思います。

実はWordPressを使う際には、テンプレート階層という言葉が存在します。

簡単にいうと、ファイル名に応じて表示される優先度が存在します。

「トップページのときは、OOO.php。カテゴリー一覧の時は、XXX.phpを使ってXXX.phpがない時は@@@.phpを使うよ!」

詳しくは、テンプレート階層についての説明←このサイトの概念以降を読んでみてください。

どのページで、何て名前のphpファイルが優先されるかが書いてあります。

ではこのサイトでは何がトップページに表示されているのでしょうか?

答えは、「front-page.php」です。やり方は、固定ページをトップページにする方法があるのでそちらをググって見てください。

これでindex.phpの中身がほとんどない謎が解けましたね!

htmlを切り分け出してからがWordPress

CMSの利点といえば、更新システムもそうですが表示部分のHTMLを使い回すことができることにあると思います。

このサイトだと、ヘッダー、フッターはどのページも見た目や挙動が同じになっています。なのでその範囲を

  • header.php
  • footer.php

と別ファイル化してしまいます!これでどのページもこれを読み込むだけで同じ表示ができるようになります。

  • header.phpの終わりに<?php wp_head(); ?>
  • footer.phpの</body>要素の直前に<?php wp_footer(); ?>

上のふたつをお忘れなく!

ヘッダーと、フッターを呼び出す時は

index.phpの画像にかいてある。「get_~」になります。

まとめ

テーマの最低限の説明でした。

ここをまずできることから始まるので、ないがしろにせずしっかりと理解しておきたいですね。

特に今回はさらっと流した、front-page.phpの仕方やどうしてなるのかはしっかりと調べてみてください。これに関しては今度記事に書こうと思っています。

ささっ今回はきりが良いのでこの辺で、ちゃんけいでした。