[WordPress]ワードプレスで、ブログサイトではない一般的なサイト構築時の9ステップ

WordPressでブログサイトではなく、CMSとして一般的なサイトを構築する方法

ワードプレスでブログサイトではない、一般的なサイトを構築する際の手順です。
ブログをオリジナルのデザインに変更したい場合にも応用可能です。

WordPressは、html・cssの基本的なことを理解していれば、PHPをそこまで理解していなくとも、
ちょっと考え調べるだけで簡単にカスタムすることが可能です。

Wikipedia には、

WordPress（ワードプレス）はデータベースにMySQLを利用し、PHPで書かれたオープンソースのブログソフトウェアである。

と書かれています。

しかし、ブログだけではなくワードプレスをCMSとして利用し、
個人的なちょっとしたサイトから、しっかりしたコーポレートサイトまで構築することができてしまうので、
興味はあるけど、「まだワードプレスってよくわからない。」「カスタムしてみたーい！」
という方はこの機会に挑戦してみてはどうでしょう。

僕も勉強中なのもので自分のための覚書として書いたものですが、なにかしら使える内容になっているかと思います。
よりよい作り方などがわかれば、常に変更・修正や追加をしていき、
よりわかりやすく、簡潔な記事にしていきたいと思います。
ですので何か間違いや、説明のわかりにくい所などがあれば、どしどしご指摘下さいな。
どうぞ、生ぬるく見守ってやって下さいな。よろしくお願いします。

今後、各項目ごとの、詳細な説明も随時追加していこうと思っています。
（当方、PHP等のプログラム部分についてはど素人です。その辺りはほとんど理解できていないのでご理解下さい。）
では以下、「ワードプレスでブログサイトではない、一般的なサイトを構築する際の手順」
とても長くなっていますがどうぞー。

① – サイトデザインを作成

■PhotoshopやFireworksなんかのデザインソフトで、トップページ等のデザインを作成。
まずはサイトのデザインを作成します。WordPressに組み込むためにもこれをしないと始まりません。

■html、css等でコーディング、サイトを作成。
後々変更しなくていいように、ここでしっかり作りこんでおくことがとても大事。しっかり作っておかないと後々、めんどうになります。

② – 最新版WordPressをダウンロード

WordPressをダウンロード ≫ WordPress | 日本語

■WordPressのzipファイルを解凍後ファイル名を適当な名前に変更。

例： ファイル名「wordpress」 を 「cms」に変更。
※絶対に変更しないといけないわけではありません。もちろんそのままでもワードプレスは動きます。

③ – ローカルにてwordpressテーマを作成

■XAMPPをパソコンにインストールしていない場合はインストール。
ローカルにて作業するために必要です。作業スピードが数倍早くなるので必須！
●以下参照
WordPress のローカルでの開発環境 ≫ Eclipse PDT + XAMPP で WordPress の開発環境をつくる

■オリジナルのテーマを作成。

① で作成したｈｔｍｌやcssをそれぞれPHPにあてはめていく
サイトのホームページ（トップページ）はhome.phpで作成。
その他、index.php、single.php、header.php、footer.php、sidebar.php、category.php、
style.css等などを作成。
※PHPファイルの保存時は　UTF-8 ボム無し　で保存すること。

メインメニュー（グローバルナビゲーション）となる、navi.phpを作成(名前は何でも良い)表示させたい箇所にインクルードさせる。
はじめはベースとなるテーマを決めて、そのテーマをカスタムしていくのが、構築しやすく良いと思います。
例えば、ワードプレスデフォルトテーマをカスタムしてみては？それと「sandbox」も、おすすめです。

●オリジナルテーマの作成方法やワードプレスのテーマの仕組みは、以下でわかりやすく説明されています。
Wordpress オリジナルテーマの作り方 ≫ オリジナルテーマの作り方 | Webクリエイターボックス

④ – ローカルでの作業終了後、サーバーにアップロード

■WordPressをファイルごとFTP等で、アップロード
ルートディレクトリ(直下)にアップロード、レンタルサーバーを使用している場合は、各サーバーにあわせてインストール
ワードプレスのファイルの中身を全て、ルートディレクトリ(直下)においてもいいがゴチャゴチャになって見づらくなるので、ファイルに入れておいたほうがなんだか気分的にもスッキリ！
※サーバーごとにちょっとした注意や、インストール方法が違う場合があるので、各レンタルサーバーの説明を読んでください。

■インストール後、作成したテーマをアップロード。
WordPressをインストールした、 「 http://www.example.com/○○○/wp-content/themes/ 」　内にアップロード。

■インストール後アップしたサイトを確認。
WordPress管理画面→外観→「テーマ」からアップロードしたテーマが表示されているはずなので、そのテーマを「使用する」をクリック。
WordPress管理画面上部の「サイトを表示」を、クリックしきちんとテーマがアップされていて、デザイン崩れもないかチェック。

⑤ – WordPress管理画面→「設定」より各種設定を済ませる。

