MdNの本

WordPress 3.x 現場のワークフローで覚えるビジネスサイト制作

WordPress 3.x 現場のワークフローで覚えるビジネスサイト制作

WordPress 3.x 現場のワークフローで覚えるビジネスサイト制作

本格的なサンプルサイトをつくりながら、 WordPressのビジネスサイト制作手法が身につく!!

ハヤシユタカ 著
B5変型判 / 288pP
ISBN978-4-8443-6288-3 / 価格(本体2,800円+税)※電子版の価格は販売ストアにて
2012年09月20日発売

バージョン3以降でCMSとしての機能が充実したことにより、ブログだけでなく、一般的なコーポレートサイトへの導入も盛んになっているWordPress。HTMLやCSSを知らなくてもブログ感覚でコンテンツを追加できるため、いったんWordPressでサイトを構築しておき、日常的な更新はクライアント側で行えるようにするケースも増えてきました。
本書では、(X)HTML+CSSでサイトをつくることはできるものの、「ゼロからのWordPressサイト構築は未経験」、「PHPなどのプログラムはあまりわからない」という方のために、WordPressでビジネスサイトを構築する手法をステップ・バイ・ステップ形式で解説しています。作成するサンプルサイトには、ニュースページ、製品情報ページ、会社概要ページ、お問い合せフォームといったクライアントワークに欠かせない要素が盛り込まれています。サンプルデータと掲載コードもダウンロードできるので、PHP言語に不慣れな方でも順を追ってステップを進めていけば、WordPressのしくみからテンプレートタグの使い方、カスタム投稿タイプ、固定ページなど、WordPressサイトの制作に必要な知識と技術を身につけられます。さらに、jQueryの組み込みやソーシャルメディアとの連携、ギャラリー制作、スマートフォン対応といった実践的な技術も満載。WordPressでサイト構築を目指す方、必携の一冊です!!

→サンプルサイトの閲覧

→サンプルデータのダウンロードはこちら

twitter facebook google+ このエントリーをはてなブックマークに追加 RSS

ページイメージ

クリックすると折りたためます
■ページ見本










目次

クリックすると開きます

【目次】
【WordPress 3.x 現場のワークフローで覚えるビジネスサイト制作】

本書の使い方
WordPressを利用するのに必要な準備
サンプルサイトのページ一覧
サンプルサイトのサイトマップ
サイトを構築する前に知っておきたいこと


───────────
CHAPTER 1 WordPressの初期設定の確認
───────────
■LESSON 001 基本設定
STEP 1 サイト名とキャッチフレーズの入力
STEP 2 投稿記事の表示設定の確認
STEP 3 投稿画像のサイズ設定
STEP 4 パーマリンクの設定
STEP 5 サイトのツールバーの非表示設定

■LESSON 002 初期登録されている情報の削除
STEP 1 はじめから投稿されている記事の削除
STEP 2 はじめから投稿されている固定ページの削除
STEP 3 はじめから登録されているリンクの削除
STEP 4 はじめから用意されているカテゴリー名の変更
STEP 5 新しいカテゴリーの追加
STEP 6 新しい固定ページの追加

■LESSON 003 記事の投稿
STEP 1 「新規投稿を追加」ページでタイトルを入力
STEP 2 パーマリンクの設定
STEP 3 投稿記事の本文を入力
STEP 4 カテゴリーの選択
STEP 5 その他の項目の設定について
STEP 6 記事の公開
STEP 7 記事の表示を確認
STEP 8 サイト表示を確認
STEP 9 投稿記事の管理方法

〈COLUMN〉
WordPressのパーマリンク設定とは?
一覧画面からの記事の削除方法
カテゴリー名とスラッグ名について
WordPressの管理画面の左側にあるメニューの項目について
カテゴリーとパーマリンクについて
表示オプションについて
プレビューと公開日時について


───────────
CHAPTER 2 WordPressの基本
───────────
■LESSON 001 サイト構築をする手順
STEP 1 テンプレートの変更について

■LESSON 002 WordPressのテンプレートファイル
STEP 1 テンプレートファイルと優先順位

■LESSON 003 新しいテーマの作成とテーマの選択
STEP 1 テーマフォルダの制作
STEP 2 テンプレートファイルを作成
STEP 3 スタイルシートファイルを作成
STEP 4 テーマのサムネイル画像を作成
STEP 5 テーマフォルダのアップロード
STEP 6 テーマの切り替え
STEP 7 テーマの編集画面を確認

