#4 WordPressでwebサイトを作るときに最初にするべき10ステップ（SWELL使用）

こんにちは、webデザイナーの祥子です。

今回は、WordPressでwebサイトを作る方必見！
最初にしておくべき設定10ステップをお伝えします。
この情報は、巷に溢れるようなものではありません。
実際に私が４年間失敗と改善を重ねて辿り着いた
私にしか提供できないものです。
見終わった後には、完全にwebサイトを作る準備が
整った状態になれるので、
ぜひ動画を最後までチェックしてくださいね。

（25秒）

①テーマインストール

ステップ１、テーマをインストール。
今回のテーマはSWELLを使っていきます。

SWELLのフォーラムにログインし、
親テーマと子テーマをまずはダウンロード。

ここで注意点を２つ。

注意点１つ目、
テーマを入れる時は必ずZIPファイルです。

MacのSafariではダウンロードすると、
自動的に解凍されるように初期設定ではなっています。
なのでSafariの設定を自動解凍しないようにしておくか、
もしくはダウンロード後に「圧縮」しましょう。

ちなみにWindowsでは
ZIPファイルのままダウンロードできるので
特に問題ありません。

親テーマ、子テーマの圧縮ファイルを準備できたら
WordPressのダッシュボードへ。
「外観」→「テーマ」→
「新しいテーマを追加」→
「テーマのアップロード」に進み、
ここにZIP形式のファイルをアップロード。

親テーマをインストールすると
「SWELLのユーザー認証が完了していません。」
というアラートが出るので、
このアラートをクリックして
案内に沿って認証作業をしてください。

同じ要領で子テーマもインストール。

ここで注意点２つ目。
有効化するのは必ず子テーマ。

なぜなら
親テーマを有効化してカスタマイズを進めてしまうと
悲劇が起きるからです。
テーマがアップデートされた時に
変更内容が上書きされてしまい、
せっかく設定したカスタマイズが
消えてしまう恐れがあります。

なので、子テーマを有効化しておくことで
親テーマがアップデートしても、
子テーマのカスタマイズはそのまま保てます。

私は独学でやっていた当初、
テーマに子どもがいるなんて
そもそも知りませんでした。
「あれ？なんでまた元に戻ったんだろう？」
と迷宮入り。

みなさんはこんな私の失敗を辿らないためにも
テーマには親子がいることを知っておきましょう。

使いたいテーマを無事にインストールできたら
最初に入っていたテーマはもう不要。
セキュリティの面からも
使っていないテーマはアンインストールします。

その方法は簡単。
外したいテーマを選び、「削除」をクリック。

たったの２クリックで完了です。

②プラグインを一気に入れる

ステップ２、使うプラグインを一気に入れる
プラグインは次の４点を注意してください。

注意点１つ目、必要最低限にする
セキュリティの面でも速度の面でも、
入れるプラグインは最低限にしておきましょう。

注意点２つ目、テーマとの相性を確認する
テーマとの相性が悪いと、
色んな形でエラーが起きる危険性があります。
ちなみに私の実体験としては、
SWELLと相性が良くない
エレメンターというプラグインを
入れてしまったことがあり
見事にデザイン崩れが発生。
テーマとの相性は甘く考えてはいけません。

じゃあどうやって相性を確認するのか。
その方法は次の３つ

（相性の確認方法）
①　公式サイトにある相性情報を確認する
SWELLの場合は推奨プラグイン、
非推奨・不要・注意すべきプラグインを
公式で教えてくれています。

（相性の確認方法）
②　他のSWELLサイトで使われているか確認する
公式サイトで紹介されていないプラグインの方が
圧倒的に多いです。
その場合は、
「SWELL　＋　プラグイン名」でググりましょう。
有名なプラグインの場合は使い方の紹介記事があるはず。
そのサイトでSWELLが使われていれば、
ひとまず大きな問題はなさそうという検討がつきます。
ちなみに、紹介記事が出てこないような
マニアックなプラグインはそもそも使わない方が無難。

