wordpressでサイトを作ろう!

46
WordPressで サイトを作ろう! 2012.7.21 上村崇 ウェブクリエイターズ高知 WCK Sessions vol.2 「選ばれるCMSとその理由」 Sunday, July 22, 12

Upload: takashi-uemura

Post on 04-Dec-2014

3.949 views

Category:

Technology


3 download

DESCRIPTION

2012.07.21 Webクリエイターズ高知で発表したプレゼン資料http://kochiweb.doorkeeper.jp/events/1278

TRANSCRIPT

Page 1: WordPressでサイトを作ろう!

WordPressでサイトを作ろう!

2012.7.21 上村崇ウェブクリエイターズ高知WCK Sessions vol.2 「選ばれるCMSとその理由」

Sunday, July 22, 12

Page 2: WordPressでサイトを作ろう!

WordPressを使ってサイトを構築するための基礎知識をご紹介します。

Sunday, July 22, 12

Page 3: WordPressでサイトを作ろう!

あなたがやりたいことをWordPressで叶えます

・外観(テーマ)を変えたい 自分でカスタマイズできるようになりたい・ブログを書きたい、固定ページを作りたい・お問い合わせフォームはどう作る?・データのバックアップはどうするの?

・地方におけるWordPressの付き合い方

Sunday, July 22, 12

Page 4: WordPressでサイトを作ろう!

フリーのテーマは無数にあります

Sunday, July 22, 12

Page 5: WordPressでサイトを作ろう!

管理画面上でテーマインストール可能

外 観テーマのインストール

Sunday, July 22, 12

Page 6: WordPressでサイトを作ろう!

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

Sunday, July 22, 12

Page 7: WordPressでサイトを作ろう!

カスタマイズ

Sunday, July 22, 12

Page 8: WordPressでサイトを作ろう!

リアルタイム編集

Sunday, July 22, 12

Page 9: WordPressでサイトを作ろう!

もっとガッツリとテーマ編集したい?

Sunday, July 22, 12

Page 10: WordPressでサイトを作ろう!

wordpress

wp-­‐contentthemestwentyeleven

Sunday, July 22, 12

Page 11: WordPressでサイトを作ろう!

header.php

content.php

sidebar.php

footer.php

index.php

content.php

Sunday, July 22, 12

Page 12: WordPressでサイトを作ろう!

必要なファイルは限られている

Sunday, July 22, 12

Page 13: WordPressでサイトを作ろう!

<?php  get_header();  ?><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());  ?>     <?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.',  'twentyeleven'  );  ?></p>         <?php  get_search_form();  ?>       </div><!-­‐-­‐  .entry-­‐content  -­‐-­‐>     </article><!-­‐-­‐  #post-­‐0  -­‐-­‐>

  <?php  endif;  ?>   </div><!-­‐-­‐  #content  -­‐-­‐></div><!-­‐-­‐  #primary  -­‐-­‐>

<?php  get_sidebar();  ?><?php  get_footer();  ?>

index.phpheader.php

sidebar.php

footer.php

contents.php

テンプレートタグ

Sunday, July 22, 12

Page 14: WordPressでサイトを作ろう!

<?php  get_header();  ?><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());  ?>     <?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.',  'twentyeleven'  );  ?></p>         <?php  get_search_form();  ?>       </div><!-­‐-­‐  .entry-­‐content  -­‐-­‐>     </article><!-­‐-­‐  #post-­‐0  -­‐-­‐>

  <?php  endif;  ?>   </div><!-­‐-­‐  #content  -­‐-­‐></div><!-­‐-­‐  #primary  -­‐-­‐>

<?php  get_sidebar();  ?><?php  get_footer();  ?>

index.php

テンプレートタグ

Sunday, July 22, 12

Page 15: WordPressでサイトを作ろう!

テンプレートタグ

Sunday, July 22, 12

Page 16: WordPressでサイトを作ろう!

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

Sunday, July 22, 12

Page 17: WordPressでサイトを作ろう!

インデックスページ(最新投稿順の一覧ページ)

シングルページ(1記事のみのページ)

カテゴリーごとページ(カテゴリごとに分けたページ一覧)

日付ごとページ(月毎に分けたページ一覧)

index.php

index.php

index.php

index.php

category.php

date.php

優先

優先

single.php優先

archive.php優先

