1.
WordPress
カスタマイズ実践2012
2012.10.18 WordBench神戸 上村崇
第16回 岡山WEBクリエイターズ
「jQuery・WordPress実践2012」

2.
自己紹介
@uemera uemura
• 上村崇 ( うえむらたかし )
• フリーランスのシステムエンジニア
• サーバインフラ、組込みシステム、Web とか。
• IT 業界のキャリア 10 年ちょっと
• 兵庫県西宮市在住

3.
最近のオレ
XOO PS
勉強会準備
WordBench,
サーバ関係
PHPフレームワーク
FuelPHP、CodeIgniter
JavaScript
jQuery
WordPress
主に技術サポート さくらVPS(CentOS)、LAMP、
メールサーバ、git、samba、netatalk
サーバインフラ

4.
WordPressのコミュニティ
神戸に在籍
岡山もあるよ。
でも活動休止中？

5.
4月に、「春のCMS徹底比較バトル」
でお話させてもらいました。

6.
2012.10時点のトレンド

7.
詳しくは過去の資料をご覧ください。
WordPressの天下はいつまで続く? WordPressの現状と未来
http://prezi.com/dnuvx7wirgee/wordpress-wordpress-web/

8.
今日は、
「理論ではなく、WordPressを実践するための基礎知識」
をご紹介します。

9.
その前に、
「なぜWordPressで作るのですか?」
「WordPressじゃないといけないのでしょうか?」
なんでもかんでもWordPressではなく、
「WordPressで作った方が有利」な場合に採用するように
しましょう。

10.
客 制作者
自分で記事編集したいんだよね
CMSで作りましょう
でも安くないとヤダよ
( WordPressかなぁ... )

11.
PCだけじゃなくて、スマホや携帯からも更
新したい
ガラケーでも見られるようにして
ブログ3つ必要なんだよね
もしかしたらあとで機能追加あるかも
( WordPressかなぁ... )

12.
制作者側からみた、
WordPressで作るメリット
・WordPressって言えばモテる
・実績になる、次につながりやすい
・CMSのデファクトスタンダードなので安心
・ネットに情報が多い

13.
制作者側からみた、
WordPressで作るデメリット
・ phpをある程度知っておかないといけない
・ WordPressの制作単価は下がる傾向にある。
・ 顧客を囲い込めない

14.
WordPress実践
・外観(テーマ)を選ぶ、カスタマイズする
・ブログ、固定ページ、カスタムページの違い
・お問い合わせフォームはどう作る?
・データのバックアップはどうする?
・おすすめプラグイン
・インストールにおすすめのレンタルサーバ

15.
テーマ(外観)を
選ぶ、作る

16.
自分でテーマを作らなくても、
フリーのテーマは無数にあります

17.
テーマのインストール
外 観
・管理画面上でテーマインストール可能。
・ファイルをFTPなどでアップロードする必要はない。

18.
約800のテーマから選べる

19.
テーマを自分でカスタマイズする場合は?

20.
カスタマイズ

21.
リアルタイム編集

22.
もっとガッツリとテーマ編集したい?
テーマファイルを直接編集する必要があります

23.
テーマファイルの置き場所
wordpress
wp-­‐content
themes
twentyeleven

24.
index.php
header.php
content.php
sidebar.php
content.php
footer.php

25.
テーマフォルダに入っているファイル
content.php
記事コンテンツ用 footer.php
フッタ用
header.php
ヘッダ用
index.php
インデックスページ用
必要なファイルは限られている
スタイルシート
sidebar.php
サイドバー用