プラグイン一覧でこのように表示されるので、
「⭐︎の数」、「有効インストール数」、
「最終更新」、「使用中のWPバージョンと互換性あり」
ここの４項目は必ずチェック。
中には、このように
更新がしばらくされていないものや、
エラー表示が出ているものもあります。

（相性の確認方法）
③　テストサイトを作って確認する
石橋を叩いて渡りたい方は、
相性テスト用のサイトを作って、
色々試してみましょう。
ちなみに私はサブドメインでテストサイトを作って
実際にチェックしています。
でも正直、ここまでしなくてもいいかな…とは思いますが
私は一度痛い目にあったのでこうしています。

このような方法で相性を確認できるので
できるだけリスクをなくしてから
プラグインを入れるようにしましょう。

注意点３つ目、おすすめされるがままにインストールしない
これ、かなりあるあるです。
私も最初に作ったブログでは
おすすめされたものを片っ端からインストール。
最終的に
どれを実際に使っているかさえわからない。
気づいたらアンインストールしたくてもできない
最悪の状態に陥っていました。

ただ、残念ですがこれは私に限った話ではありません。
WordPressを手探りで自分で作ってみたクライアントさんや、
私の生徒さんでも全く同じ現象が見られます。

かなりあるあるなことなので、
これからWordPressで
サイトを作ろうとしている皆さんは
くれぐれも注意してくださいね。

おすすめされたからと言って
無闇に入れるのではなく、
ちゃんとそのプラグインの役割を理解し、
本当にサイトに必要かどうか
インストール前に一呼吸おきましょう。

注意点４つ目、自己責任
おすすめされたから入れたものの、
エラーが起きても誰も責任をとってはくれません。
完全に自己責任で進めましょう。

このような注意点を頭に入れていただいた上で、
私がサイト制作する時に使っているプラグインの一例がこちら。

バックアップ→BackWPup
コンタクトフォーム→WPForms Lite
スパム対策→Advanced Google reCAPTCHA
アクセス解析→Slimstat Analytics
画像圧縮→TinyPNG
迅速なインデックス→WebSub

また、SWELLを使う上で
「SEO SIMPLE PACK」は必須です。

このようにプラグインのご紹介はしましたが、
何度も言いますが
おすすめされたから入れるのはちょっとストップ。
ご自身でも調べた上で
使えそうと判断したら
自己責任で使うようにしてくださいね。

③サイトのタイトル設定

ステップ３、サイトのタイトル設定
web検索をした時にヒットさせたいワードって
みなさんありますよね。
そのワードを組み合わせて、
サイトタイトルとキャッチフレーズに入れていきます。

設定する場所はこちら。
ダッシュボードの「設定」→「一般」を開いた場所。

もしくは、「外観」→「カスタマイズ」から
カスタマイザーを開いて
一番上にある「WordPress設定」→「サイト基本情報」。
ここからも変更可能です。

ヒットさせたいワードは１つに絞る必要ありません。

何個かを組み合わせて、
なるだけ守備範囲を広げておきましょう。
実際、検索ワード１つでヒットすることはほぼ稀です。

おすすめの方法は
「キーワードプランナー」や、
「aramakijake（アラマキジャケ）」、
「ラッコキーワード」などのサイトで
検索ボリュームをチェックし、
狙いをつけていきましょう。

④パーマリンク設定

ステップ４、パーマリンク設定。

「設定」→「パーマリンク」に進み、
「投稿名」にチェック。

Googleもパーマリンクに投稿名を含めることを
推奨しています。

パーマリンクとは、ページが公開された時のURLのこと。

設定を「投稿名」にすることで、
ページタイトルが自動的にそのままURLになります。

ここでも注意点が一つ。

日本語がURLの文字列に含まれることは
好ましくないので
ページを作成後は必ず
アルファベット表記になるように変更しましょう。