archive.php優先

Sunday, July 22, 12

Page 18: WordPressでサイトを作ろう!

アーカイブページ用 カテゴリーページ用

インデックスページ用

シングルページ用

Sunday, July 22, 12

Page 19: WordPressでサイトを作ろう!

テンプレート階層

Sunday, July 22, 12

Page 20: WordPressでサイトを作ろう!

ブログを書きたい固定ページを作りたい

Sunday, July 22, 12

Page 21: WordPressでサイトを作ろう!

投 稿

固定ページ

ブログを投稿するのに使う

静的ページを作るのに使う

Sunday, July 22, 12

Page 22: WordPressでサイトを作ろう!

固定ページはここに出る

Sunday, July 22, 12

Page 23: WordPressでサイトを作ろう!

・投稿・固定ページ・カスタム投稿タイプ

Sunday, July 22, 12

Page 24: WordPressでサイトを作ろう!

Custom Post Type UI

Sunday, July 22, 12

Page 25: WordPressでサイトを作ろう!

投稿タイプ名(URLとして使用される文字列)

ラベル(人が識別するための名前)

hirosue

広末涼子

Sunday, July 22, 12

Page 26: WordPressでサイトを作ろう!

投 稿

広末涼子のカスタム投稿タイプができた

固定ページ

Sunday, July 22, 12

Page 27: WordPressでサイトを作ろう!

広末涼子の記事書き放題!

Sunday, July 22, 12

Page 28: WordPressでサイトを作ろう!

http://xxx.xxx/?post_type=hirosue

Sunday, July 22, 12

Page 29: WordPressでサイトを作ろう!

お し ら せ

スタッフブログ

商品案内

H O M E

投稿(カテゴリ=おしらせ)

カスタム投稿タイプ

カスタム投稿タイプが役に立つ例

投稿(カテゴリ=スタッフブログ)

Sunday, July 22, 12

Page 30: WordPressでサイトを作ろう!

お問い合わせフォームを入れたい

Sunday, July 22, 12

Page 31: WordPressでサイトを作ろう!

Sunday, July 22, 12

Page 32: WordPressでサイトを作ろう!

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

Sunday, July 22, 12

Page 33: WordPressでサイトを作ろう!

BackWPupプラグイン最強

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

Sunday, July 22, 12

Page 34: WordPressでサイトを作ろう!

地方におけるWordPressの付き合い方

Sunday, July 22, 12

Page 35: WordPressでサイトを作ろう!

制作単価が安ければ工数かけなければいいじゃない

プラグイン、テーマなどの有り物をできるだけ活用する

Sunday, July 22, 12

Page 36: WordPressでサイトを作ろう!

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

Sunday, July 22, 12

Page 37: WordPressでサイトを作ろう!

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

Sunday, July 22, 12

Page 38: WordPressでサイトを作ろう!

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

Sunday, July 22, 12

Page 39: WordPressでサイトを作ろう!

themeforest WOOTHEMES

STUDIOPRESSWordPress ThemesGallery

Sunday, July 22, 12

Page 40: WordPressでサイトを作ろう!

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

Sunday, July 22, 12

Page 41: WordPressでサイトを作ろう!

初期費用 3950円 月額 1500円

2ステップでDB作成とファイル設置まで完了

Sunday, July 22, 12

Page 42: WordPressでサイトを作ろう!

ロリポプラン初期費用 1575円月額 315円

3ステップでDB作成とファイル設置まで完了

Sunday, July 22, 12

Page 43: WordPressでサイトを作ろう!

地方は勉強会が少ない?

WordPress関連イベント一覧WordBench東京、大阪などは

Ustream配信アリ

Sunday, July 22, 12

Page 44: WordPressでサイトを作ろう!

WordBeach(名古屋) 2012.8.25-26WordCamp東京 2012.9.15WordCamp大阪 2012.秋

Sunday, July 22, 12

Page 45: WordPressでサイトを作ろう!

WordPress 3.x (速習デザイン)

大曲 仁, 星野 邦敏, 豊田 有【著】技術評論社

本格ビジネスサイトを作りながら学ぶWordPressの教科書

プライム・ストラテジー【著】ソフトバンククリエイティブ

Sunday, July 22, 12

Page 46: WordPressでサイトを作ろう!

ありがとうございました

Sunday, July 22, 12