26.
<?php
get_header();
?> header.php index.php
<div
id="primary">
<div
id="content"
role="main">
<?php
if
(
have_posts()
)
:
?>
<?php
twentyeleven_content_nav(
'nav-­‐above'
);
?>
<?php
/*
Start
the
Loop
*/
?>
<?php
while
(
have_posts()
)
:
the_post();
?> content.php
<?php
get_template_part('content',
get_post_format());
?>
<?php
endwhile;
?>
テンプレートタグ という
<?php
twentyeleven_content_nav(
'nav-­‐below'
);
?>
<?php
else
:
?>
WordPressが用意している関数
<article
id="post-­‐0"
class="post
no-­‐results
not-­‐found">
<header
class="entry-­‐header">
<h1
class="entry-­‐title"><?php
_e(
'Nothing
Found',
'twentyeleven'
);
?></h1>
</header><!-­‐-­‐
.entry-­‐header
-­‐-­‐>
<div
class="entry-­‐content">
<p><?php
_e(
'Apologies,
but
no
results
were
found
for
the
requested
archive.
Perhaps
searching
will
help
find
a
related
post.'
<?php
get_search_form();
?>
</div><!-­‐-­‐
.entry-­‐content
-­‐-­‐>
</article><!-­‐-­‐
#post-­‐0
-­‐-­‐>
<?php
endif;
?>
</div><!-­‐-­‐
#content
-­‐-­‐>
</div><!-­‐-­‐
#primary
-­‐-­‐>
<?php
get_sidebar();
?> sidebar.php
<?php
get_footer();
?> footer.php

27.
<?php
get_header();
?> index.php
<div
id="primary">
<div
id="content"
role="main">
テンプレートタグ
<?php
if
(
have_posts()
)
:
?>
<?php
twentyeleven_content_nav(
'nav-­‐above'
);
?>
<?php
/*
Start
the
Loop
*/
?>
<?php
while
(
have_posts()
)
:
the_post();
?>
<?php
get_template_part('content',
get_post_format());
?>
1記事分を表示
<?php
endwhile;
?>
<?php
twentyeleven_content_nav(
'nav-­‐below'
);
?>
<?php
else
:
?>
<article
id="post-­‐0"
class="post
no-­‐results
not-­‐found">
<header
class="entry-­‐header">
<h1
class="entry-­‐title"><?php
_e(
'Nothing
Found',
'twentyeleven'
);
?></h1>
</header><!-­‐-­‐
.entry-­‐header
-­‐-­‐>
<div
class="entry-­‐content">
<p><?php
_e(
'Apologies,
but
no
results
were
found
for
the
requested
archive.
Perhaps
searching
will
help
find
a
related
post.'
<?php
get_search_form();
?>
</div><!-­‐-­‐
.entry-­‐content
-­‐-­‐>
</article><!-­‐-­‐
#post-­‐0
-­‐-­‐>
<?php
endif;
?>
</div><!-­‐-­‐
#content
-­‐-­‐>
</div><!-­‐-­‐
#primary
-­‐-­‐>
<?php
get_sidebar();
?>
<?php
get_footer();
?>

28.
詳しくは
テンプレートタグ
で検索！

29.
WordPress Codex
テンプレートタグ リファレンス

30.
テンプレートファイルが適用されるルール
インデックスページ
(最新投稿順の一覧ページ)
シングルページ
カテゴリーごとページ
インデックスページ
シングルページ
日付ごとページ
(１記事のみのページ)
カテゴリーごとページ
(カテゴリごとに分けたページ一覧)
日付ごとページ
(月毎に分けたページ一覧)

31.
テンプレートファイルが適用されるルール
インデックスページ
(最新投稿順の一覧ページ)
index.php
優先
シングルページ
(１記事のみのページ) index.php single.php
優先 優先
カテゴリーごとページ
(カテゴリごとに分けたページ一覧) index.php archive.php category.php
優先 優先
日付ごとページ
(月毎に分けたページ一覧) index.php archive.php date.php

32.
archive.php category.php
アーカイブページ用 カテゴリーページ用
(無くてもOK) (無くてもOK)
index.php
インデックスページ用
(必須)
single.php
シングルページ用
(無くてもOK)

33.
詳しくは
テンプレート階層
で検索！

34.
ブログ、固定ページ、
カスタムページの違い
それぞれの役割をちゃんと理解しよう

35.
投 稿 ブログを投稿する
のに使う
固定ページ 静的ページを作るの
に使う

36.
固定ページはここに出る
例えば
・特定商取引
・個人情報保護方針
・交通アクセス

37.
投稿タイプは3つある
投稿
固定ページ
カスタム投稿タイプ
これを覚えると
WordPressのカスタムの
幅がぐっと広がる！

38.
Typesプラグインでカスタム投稿タイプを使う

39.
プラグイン - 新規追加
広
管理画面からプラグインの追加ができる！

40.
Custom Post Type追加

41.
大都会岡山
大都会岡山
(人が識別するための名前)
okayama
(URLとして使用される文字列)
Costom post type: カスタム投稿タイプのこと
スラグ: URLに使うためのページ固有の文字列のこと
画面の一番下にある「CustomPostTypeを保存」をクリックして保存する

42.
投 稿
固定 ペー ジ
大都会岡山のカスタム投稿タイプができた！

43.
大都会岡山の記事書き放題!

44.
http://xxx.xxx/?post_type=okayama
?post_type=okayama
とすることで、大都会岡山の
投稿タイプの一覧ページが見
られる。
okamayaはスラッグ名

45.
カスタム投稿タイプが役に立つ例
HOME
おしらせ 投稿(カテゴリ=おしらせ)
スタッフブログ 投稿(カテゴリ=スタッフブログ)
商品案内 カスタム投稿タイプ

46.
お問い合わせフォームはどう作る?

47.
問い合わせフォームの入
力項目をカスタマイズ出
来る。

48.
データのバックアップはどうすればいい?

49.
BackWPupプラグイン最強
・ファイルとDBの両方バックアップ
・バックアップファイルをFTP転送
・スケジュール実行できる
・実行結果をメール通知できる
・DropBox/AmazonS3/GoogleStorage/
MicrosoftAzure/Rackspace Cloud
にも転送可能
・リストアがブラウザからできる
・ただし英語

50.
便利なプラグイン紹介

51.
携帯対応: Ktai Stileプラグイン

52.
スマートフォン対応: WPtouchプラグイン

53.
ショッピングカート: Welcartプラグイン

54.
インストールにおすすめの
レンタルサーバ

55.
簡単インストール機能で時間節約
こんなサーバーを選ぼう!
・WordPressの簡単インストール機能あり
・新しいバージョンを使用していること
php 5.2.4以上
MySQL 5以上
・phpがセーフモード動作のサーバーは避けた方が
良い(xreaとかcoreserverとか)

56.
初期費用 3950円
月額 1500円
2ステップでDB作成とファイル設置まで完了

57.
ロリポプラン
初期費用 1575円
月額 315円
3ステップでDB作成とファイル設置まで完了

58.
最後に

59.
イベントめじろ押し！
WordPress関連イベント一覧
WordBench東京、大阪などは
Ustream配信アリ
http://wordbench.org

60.
ありがとうございました