⑤メタ情報を消す

ステップ５、メタ情報を消す。

「はて？メタ情報？」
ちょっと聞きなれない言葉ですよね。

メタ情報とは、
ページや投稿などのコンテンツに関連する
追加情報のこと。
これはサイト管理者の為のものであって、
読者には不要です。

むしろ見せるべきではない情報。

サイトへのログイン情報が漏れることになるので
不正アクセスの原因になる恐れがあります。
セキュリティの観点からも、
メタ情報は必ず削除しておきましょう。

削除の仕方は簡単。
ダッシュボードの「外観」→「ウィジェット」に進み

「利用できるウィジェット」の中から
「メタ情報」を探します。
下の方にある「使用停止中のウィジェット」に
ドラッグ&ドロップ。
これだけで完了です。

⑥カテゴリー設定

ステップ６、投稿カテゴリーの設定

投稿記事のカテゴリーは予め、
ある程度決めておくことをお勧めします。

ダッシュボードの
「投稿」→「カテゴリー」から、
「新規カテゴリーを追加」をクリック。
webサイトの場合は、
「お知らせ」や「お客様の声」「事例紹介」などが多いです。

webサイトを運営するにあたり、
クライアントさんご自身で更新していきたいのは
どんな部分かを予め握っておきましょう。
人によっては
「記事も積極的に増やしていきたい」場合もありますし
記事は書かずに
「事例やお客様の声だけを増やしていきたい」
というケースもあります。

クライアントさんが少しでもストレスなく
サイト運営していけるためにも
細かいですが、カテゴリーは先回って設定しておきましょう。

というのも、これも私の失敗体験から来ています。

初めて運営したブログで
記事を作っては新しいカテゴリーをその都度作ってしまい
後から見ると、類似したカテゴリーを大量生産。
サイトのテーマから外れた記事を
生み出してしまったことも多々あります。

これもよくある「失敗あるある」。
みなさんには私のしくじりを活かしていただきたい。
ご自身、もしくはクライアントさんが
私と同じ失敗をしないためにも
最初にカテゴリーを設定して、
記事作成迷子にならないように
予防することを本気でお勧めします。

⑦固定ページ作成

ステップ７、固定ページ作成

必要なページを先に準備しておくと、
全体像が掴みやすくなります。
サイトを作る前には
ある程度の設計図を作成しましょう。
ちなみに私は普段からよく使っている
マインドマップで骨組みを用意し、
これに沿って必要なページを作っています。

例えばこのようなサイトの場合。
用意する固定ページは
「フロント用のページ」、「わたしたちについて」
「社長挨拶」「会社概要」「事業内容」「設備・工場」
「採用情報」「お問い合わせ」
「プライバシーポリシー」。

ページの内容は後から作りこんでいけばいいので
まずは、全体像の型を作っておくと
後々作業しやすくなりますよ。

⑧フロントページの表示設定

ステップ８、フロントページの表示設定

最初の状態ではこのように、
記事の一覧が出るような設定になっています。

WordPressは元々ブログ用の
プラットフォームとして開発されました。
2003年のリリースから、どんどん機能が拡張され、
今では世界で一番使われているCMS（コンテンツ管理システム）です。
元々がブログ用だったこともあって
デフォルト設定ではブログの状態。
webサイトとして使うためには、
このフロントページを設定する必要があります。

ダッシュボードの「設定」→「表示設定」を開き、
「ホームページの表示」を「固定ページ」に変更。
そして「ホームページ」のプルダウンから、
先ほど作った「フロント」というタイトルの
固定ページを選びます。
今後フロントページを作り込んでいく時は
ここで設定したページを編集していきましょう。
ちなみにタイトルは
必ずしも「フロント」にする必要はなく、
ご自身がわかりやすいタイトル名でOKです。

⑨メニュー作成

ステップ９、メニュー作成。

グローバルナビと
フッターメニューを作成しましょう。

