Upload
-
View
663
Download
0
Embed Size (px)
DESCRIPTION
PHP講座
Citation preview
PHP講座(11)!WordPressカスタマイズ(テーマ編)
この授業ではWordPressのテーマカスタマイズについて説明します。 WordPressのテンプレートシステムを理解し、カスタマイズしましょう
WordPressのテーマシステム
10.4.18 (C) 株式会社破滅派
2
WordPressは「テーマ」によって外観を変更できるというシステムを持っています。
通常のWebサイトはほとんど文章+画像からなるコンテンツで構成されているので、テーマをカスタマイズするだけでほとんど事足ります。
WordPressはテーマをどうやって認識しているか
10.4.18 (C) 株式会社破滅派
3
ルートディレクトリ wp-‐admin
wp-‐content
wp-‐include
uploads
themes
plugins
管理画面用のファイル
コア関数ファイル
ユーザーがコンテンツを追加するフォルダ
管理画面用のファイル
プラグイン用フォルダ
テーマ用フォルダ
WordPressのテーマに最低限必要なもの
10.4.18 (C) 株式会社破滅派
4
テーマフォルダ index.php
style.css
style.cssには必ず決まった書式でテーマの情報を書きます。
/* Theme Name: テーマ名 Theme URI: URL Description: 解説 Author: 作者名 Version: */
オリジナルテーマTwenty Tenのファイル構成を見てみよう!
オリジナルテーマを作ってみる前に…
10.4.18 (C) 株式会社破滅派
5
1. まずはダミーデータを入れる http://svn.automattic.com/wpcom-‐themes/demo/test-‐data.2010-‐08-‐02.xml
2. オリジナルテーマをインストール
3. レッツカスタマイズ
テーマを作ってみてどうでしたか?
10.4.18 (C) 株式会社破滅派
6
ハァ? 画面真っ白なんですけど
つまんねオワタ \(^o^)/
テーマを作る必須の知識を一応学びましょう
必須の知識(1)テンプレート階層
10.4.18 (C) 株式会社破滅派
7
1. WordPressはURLを解析して、どのコンテンツを求められているのかを判断します
2. 指定されたコンテンツに対応するテーマファイルがあるかどうかを探します。
3. そのファイルを使って投稿を表示します。 http://wpdocs.sourceforge.jp/%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC
%E3%83%BC%E3%83%88%E9%9A%8E%E5%B1%A4
ex.単一の投稿ページを表示した場合
1. single.phpを探す
2. なければindex.php
必須の知識(2)インクルードタグ&条件分岐タグ
10.4.18 (C) 株式会社破滅派
8
インクルードタグ
<?php get_header(); ?>でこれだけ読み込み
条件分岐タグ http://wpdocs.sourceforge.jp/%E3%82%A4%E3%83%B3%E3%82%AF%E3%83%AB%E3%83%BC%E3%83%89%E3%82%BF%E3%82%B0
http://wpdocs.sourceforge.jp/Conditional_Tags
<?php if(is_single()): ?>
<div id=“single”>
これは投稿ページです。
</div>
<?php endif; ?>
ここはシングルページだけで表示される。
必須の知識(3)テンプレートタグ
10.4.18 (C) 株式会社破滅派
9
ちなみに、WordPressの「タグ」ってなんでしょう?
ただのPHP関数です。
WordPressは「PHP関数」という言葉で初心者が怯えるのを防ぐために、「タグ」という呼び方をしています。 テンプレートタグはテーマを作成するときに役立つPHP関数です。
<?php the_title(); //タイトルを出力 the_content(); //本文を出力 bloginfo(‘name’); //ブログ名を出力 ?>
必須の知識(4)ループ
10.4.18 (C) 株式会社破滅派
10
<?php if(have_posts()): while(have_posts()): the_post(); ?>
ここに投稿が出力される
<?php endwhile; endif; ?>
WordPressにも「おまじない」があります。
1. WordPressはURLを解析して、リライトルールを作成します。
2. リライトルールに基づき、必要なデータをDBから取ってきます。
3. DBから取ってきたデータを使いやすい型に直し、グローバル変数である$postsオブジェクトに格納します。
4. the_post()を呼び出すたび、$postsから$postにデータを移動させます。
5. the_title()などは$postを常に参照します。
ループについて
10.4.18 (C) 株式会社破滅派
11
グローバルとか意味わかんね
ムズ過ぎオワタ \(^o^)/
あきらめずにWordPressの構成を見てみましょう! var_dump($GLOBALS); でWordPressのグローバル変数を取得できます。
やってみよう! トップページのカスタマイズ
10.4.18 (C) 株式会社破滅派
12
1. トップページを固定ページに変更する
2. home.phpを作ってカスタマイズ
3. 簡単なリードと最新投稿の一覧(全文ではなく、抜粋)を入れる
4. カテゴリごとに最新のコンテンツ5件を取得する
5. ウィジェットもサポート!
header
right column
footer
リードリードリードリードリードリードリードリードリードリード
カテゴリー名 1. コンテンツのタイトル 2. コンテンツのタイトル 3. コンテンツのタイトル 4. コンテンツのタイトル 5. コンテンツのタイトル
カテゴリー名 1. コンテンツのタイトル 2. コンテンツのタイトル 3. コンテンツのタイトル 4. コンテンツのタイトル 5. コンテンツのタイトル
カテゴリー名 1. コンテンツのタイトル 2. コンテンツのタイトル 3. コンテンツのタイトル 4. コンテンツのタイトル 5. コンテンツのタイトル
カテゴリー名 1. コンテンツのタイトル 2. コンテンツのタイトル 3. コンテンツのタイトル 4. コンテンツのタイトル 5. コンテンツのタイトル
おまけ 「フック」システム
10.4.18 (C) 株式会社破滅派
13
http://wpdocs.sourceforge.jp/%E3%83%97%E3%83%A9%E3%82%B0%E3%82%A4%E3%83%B3_API
WordPressには「フック」と呼ばれる独特のAPIがあります。
1. アクションフック 特定の場所で実行される関数を登録できる
2. フィルターフック 特定のデータを出力・保存する前に加工できる
functions.phpにフックを書いて、どうなるかやってみましょう!