大分クリエイターズ 2015/11/14 北村崇「デザインをはじめる 前に知っておきたい 本当のデザイン」
Your SlideShare is downloading.
×
Check these out next
More Related Content
Viewers also liked (20)
Similar to W ctokyo2012 timing (20)
More from Takashi Kitamura (10)
W ctokyo2012 timing
- 1. WordCamp TOKYO 2012 2012.09.15 bデ ザ イナ ー・ We プ ログ ラ マの ノン て のテ ーマ は じめ TIMING デザイン事務所 作り 12年9月15日土曜日 北村 崇 http://timing.jp
- 2. WordCamp TOKYO 2012 2012.09.15 1.一応自己紹介 ジナル 2.オリ テ ーマの 種 類は? 3.必要な もの を確認 する! 4.テンプレ ートファ を理解 イル する! 5 . PH P は な い ! 12年9月15日土曜日 怖 く
- 3. WordCamp TOKYO 2012 2012.09.15 1.一応自己紹介 デザイン事務所 TIMING（タイミング） 代表 : Twitter tah_ timing 北村 崇 （Kitamura Takashi） プログラムとかわかりません。 で は 012 印刷、 告、 ゴやキャラクター、 広 ロ Y O2 りの グッズ制作等グラフィックデザイン。 TO K 刷周 Cam p ・印 現在はWEB制作をメインに活動。 ord イン 当 アパレルブランド、アーティストグッズ、 W デザ を担 企業ブランディング等 わ ぷー 管理 イン コイツ。 デザ 12年9月15日土曜日
- 4. WordCamp TOKYO 2012 2012.09.15 2.オリジナルテーマの種類は?…の前に。 ・HTML es sの ・CSS o rd Pr とW て W EB て お い ・投稿 は知 っ ・固定ページ 基本 。 。 い してね さ 勉強 ・ウィジェット くだ ・カスタムメニュー ・カスタムヘッダー ・アイキャッチ ・テーマカスタマイザー などなど 12年9月15日土曜日
- 5. WordCamp TOKYO 2012 2012.09.15 2. オリジナル テーマの種類 は? 12年9月15日土曜日
- 6. WordCamp TOKYO 2012 2012.09.15 2.オリジナルテーマの種類は? その1。子テーマ 親テーマ（TwentyEleven 等）の基本機能を受け継い で、必要な部分をカスタマイズ（追記）する方法 ちゃんと理解してないと 結構難しい。 ML とCS Sから 2。独 自HT その マ化 す る! テー 必要な要素をPHPに置き換えてWordPressのテーマに する方法 12年9月15日土曜日 意外にもこっちの方が初心者向け
- 7. WordCamp TOKYO 2012 2012.09.15 3. 必要なもの を確認する! 12年9月15日土曜日
- 8. WordCamp TOKYO 2012 2012.09.15 3.必要なものを確認する! なにが必要なのかを事前に確認 トップページ 記事ページ ロゴ ロゴ グローバルナビ グローバルナビ 記事一覧（最新 5 記事） 記事タイトル サ サ 投稿日時 イ イ ド サービスカテゴリー一覧 ド バ バ 記事本文 ー ー 会社概要 会社概要 12年9月15日土曜日
- 9. WordCamp TOKYO 2012 2012.09.15 3.必要なものを確認する! なにが必要なのかを事前に確認 ・トップページ ゴリ ーは 最新記事5件を表示する 会社概要へのリンクを表示する カテ か？ サービスカテゴリー一覧を表示する 増え るの ・会社概要等を載せるページ ペー ジは タイトルと本文のみ 事の 一覧 記 か？ ・最新記事を載せるページ 投稿日時とタイトルと本文。 必要 ビス は増 ・サービスを載せるページ サー タイトルと画像、サービス本文。 るのか？ 12年9月15日土曜日 え
- 10. WordCamp TOKYO 2012 2012.09.15 能 や 構 成 を 機 な い と 決 て め お か い ! 進 め な 先 に は 12年9月15日土曜日
- 11. WordCamp TOKYO 2012 2012.09.15 4. テンプレート ファイルを 理解する! 12年9月15日土曜日
- 12. WordCamp TOKYO 2012 2012.09.15 4.テンプレートファイルを理解する! テンプレートファイル例 トップページ等 （index.php） テーマのための関数（functions.php） スタイルシート （style.css） トップページ （front-page.php） 固定ページ （page.php） 順 位 が 投稿 （single.php） 優 先 フッター （footer.php） ヘッダー （header.php） あ る ! サイドバー （sidebar.php） http://wpdocs.sourceforge.jp/テンプレート階層 12年9月15日土曜日
- 13. WordCamp TOKYO 2012 2012.09.15 4.テンプレートファイルを理解する! 最低限必要なもの で す 。 トップページ等 （index.php） スタイルシート （style.css） だ け しかも style.c /* Theme Name: テーマ名 ss Theme URI: http://サイトURL/ に書 Description: テーマ解説 けば Version: テーマのバージョン Author: 作者名 OK Author URI: http://作者のサイトURL/ */ 12年9月15日土曜日
- 14. WordCamp TOKYO 2012 2012.09.15 4.テンプレートファイルを理解する! テンプレートファイルのある場所 WordPressの場所/wp-content/themes/ テ ー マ こ こ に ル ダ を フ ォ れ る ！ っ と 入 ま る 12年9月15日土曜日
- 15. WordCamp TOKYO 2012 2012.09.15 …え。 その後 どうするの？ 12年9月15日土曜日
- 16. WordCamp TOKYO 2012 2012.09.15 こっからが本題! 12年9月15日土曜日
- 17. WordCamp TOKYO 2012 2012.09.15 5. PHP は 怖くない! 12年9月15日土曜日
- 18. WordCamp TOKYO 2012 2012.09.15 5.PHPは怖くない! 必要なPHPファイルを用意する 会社概要.html page.php 固定ページで表示しよう 変 換！ ニュース.html 記事ページで表示しよう single.php 変換！ 基本 はHTMLを 12年9月15日土曜日 PHP に変え るだけ
- 19. WordCamp TOKYO 2012 2012.09.15 5.PHPは怖くない! テンプレートタグというものがある ほぼ 一行で実行出 一例 ありがたい 来る 。 タグが用意 されている !! ブログタイトル出力<?php bloginfo('name'); ?> が出 力 何 ブログURL出力<?php bloginfo('url'); ?> か スタイルシートへのリンク<?php bloginfo('stylesheet_url'); ?> 記事のパーマリンク出力<?php the_permalink() ?> 記事のタイトル出力<?php the_title(); ?> で き る 記事のコンテンツ出力<?php the_content(); ?> に 調 べ アイキャッチ出力<?php the_post_thumbnail(); ?> 事前 う よ 時間情報出力<?php the_time() ?> 記事内のタグ出力<?php the_tags(); ?> 12年9月15日土曜日 て み
- 20. WordCamp TOKYO 2012 2012.09.15 5.PHPは怖くない! 使い方も結構簡単 <link rel="stylesheet" href="http://サイトのURL/" /> 普通にURL打ってもリンクできない <link rel="stylesheet" href="<?php bloginfo( 'stylesheet_url' ); ?>" /> <img src="http://サイトのURL/images/photo.png" /> 普通にURL打ってもリンクできない <img src="<?php bloginfo('template_url'); ?>/images/photo.png" /> 最低 限ル ールを の 12年9月15日土曜日 守 れば OK!
- 21. WordCamp TOKYO 2012 2012.09.15 5.PHPは怖くない! …で。 最低限のルール って 何？ 12年9月15日土曜日
- 22. WordCamp TOKYO 2012 2012.09.15 5.PHPは怖くない! WordPressには ループ内 で使うテンプレートタグと ループ外 で使うタグがある 何が違うの？ 12年9月15日土曜日
- 23. WordCamp TOKYO 2012 2012.09.15 5.PHPは怖くない! ルー プ外で 使える ブログタイトル出力<?php bloginfo('name'); ?> ブログURL出力<?php bloginfo('url'); ?> スタイルシートへのリンク<?php bloginfo('stylesheet_url'); ?> 記事のパーマリンク出力<?php the_permalink() ?> 記事のタイトル出力<?php the_title(); ?> 記事のコンテンツ出力<?php the_content(); ?> アイキャッチ出力<?php the_post_thumbnail(); ?> 時間情報出力<?php the_time() ?> 記事内のタグ出力<?php the_tags(); ?> ルー プ内で 使える 12年9月15日土曜日
- 24. WordCamp TOKYO 2012 2012.09.15 5.PHPは怖くない! の記事 やペー ジに 個別 力は 依存 する情 報の出 ル ープ の中 に 書か ないと 12年9月15日土曜日 ダメ
- 25. WordCamp TOKYO 2012 2012.09.15 5.PHPは怖くない! …で。 ループって何？ 12年9月15日土曜日
- 26. WordCamp TOKYO 2012 2012.09.15 5.PHPは怖くない! ループ だけは 理解しておこう！ 12年9月15日土曜日
- 27. WordCamp TOKYO 2012 2012.09.15 5.PHPは怖くない! ループだけはわかっておこう! <?php if(have_posts()) : while(have_posts()) : the_post(); ?> <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> <?php endwhile; endif; ?> ? <?php if(have_posts()) : while(have_posts()) : the_post(); ?> <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> <?php endwhile; endif; ?> 出力 項目を したい 繰り 返し表 示する 12年9月15日土曜日
- 28. WordCamp TOKYO 2012 2012.09.15 5.PHPは怖くない! ループだけはわかっておこう! <?php if(have_posts()) : while(have_posts()) : the_post(); ?> 出力内容 <?php endwhile; endif; ?> コレあるかどうか によって 表 示する 記事が 判断 繰り 返し 12年9月15日土曜日 し ている
- 29. WordCamp TOKYO 2012 2012.09.15 5.PHPは怖くない! 例 <?php if(have_posts()) : while(have_posts()) : the_post(); ?> <h2> <a href="<?php the_permalink(); ?>"> <?php the_title(); ?> </a> </h2> <?php the_content(); ?> <?php endwhile; endif; ?> HTMLはこう なる <h2><a href=”ページリンク”>ページタイトル</a></h2> 記事内容 12年9月15日土曜日
- 30. WordCamp TOKYO 2012 2012.09.15 5.PHPは怖くない! 今日 残念ながら はここまで! 12年9月15日土曜日
- 31. WordCamp TOKYO 2012 2012.09.15 あくまで基礎の基礎 まずはチ ャレン ジ! 絶対 でき ます! 私がで きて いる! （ノンプログラマー） 12年9月15日土曜日
- 32. WordCamp TOKYO 2012 2012.09.15 bデ ザ イナ ー・ We プ ログ ラ マの ノン http://timing.jp ご清聴ありがとうございました スライド て のテ ーマ は じめ 作り TIMING デザイン事務所 北村 崇 12年9月15日土曜日