「外観」から「メニュー」に進みます。
メニュー作成ができる画面に移ります。
メニュー名に「グローバルナビ」と入力し、
「メニュー設定」で「グローバルナビ」にチェック。

ここにメニュー項目を入れていきます。

先ほど作った固定ページをドラッグ&ドロップで追加。
順番も、簡単に入れ替え可能。
「わたしたちについて」のさらに下に
「社長挨拶」と「会社概要」を入れたい場合は、
少し右にずらすと、階層にすることができます。

グローバルナビができたら、
次にフッターメニューも作っていきましょう。

２つ目以降のメニューを作る時は、
こちらの
「新しいメニューを作成しましょう」をクリック。
先ほどと同じように
「メニュー名」に今度は「フッター」と入力して
メニュー設定で「フッター」にチェック。

ここで、
フッターに入れたい下層ページを選びましょう。
今回は「会社概要」「プライバシーポリシー」
「お問い合わせ」を入れます。

これでグローバルナビとフッターができたので
サイトを見てみましょう。

ヘッダー部分にナビが入りましたね。
スマホサイズにすると、このように同じ内容がハンバーガーメニューで出てきます。

そしてフッターにも、ちゃんと反映されています。

これでひとまず、メニュー設定は完了です。

10　サイトアイコン

ステップ10、サイトアイコン。

カスタマイザーを開き、
「WordPress設定」「サイト基本情報」に進むと
「サイトアイコン」という項目があるので、
ここにアイコンを設定します。

正方形で作り、512✖️512ピクセル以上で作りましょう。

ここでもついでに、私の失敗談ですが
アイコンを薄い色で作ってしまうと
web上で一覧表示された時に
埋もれてしまいやすいです。
私も作り替えようと思いますが、
ハッキリした色合いで、
デザインがあまり複雑ではない方がおすすめです。

エンディング

これでWordPressの土台はバッチリ！

ただ、この先制作を進める中で
「あれ？これはどうすればいいんだろう？」
という壁は必ずいつかやってくるもの。

そんな壁も、私とだったら一瞬で撃破できます。
これから私と一緒に
WordPressでのサイト制作を
完全攻略していきたい方は、
概要欄のリンクをタップ。
私の公式LINEとお友達になってください。

今なら、WordPressで
月収30万円を稼ぐロードマップをプレゼント中。
また、サイトをオシャレにするCSSレシピ、
効果を最大化するwebサイトの解説動画も
限定配信しています。
さらに、今だけ無料で
個別カウンセリングも行っています。
お悩みを解決して、
今後のプランニングを一緒に考えていきましょう。

まだの方は必ずチェックしてくださいね。
今日も最後までご覧いただきありがとうございました。
またね〜。

（14分）

没ネタ

以下は次回分に分ける。

11　OGP画像

※ステップ１１は次回の方に回していいかも※

ステップ11、OGP画像

「OGP画像とは？」

簡単にいうと、webサイトのリンクがシェアされた時に表示される画像のことです。

「SEOシンプルパック」というプラグインで設定します。

ダッシュボードの「SEO PACK」の中にある「OGP設定」に行きます。

ここで、「画像を選択」をクリックし、お好きな画像を選びます。
メインビジュアル画像が完成した後から設定しても大丈夫です。

12　よく使うCSS

13　SWELL設定

14　カスタマイズ設定

没ネタ

今回は、SWELLを使ってwebサイトを作っていく時に
最初にしておく設定をお伝えします。

SWELLはブログ向けテーマなので、
デフォルトではかなりブログ向けに設定されています。

実際に私の周りでも
「SWELLをインストールしたものの、どうやってwebサイトにしていくかわからない」
「何から手をつければいいかわからない」
「機能が多すぎてどれが必要なのかわからない」

このような声をよく聞きます。
今日の動画では、こうした悩みを解決していきます。
見終わった後には、webサイトを作る準備が整った状態になれるので、動画を最後までチェックしてくださいね。