2012.11.03 WordCamp Osaka 2012 にて発表

1. WordPressで
ブログ以外のサイ トを作る
2012.11.03 WordCamp Osaka 2012

2. 自己紹介
西山 拓磨
• デザイナー／アートディレクター
• 専門学校講師
• 大阪・京都を中心に活動

3. ブログ以外の
サイトの作り方

4. Blog

5. ‣ ブログサイト
‣ コーポレートサイト
‣ ショッピングサイト

6. 個人サイト：takumadesign http://takumadesign.com/

7. クライアントワーク：morisu maki http://morisumaki.com/

8. 専門学校でポートフォリオ制作を指導

9. WordPressで作るポートフォリオサイト
http://www.slideshare.net/takuma2480/wordpress-12753727

10. WordPressを使って
ポー ォ
トフ リオを作ることが
得意です。

11. CMS

12. コンテンツ管理システム

14. CMS利用に役立つ機能

15. 1. カスタム投稿タイプ
2. カスタムタクソノミー
3. カスタムフィールド

16. カスタム⃝⃝

17. ※架空のサイトです

21. News 記事
EVENT イベント
Home Gallery 作品
About
Contact

22. 投稿タイプ
「投稿」 「固定ページ
と 」

23. 投稿
時系列

24. News 記事
イベント
EVENT 投稿
Home Gallery 作品
About
Contact

25. 固定ページ
階層構造

26. News 記事
イベント
EVENT 投稿
Home Gallery 作品
About
固定ページ
Contact

27. News 記事
EVENT イベント
Home Gallery 作品
About

32. 1. カスタム投稿タイプ

33. News 記事
イベント
EVENT 投稿
Home Gallery 作品
About
固定ページ
Contact

34. 記事
News 投稿
EVENT イベント
カスタム投稿
Home Gallery 作品
About
固定ページ
Contact

36. functions.php にコードを記述
function create_post_type() {
register_post_type( 'event',
array(
'label' => 'イベント',
'public' => true
)
);
}
add_action( 'init', 'create_post_type' );
または

37. プラグインをインストール

38. 「Custom Post Type UI」

39. Simple
「CMS Press」

41. ❶
❷
❸

47. テンプレートファイル：archive-gallery.php

48. 2. カスタムタクソノミー

49. taxonomy
分類

50. 分類
「カテゴリー」 「タグ」
と

52. カテゴリー
親子関係

54. タグ
キーワード

56. 「カテゴリー」「タグ」
以外の分類

59. functions.php にコードを記述
function create_taxonomy() {
register_taxonomy( 'creator', 'gallery',
array(
'label' => 'クリエイター',
'public' => true
)
);
}
add_action( 'init', 'create_taxonomy' );
または

60. プラグインをインストール
「CMS Press」

62. ❶
❷
❸

68. 3. カスタムフィールド

69. タイトル
本文

75. プラグインをインストール
「Custom Field Template」

76. ❶

77. ❷

79. 値を呼び出す
ループ内にコードを記述
<?php echo post_custom( '⃝⃝' ); ?>

83. おまけ.
カスタムメニュー

84. functions.php にコードを記述
add_theme_support( 'menus' );

90. header.php にコードを記述
<?php wp_nav_menu(array('menu' => '⃝⃝')); ?>

93. ‣ 適切な投稿タイプを選択
‣ カスタム機能で自由自在
‣ アイデアと使い方次第

94. Special Thanks
akky サク
@akky272 @mo_naoco
鈴木梨沙 morisu maki
@m0m0dach @morisumaki