■LESSON 004 bloginfoタグでのブログ情報の確認
STEP 1 WEBページの基本HTMLコードを記述
STEP 2 ブログのタイトルの表示
STEP 3 コンテンツタイプとエンコードの指定
STEP 4 画面上に取得した情報を表示

■LESSON 005 パーツテンプレートの作成
STEP 1 モジュールテンプレート
STEP 2 各領域をdivタグで囲む
STEP 3 header.phpにコードを記述
STEP 4 header.phpをindex.phpに読み込む
STEP 5 footer.phpにコードを記述
STEP 6 footer.phpをindex.phpに読み込む
STEP 7 カスタムテンプレートの作成
STEP 8 カスタムテンプレートの読み込み

■LESSON 006 投稿した記事のタイトルと本文を出力
STEP 1 投稿した記事のタイトルの表示
STEP 2 投稿した記事の本文を表示
STEP 3 記事を追加投稿して複数記事の表示を確認

〈COLUMN〉
コーポレートサイトを構築するために
WordPressに編集したファイルを反映させる方法
WordPressのテンプレートタグ
初期設定以外でもよく使用する「bloginfo」タグ
もし投稿記事がなかった場合


───────────
CHAPTER 3 サイトのベース制作
───────────
■LESSON 001 ヘッダーエリアの作成
STEP 1 制作準備
STEP 2 ロゴマークを画像に変更
STEP 3 ヘッダーエリアのスタイルの調整
STEP 4 サイトマップ・RSSフィードのリンクを設置
STEP 5 サイトマップとRSSフィードのスタイルの調整
STEP 6 カスタムメニュー機能を有効化
STEP 7 カスタムメニューの作成
STEP 8 カスタムメニューの表示
STEP 9 ナビゲーションの装飾
STEP 10 メイングラフィックの設置

■LESSON 002 フッターとサイドバーの作成
STEP 1 フッターの装飾
STEP 2 コンテンツとサイドバーエリアの設定
STEP 3 サイドバーにバナーを表示

〈COLUMN〉
WordPress3.0からの新機能~カスタムメニュー


───────────
CHAPTER 4 ニュースページの作成
───────────
■LESSON 001 トップページにニュース記事を表示
STEP 1 投稿の準備
STEP 2 ナビゲーションの表示
STEP 3 カテゴリー「お知らせ」の投稿
STEP 4 カテゴリー「セミナー」の投稿
STEP 5 記事のカテゴリーによってアイコンを変更

■LESSON 002 ニュース記事のインデックスページ(一覧ページ)を作成
STEP 1 ニュース関連記事一覧ページの作成
STEP 2 ニュース記事のタイトル画像を変更

■LESSON 003 ニュース記事の個別投稿を表示
STEP 1 ニュース記事の個別投稿の表示
STEP 2 ニュース記事の個別投稿の基本レイアウトを作成
STEP 3 個別記事ページでのカテゴリーに合わせたアイコンの表示
STEP 4 個別記事に「次へ」「前へ」のリンク表示

〈COLUMN〉
時間や日付を出力する「the_date()」「the_time()」について
ビジュアルエディタのツールボタンについて
カテゴリースラッグを取得する
if(is_home())の分岐の使用例
previous_post_linkとnext_post_linkの引数について


───────────
CHAPTER 5 プラグインの設定方法
───────────
■LESSON 001 プラグインの使い方の基本
STEP 1 プラグインを利用する前の準備
STEP 2 デフォルトのプラグイン「WP Multibyte Patch」の使用
STEP 3 プラグインのインストール方法

■LESSON 002 プラグインの使用
STEP 1 「WP No Category Base」の使用
STEP 2 「Breadcrumb NavXT」の使用
STEP 3 「WP-PageNavi」の使用
STEP 4 「All in One SEO Pack」の使用
STEP 5 「Head Cleaner」の使

〈COLUMN〉
プラグインのアップロードを利用した場合
「Breadcrumb NavXT」のタグを利用してパンくずリストを表示する


───────────
CHAPTER 6 製品ページの作成
───────────
■LESSON 001 トップページに製品記事を表示
STEP 1 製品記事の投稿の準備
STEP 2 製品記事の投稿
STEP 3 トップページに製品記事を表示
STEP 4 トップページの製品記事を装飾