■設定 → 一般
ブログのアドレスをホームのページに設定。
サイトのホームページ（トップページ）を http://www.example.com/ のようにするために設定します。
○WordPress のアドレス (URL)　→　ワードプレスのファイルをアップした場所 例:)http://www.example.com/ワードプレスファイル/ のような感じ
○ブログのアドレス (URL)　→　サイトのトップページにしたいところ 例:)http://www.example.com のような感じ
※ここは少し注意しないといけないので後でもかまわない。
※作成したサイトにブログとしてのみ、WordPressを使用する場合はこの設定は必要ありません。

●以下を参照して設定。
サイトのホームページ（トップページ）を変更 ≫ WordPress を専用ディレクトリに配置する

この設定が完了すると、サイトトップページ以下各ページやカテゴリ分け・更新頻度の高いページ（ブログページやニュース、製品情報等のページ）が分けられることになります。
※ここは非常に大事なポイントだと思います。慎重に行うこと。
※このように作成した場合、ブログページの一番上の階層の親ページはcategory.phpになるので注意。
他のカテゴリー分けをしたコンテンツも同じです。
例： ニュースカテゴリは 「category-ニュースカテゴリのID.php」 のように 「category.php」 をベースに作成。

■設定 → 表示設定 RSS/Atom フィードでの各投稿の表示
抜粋のみを表示にチェック。

■設定 → ディスカッション 投稿のデフォルト設定
「投稿中からリンクしたすべてのブログへの通知を試みる」のチェックをはずす。

■設定 →メディア画像
サイズを作成したサイトのコンテンツサイズにはみ出さないよう適当なサイズに変更(横幅に注意)。
このとき、サムネイル、中、大、と画像サイズの縦横比率は同じにしておいたほうが良い。

■設定 → プライバシー
各種検索エンジンに自サイトを検索結果に表示させたい場合は、「ブログを検索エンジン (Google、Bing、Technorati など) やアーカイブも含め、誰にでも読めるようにする」にチェック

■設定 → パーマリンク設定
クライアントが更新するということを念頭におきます。
「カスタム構造に」にチェックし 「/%category%/%post_id%/」 と記述。
日本語URLになりますが、「/%category%/%postname%/」 でもいいと思います。

⑥ – 各種必要なプラグインをダウンロード、インストール・有効化

投稿編集でのエディタは、クライアントのことを考え簡単に更新が可能なビジュアルエディタを使用する。
ということを踏まえ使いやすくなるプラグインを導入するのがよいと思います。

●作成したサイトにブログとしてのみ、WordPressを使用したい場合はこのあたりでほぼ完成です。

⑦ – 必要なカテゴリを作っておく。

更新頻度が高いであろう、コンテンツとなる箇所をカテゴリとして作成しておく。
WordPress管理画面→「投稿」→「カテゴリ」より、カテゴリを作成。
例： ブログやニュース・新着情報、製品情報など。
親レベルのカテゴリはこの時につくっておいたら楽かな。（※後々追加しても問題ない。）

子レベル、例えば、http:/www.example.com/blog/○○○　
のようなブログの子カテゴリのようなものはいつ追加しても全く問題ない。

⑧ – 各ページを作成、会社概要等更新頻度の低いであろう固定ページになります。

■page.phpを複製して各ファイル名をつけて作成
例：　http:/www.example.com/about/ ← このように子階層を「about」にしたい場合は「about.php」で作成（ファイル名は絶対ではなく自分が管理しやすければなんでもよい。）
完成後ファイルをアップロード → WordPress管理画面→「ページ」→「新規追加」より、右サイドにある「属性」→「テンプレート」からアップしたページを選択→　中身を記載後、プレビューして問題なければ投稿。

⑨ – 完成・公開。

これでひとまず完成です。
公開・投稿・更新前にpingの設定をしておきましょう。
その他、注意点や場合によって必要なことは以下。

⑩ – その他

■各ページのデザイン等などの細かいチェック・微調整、修正。

結構なおすところが多いはず。
テスト投稿をして、アーカイブページやカテゴリページ、など隅々までチェック。いろーんなブラウザでもチェック。
プラグインk-taistyleを使用してのモバイル版を作成したらモバイル版もよく確認して修正していく。
●モバイル版のサイトチェックには以下Firefoxアドオンが便利。
Firefoxアドオン ≫ 携帯専用サイトをパソコンで見ちゃえるアドオン User Agent Switcher

■WWWアリとナシの統一

≫ 301リダイレクトを使った「WWWあり」と「WWWなし」の統一

■バージョン脆弱性の問題を考えgeneratorを削除、表示しない。
＜head＞～＜/head＞間に埋め込まれているWordPress バージョン「＜meta name=”generator” content=”WordPress 2.9.2″ /＞」を表示しないようにします。
使用テーマの functions.php の一行目(※おかしな箇所に入れるとエラーになるので気をつけて)に、

<?php
remove_action('wp_head', 'wp_generator');
?>

を記載。これで表示されなくなります。

とりあえず以上です。
どんどん追加・修正・削除していき、わかりやすくまとめていきたいと思います。
ではではー。

↓WordPressでCMSとして一般的なサイトを構築する方法に関するおすすめ本です。