WordPressテーマ「AIDER」でサイトをつくる手順をまとめています。はじめてサイトを作る方でも手順通りに進めていくことでサイトを公開できます。
サイトを立ち上げるまでの流れは、次の8ステップです。
100%完成させてからのサイト公開にこだわる必要はありません。
たとえば税理士事務所のサイト制作であれば、次のコンテンツがあればサイトを公開できます。
最低限必要なコンテンツ
・ロゴ画像 or サイト名
・トップページのヘッダー画像または動画 × 1つ
・アバウトページ（事務所や所長を紹介するぺージ） × 1枚
・サービスページ（取り扱いサービスを紹介するページ アバウトに入れてもOK） × 1枚
・アクセスページ（アバウトぺージに入れてもOK） × 1枚
【STEP 1】WordPressの導入
WordPressでサイトをつくるには、住所（ドメイン）・土地（サーバー）が必要です。
以下の順番で進めていきましょう。初めてで悩む時間を含めるとしても、1日あれば準備できるはずです。
- ドメインを取得
- サーバーを契約
- WordPressのインストール
STEP 1-1. ドメインの取得
ドメインとはインターネット上の住所です。「test-site.com」のようにあなたのサイトの住所（URL）を最初に決めましょう。
STEP 1-2. サーバーの契約
サーバーとは、インターネット上の土地です。月額数千円程度でレンタルするのが一般的です。
STEP 1-3. WordPressの簡単インストール
ほとんどのレンタルサーバーで、WordPressの簡単インストール機能が搭載されています。
下記記事で「エックスサーバー」「さくらのレンタルサーバ」の簡単インストール手順を解説しています。
WordPressの簡単インストールの作業自体は、1分ぐらいで終わります。
SSL化
WordPressを無事インストールできたら、SSL化という作業も最初に済ましておきましょう。
SSL化とは
Webサイトとそれを閲覧するユーザーの通信を暗号化する仕組みです。単にサイトのセキュリティ強化だけでなく、ユーザーに安心して訪問してもらうためにも必要です。
こちらもサーバー側で設定できますので、サーバー契約時に行なっておくとスムーズです。詳しい手順はこちらで解説しています。
【STEP 2】初期設定
WordPressのインストールが終わり、管理画面（ダッシュボード）にログインしたら、次の3つの作業を行います。
- テーマのインストール
- 表示設定（ボタンを押すだけ）
- プラグイン「TCDクラシックエディタ」のインストール
❸では、テーマを有効化すると、以下のメッセージが表示されます。ボタンをクリックして、「TCDクラシックエディタ」プラグインのインストール・有効化を済ませておきましょう。
ここまでは「AIDER」をお使いいただくために必須となる設定です。
余裕があれば、次の記事にある設定も済ませておくといいでしょう。できるものだけでもOKです。
【STEP 3】サイトの基本設定
まずはサイト全体に反映される基本設定を行いましょう。サイトのベースとなるカラー・フォント（字体）などを設定します。上記は、アクセントカラーを変更したサンプルです。当デモサイトと比較すると、雰囲気が変わることがわかります。
設定順の指定はありません。項目名をクリックして詳しい設定方法をご覧ください。
| アクセントカラー | サイト全体で使用するアクセントカラーを設定します。 |
| フォント | サイト全体のフォントタイプやフォントサイズを設定します。 |
| ロゴ | ロゴ（画像もしくはテキスト）を設定します。 |
| アイキャッチ | カーソルを合わせたときの画像アニメーションなどを設定します。 |
| SNS | SNSシェアボタンや、フッターのSNSリンクを設定します。 |
一度仮で設定しておいて、最後にサイト全体を確認しながら微調整するのがオススメです。
【STEP 4】下層ページ
各投稿タイプ（ページ作成機能）のエディタで「下層ページ」を作成します。WordPressの各投稿タイプとその使い分けについては以下の記事をご覧ください。
AIDERに搭載されている投稿タイプをご紹介します。
↓設定方法は、項目名をクリックしてご覧いただけます。
| ページ作成機能名 | 用途・目的 |
| 投稿 |
ブログやコラムなど、集客用の記事を書きたい。 >> エディタの使い方（各投稿タイプ共通） |
| お知らせ | 最新情報などを告知したい。 >> お知らせページの作成方法 |
| サービス | 取り扱いサービスを紹介したい。 >> サービスページの作成方法 |
| お客様の声 | お客様の声を紹介したい。（サービスと連動可） >> お客様の声ページの作成方法 |
| 固定ページ「デフォルト」 （当ぺージ） |
時系列がない独立したページを作りたい。 >> 固定ページ「デフォルト」の使い方 |
| 固定ページ「タブページ」 | 会社案内(親)と代表メッセージ・会社概要・アクセス(子)のように、親子関係にある固定ページを表示したい。 |
| 固定ページ「ランディングページ」 | 広告出稿用のLPを作りたい。 |
用途・目的に合わせて設定しましょう。すべて使う必要はありません。税理士事務所のサイトであれば、サービスページとアクセスぺージだけでも作成しておくとよいでしょう。もちろん後から拡張可能です。
【STEP 5】トップページ
トップページは、「ヘッダーコンテンツ」「メインコンテンツ」で構成されています。
【STEP 4】で作成した下層ページへの導線を考えて作成しましょう。デザインされたコンテンツも画像やテキストを入れるだけで設定できます。コンテンツの追加や並び替えも簡単に行えます。
【STEP 6】メニュー
作成した下層ページを「メニュー」として登録してヘッダーやフッターに表示させましょう。
外観 > メニューから登録できます。
メニューの詳しい設定方法はこちらの記事を参考にご覧ください。
メニュー項目は、多すぎても少なすぎても良くないです。
・少ない場合は、メニューに登録できる下層ページを充実させる。
・多い場合は、子メニューで階層化したりメガメニューを活用して整理する。
そうすることで、訪問者に親切なだけでなくサイトのクオリティがアップします。
【STEP 7】ヘッダー・フッター
【STEP 6】でメニューを登録できたら、ヘッダー・フッターに関する設定を行います。
↓項目名をクリックして設定方法を確認してください。
それぞれ設定時のコツがあります。ロゴのサイズ感、メニュー項目の多さ、文字量のバランスなど。下記記事も参考に設定してみてください。
>> ヘッダーバーでやってはいけないこと5選
>> フッターの役割、やってはいけないこと
【STEP 8】ウィジェット
PC時の投稿・お知らせ・固定ページのサイドバー、スマホ時のフッター上に、外観 > ウィジェットで設定した「ウィジェット」を表示できます。
WordPressにはあらかじめ複数のウィジェットが搭載されていますが、LAGALでは「お客様の声スライダー」など、オリジナルウィジェットを用意しています。こちらの記事も参考にご覧ください。
ウィジェットは、各記事への導線となる重要なコンテンツです。下層ページが充実してきたら、サイト内の回遊率を上げるためにも積極的に登録しておきましょう。広告スペースとしても活用できます。
【完成！】定期的な更新を継続しよう
サイト完成です。お疲れ様でした！
初めてサイトを制作する際は、以下を参考にしてみてください。後からいくらでも拡張できるので、まずは小さく始めて全体像を形にすることが重要です。
- ロゴ（もしくはサイト名）の見え方が綺麗か確認する。
- アバウトページ・サービスぺージを確認する。
- ヘッダーメニューのリンク先、項目数を整える。
さらに完成度を高めるためには、当デモサイトを参考に調整してみてください。下層ページを追加して導線を設けることで、サイトが拡張されていきます。
デモサイトや完成したサイトを「追加できるコンテンツは無いか」「不足している情報を無いか」というポイントで見直してみましょう。気付いたことを変更したり、定期的に更新することで「活きたウェブサイト」になりクオリティも上がっていきます。
項目ごとに設定方法を確認したい方は、「設定マニュアル」からご覧ください。
高度な設定
よりハイレベルなサイトを目指す場合は次の機能もぜひご活用ください。
| 設定・オプション名 | 用途・目的 |
| バナー | サイト内各所で呼び出せる「バナー」 |
| 汎用クラス | 余白・改行位置等の細部の微調整 |
| SEO | metaタグ・OGPの設定 |
| 404・検索結果ページ | 404・検索結果ページのカスタマイズ |
| 保護ページ | パスワードつき保護ページのカスタマイズ |
| ロード画面 | ページ読み込み中のロード画面設定 |
| カスタムCSS・スクリプト | CSSを用いた調整、トラッキングタグ埋め込み |
| ユーザープロフィール | ユーザー（サイト運営者）プロフィールの登録・公開 |
| ユーザー一覧ページ | ユーザー（サイト運営者）プロフィールの一覧表示 |
| 子テーマ | テーマファイルをカスタマイズされる方向けに、子テーマを配布しています。 |
長期的かつ本格的なサイト運営にはSEOの知識も必要になってきます。TCDが15年間のサイト運営で培ったSEOに関する知識はこちらからご覧ください。