■LESSON 002 製品記事のインデックスページ(一覧ページ)の作成
STEP 1 タイトル画像を変更
STEP 2 専用のカテゴリーテンプレートを作成
STEP 3 「製品一覧」ページに子カテゴリーごとの一覧を表示
STEP 4 各「製品一覧」ページを作成

■LESSON 003 製品記事の個別投稿ページを作成
STEP 1 個別記事ページ表示方法の変更
STEP 2 個別記事ページでもタイトル画像を変更
STEP 3 個別記事ページのレイアウトを整える

■LESSON 004 製品記事をタグで管理
STEP 1 サイドバーにタグメニューを表示
STEP 2 タグの一覧ページを作成
STEP 3 タグを個別記事にも反映

〈COLUMN〉
カスタムフィールドとは?
ループの条件を変更する「query_posts」について
カスタムフィールドに値が複数ある場合
アイキャッチ画像の有無を調べる「has_post_thumbnail()」タグ
query_postsで表示数を指定した場合のページナビゲーション
「tag」の文字列をURLから消す


───────────
CHAPTER 7 各固定ページの作成
───────────
■LESSON 001 会社概要ページの作成
STEP 1 投稿の準備(ビジュアルエディタの拡張)
STEP 2 会社情報ページを編集
STEP 3 会社情報ページを表示

■LESSON 002 アクセスページの作成
STEP 1 投稿の準備(カスタムテンプレートの作成)
STEP 2 アクセスページの表示(Googleマップの表示)

■LESSON 003 お問い合わせページの作成
STEP 1 プラグイン「Contact Form 7」の利用
STEP 2 お問い合わせフォームの設定
STEP 3 お問い合わせフォームの表示の調整

■LESSON 004 サイトマップページの作成
STEP 1 サイトマップ用のカスタムメニューの作成
STEP 2 サイトマップの表示
STEP 3 サイトマップの表示の調整

〈COLUMN〉
スパム対策プラグイン「Akismet」の有効化


───────────
CHAPTER 8 トピックスページの作成
───────────
■LESSON 001 トピックスページの作成
STEP 1 投稿の準備(カスタム投稿タイプの利用)
STEP 2 トピックスの投稿とトップページに記事を表示
STEP 3 トピックスの一覧ページを作成
STEP 4 トピックスの個別ページを作成
STEP 5 トピックスのカテゴリーページを作成(カスタムタクソノミーの利用)
STEP 6 パンくずリスト(Breadcrumb NavXT)とサイトマップの調整

〈COLUMN〉
カスタム投稿タイプのパラメーター
「wp_list_categories()」の表示とパラメーター
カスタムタクソノミーのURL


───────────
CHAPTER 9 サイトのカスタマイズ
───────────
■LESSON 001 各ページに機能を追加
STEP 1 404(NOT FOUND)ページの設定
STEP 2 検索フォームの設置
STEP 3 サイトナビゲーションをアニメーションで表現
STEP 4 トップページの画像を管理画面から管理
STEP 5 トップページにピックアップ記事を表示
STEP 6 サイドバー内に自由なコメント欄を表示
STEP 7 写真画像をColorboxでポップアップ表示
STEP 8 ギャラリー記事を投稿する

■LESSON 002 ソーシャルボタンの設置
STEP 1 ソーシャルボタンの設置(twitter、FaceBook、Google+1)
STEP 2 OGP(Open Graph Protocol)の設定

〈COLUMN〉
複数のお知らせを表示する
通常フォーマットとその他の投稿フォーマットを分ける方法
FacebookのユーザーIDの取得方法
FacebookのApp IDの取得方法


───────────
APPENDIX
───────────
■APPENDIX 001 スマートフォン対応について
■APPENDIX 002 WordPressのページテンプレートファイル
■APPENDIX 003 WordPressのモジュールテンプレート
■APPENDIX 004 本書にでてくるPHPの基本的なコードまとめ


INDEX


関連記事があります

  • WordPressでブログでなくビジネスサイトをつくろう

    Web デザイン WordPressでブログでなくビジネスサイトをつくろう

  • 新世代Web制作テクニック総特集

    web creators 新世代Web制作テクニック総特集

カスタマーレビュー(出典:amazon.co.jp)

カスタマーレビュー(出典:amazon.co.jp)