WordPressというと、当ブログのように既存のブログテンプレートをインストールして、色みの設定やロゴ画像の設定をしたら存分に使える便利な子。
ですが。
そんなWordpressをブログとしてではなくコーポレートサイトのようなWebサイトとして用いるとき、とりわけ他人が作った美麗デザインをもとに構築するときはまた勝手が違うものです。
そこで、そんなデザインガッチガチ美麗サイトを構築するときの手順をまとめてみました。
WordPressを制作環境にインストールする
新規製作時なら公開用サーバー、それ以外のときはLocalのようなローカル環境か、テスト用サーバーに、Wordpressをインストールします。
1.データベースを作る
2.Wordpressのファイルを設置
3.Wordpressのインストールと初期設定
ベースとなるブランクテーマを設置
デザインが特定のテンプレートを模しているとき以外は、HTML5 Blankのような、css設定が最低限しかされていないテンプレートを使う方が干渉されなくてよい。
構築に便利なプラグインのインストール
機能構築
お問い合わせフォーム：MW WP Form
カスタム投稿タイプ：Toolset Types
パンくずリスト生成：Breadcrumb NavXT
制作中のお助け
投稿機能のチェック用の記事複製：Duplicate Post
画像差し替えにめげない：Enable Media Replace
お問い合わせフォームについては、Contact Form 7も使いやすいが、確認画面の実装を求められた際に使うContact Form 7 add confirmがContact Form 7の更新に追いつけないでいるため、最新版のプラグインで不具合が出る場合がある（2017.10現在）ため、MW WP Formを推奨する。
制作中の確認やお助け用のプラグインは、制作完了時に消しておくこと。
html／cssの構築
wordpressの設置ができたら、または設置しながら、htmlとcssの構築を始める。
いきなりwordpressテーマ化してもよいが、ヘッダー・フッター・コンテンツの３つにコードを分ける感覚をつかむためにhtmlでトップページと他ページの基準となる１ページ、計２ページはhtmlで製作することをお勧めする。
html／cssをWordpress化
作成したhtmlを、header.phpとfooter.php、そしてfront-page.php（トップページ）、page.php（固定ページのフレーム）などに、
また、
画像：themes/テーマ名フォルダ内にimgフォルダを作って格納
jsとかcss：themes/テーマ名フォルダ内にcssとかjsフォルダを作って格納（テーマ名を入れるcssはテーマ名＋wordpress用の基本的なcssしか書いてない感じ）
固定ページの情報入力
求められていたページの姿になるように一生懸命入力。
投稿機能・お問い合わせフォーム構築
最初にインストールしたプラグインを使ってちょうせい。
コメント