PowerPoint プレゼンテーション

Size: px

Start display at page:

Download "PowerPoint プレゼンテーション"

あおいこびき
7 years ago
Views:

1 株式会社コミュニティコム星野邦敏埼玉県さいたま市大宮区宮町 1-5 銀座ビル7 階 URL: 1

2 星野邦敏 ( ほしのくにとし ) Twitter Facebook : 星野邦敏 (Kunitoshi Hoshino) 株式会社コミュニティコムという会社で自社運営サイトやアプリ他企業様向けサイトも作っていますオープンソースの活動をしたり IT 系の勉強会を主催したり地域の活動をしたり WordPressをCMSとしてWEBサイトを作ることが増えています 2

3 WordPressで作る WordPressのイベントである WordCamp や WordBench にスタッフやスピーカーとして参加 3

4 WordPress 日本語サイトのイベントカレンダーを更新する係ココ 4

5 公式ディレクトリにプラグインを登録したり Japan Tenki プラグイン全国 142 地域の天気を自動表示 Hello Wapuu プラグインブログ更新を応援 5

6 WordPress に関して書籍や雑誌で執筆をしたり 2012 年 1 月に出版 web creators 特別号 Webサイト制作最新トレンドの傾向と対策 2012 年 2 月に出版 Web Designing 2012 年 3 月号 2012 年 3 月に出版速習デザイン WordPress 6

7 WordPress に関して書籍や雑誌で執筆をしたり今も執筆中です 2012 年 7 月に出版 web creators 特別号スマートフォンソーシャルメディア WordPress 7

8 WordPressで作る最近の関心事はコワーキングスペースを作ることですコワーキングスペース7F 埼玉県さいたま市大宮駅東口徒歩 1 分 65 坪 215 平米年 12 月 1 日 ( 土 ) 本格オープン 8

9 こういうことありませんか? コワーキングスペース開いたらしいけどホームページまだ? そろそろプレスリリースを出したいんだけど 9

10 そういう時に便利なツール! WordPress Bootstrap 10

11 Bootstrap って? Twitterでお馴染みのTwitter 社が Apacheライセンスで提供されているCSSフレームワーク 11

12 コワーキングスペース 7F のサイトも 12

13 何が出来るの? Rresponsive スマートフォン対応 13

14 何が出来るの? grid system スマートフォン対応の際に便利 80px ごとで 12 カラム 14

15 何が出来るの? Icon glyphs アイコン 15

16 何が出来るの? Carousel 写真のスライダー 16

17 WordPressで作る何が出来るの? その他にも Tab タブがそれっぽく Form フォームもそれっぽく Dropdown ドロップダウンメニューがそれっぽく 17

18 どう使うの? から bootstrap.zip をダウンロードして解凍するとコレしか入っていないどう使うの? 18

19 どう使うの? <link href="<?php echo get_template_directory_uri();?>/css/bootstrap.css" rel="stylesheet"> <link href="<?php echo get_template_directory_uri();?>/css/bootstrapresponsive.css" rel="stylesheet > まずは header.phpで読み込もう! レスポンシブウェブデザインにしたい場合は bootstrap-responsive.cssも! 19

20 WordPressで作るどう使うの? <div class="row-fluid"> <div class="span4">...</div> <div class="span8">...</div> </div> 例えばレスポンシブウェブデザインにしたい場合は class= row-fluid であとは span span! 20

21 どう使うの? Icon glyphs アイコン <i class= icon-glass ></i> とか HTML で書くと表示される 21

22 どう使うの? 要は CSSフレームワークで決められたHTMLタグを書くとそれっぽくなるタグは以下のURLを見てみましょう! 22

23 WordPress と連携 <?php if (have_posts()) : query_posts('post_type=pan-pan-pan&posts_per_page=5&order=desc');?> <?php while (have_posts()) : the_post();?> <li> <?php $attachment_img = wp_get_attachment_image_src( get_post_thumbnail_id(), 'full' ); list( $src, $width, $height ) = $attachment_img;?> <img src="<?php echo $src;?>" alt="" /> <div class="slide-caption n hidden-phone"> <h3><?php the_title();?></h3> <p><?php the_content();?></p> </div> </li> <?php endwhile;?> <?php else :?> <?php endif;?> <?php wp_reset_query();?> HTML タグ WordPress タグにして運用する 23

24 WordPress と連携例えばトップページのスライド画像はカスタム投稿タイプ運用 24

25 まとめコワーキングスペース公式サイトを WordPressとBootstrapを組み合わせると短時間でそれっぽいWebサイトが作れる HTMLベースからWordPressにする知識は必要 Bootstrap ベースの WordPress テーマもある 25

26 最後にとはいえどんなに作ってもコンテンツが重要コンテンツファーストの時代ということで更新頑張ります! 26

27 最後にコワーキングスペース公式サイトを WordPressで作るということでコワーキングスペース7Fを今後ともよろしくお願い致します 27

28 WordPressで作る今後のお問い合わせなど何かありましたら Mail: URL: などにご連絡くださいありがとうございました! 株式会社コミュニティコム星野邦敏 28

PowerPoint プレゼンテーション

PowerPoint プレゼンテーション年末年始で 1 つ WordPress で Web サイトを作ってみようイベント株式会社コミュニティコム星野邦敏 330-0802 埼玉県さいたま市大宮区宮町 1-5 銀座ビル 7 階 URL: http://www.communitycom.jp/ E-MAIL: mail@communitycom.jp 1 年末年始でWebサイトを作る (2) 目次 0. 自己紹介 1. 2. 質疑応答 2