WordPressでホームページを作りたいけど、難しそうな気がして自分にできるか不安。
少し調べてみると、レンタルサーバーやドメインが必要らしいけどよくわからなくて....
何から手をつければいいでしょうか。
こんなお悩みを解決する記事です。
WordPressはSEOに強いため、あなたが作ったホームページが検索で上位に表示されやすく、ホームページを作成する上で世界中のユーザーに選ばれているシステムです。
しかし初心者の方は「WordPressでのホームページ作成は難しそうだ」と感じ、使用するのをためらっている方も多いことでしょう。
この記事では、はじめての方でも挫折せずにホームページが完成できるように、操作方法などを画像付きで解説しています。
ぜひ、この記事に書いている通りの手順でホームページの作成を行ってみて下さい。
早速、WordPressでホームページを作る流れを確認していきましょう。
7ステップに分けて解説します。
ホームページが作れる7ステップ
step
1ドメインとサーバーの申込みとWordpressのインストール
step
2Wordpressの初期設定
step
3ホームページのデザインを選ぶ
step
4掲載内容を作成する
step
5固定ページを作成する
step
6サイト全体の配置を整える
step
7プラグイン を活用する
もくじ
WordPressでホームページを作る際の基礎知識
ワードプレスでホームページを作りにあたって、基本的な仕組みを簡単に解説します。
仕組みがわかれば、ホームページを作るために必要な準備物など理解しやすくなります。
ホームページが表示される仕組み
ホームページが表示されるには、まずブラウザでURLを入力して、ホームページのデータが置かれている「サーバー」を検索する必要があります。
サーバーには様々なウェブサイトのデータが保存されています。
サーバーに保管されているデータがパソコンやスマホで表示される仕組みです。
そのためホームページを作るためには「サーバー」と「URL(ドメイン)」が必要なのです。
サーバーはレンタルサーバーを申し込めばOK
サーバーが必要と言っても、何か自分で機械を購入して設定するわけではありません。
月額数百円でサーバーをレンタルできるサービスがあるので、それを利用します。
レンタルサーバの申込方法も下で解説しています。
ドメイン(URL)を取得する
レンタルサーバーを申し込んだら、次はホームページのドメイン(URL)を取得します。
例えば、このブログサイトのドメインは
赤字の部分がドメインになります。
このドメインは自由に選ぶことができるので、お店の名前や会社の名前など、あなたのホームページの内容にあったドメインにしておけば安心感と信頼度が上がります。
1.ドメインとサーバーの申込みとWordpressのインストール
まずはインターネット上での自分のホームページの住所となる「ドメイン(URL)」とホームページのデータを保存しておく場所となる「サーバー」を準備をしていきます。
エックスサーバーの「クイックスタート」というやり方を使えば10分程度で簡単に作れますので、ご安心下さい。
サーバーの申し込みをする
まずは以下リンクからエックスサーバーの公式サイトににアクセスします。
▶︎エックスサーバー
※クリックするとエックスサーバー の公式サイトに飛びます。
「お申し込みはこちら」をクリックして、案内に沿って手続きを進めていきます。
契約内容の入力画面に移りますので、以下スクショのとおり進めていきます。
プランは「X10」「X20」「X30」と3つの選択肢がありますが、個人のブログやサイトであれば一番値段の安い「X10」のプランを選べばOKです。
※プランは後で変更することも可能です。
契約期間は長ければ長いほど、料金が割安になります。
ドメインを選択する
お好きなドメイン名を入力します。
ドメインとは?
インターネット上の「住所」だと考えてください。
当ブログの場合は「toyyy.com」という住所(ドメイン)を取得したので、ネット上の住所は「https://tonyyy.com/」となります。すなわち、ドメイン取得とはあなたのブログURLの「https://tonyyy.com/」この青文字の部分を決めることを意味します。
ドメイン末尾はどれがいい?
ドメインの末尾をみると「.com」「.jp」「.net」「.xyz」などいろいろあるのでどれを選べばいいのか迷うかもしれません。結論はどれを選んでも問題ありません。ドメインの末尾によってブログの検索順位が下がるなど、結果に影響が出ることはないので安心してください。特にこだわりがなければ最も安心感がある「.com」もしくは「.jp」を選ぶのが無難です。
WordPress情報を入力する
入力内容
- ブログ名:お好みのブログ名を入力
- ユーザー名:ログイン時に使用するユーザー名
- パスワード:ログイン用パスワード
- メールアドレス:普段使っているメアドを入力
※ブログ名はいつでも変更できますので、適当に仮の名前を入れておけばOK
※ユーザー名とパスワードはログイン時に必要なのでメモしておきましょう
登録情報を入力する
上図のとおり赤枠の部分を全て入力していきます。
入力完了したら「次へ進む」をクリックします。
登録内容を確認します
入力した情報に間違いがなければ「SMS・電話認証へ進む」をクリックして次に進みます。
認証を行う
上図のとおり電話番号を入力して「認証コードを取得する」をクリックします。
受信した認証コードを入力して認証されれば、完了となります。
設定完了のメール通知を受信する
【xserver】■重要■サーバーアカウント設定完了のお知らせというタイトルのメールが届きます。
メールにはWordPressログインURLなどが記載されています。
これでブログの立ち上げが完了です。お疲れ様です!
2. WordPressの初期設定
サーバーとドメイン、WordPressのインストールまで準備が整いました。
いよいよWordPressを使ってホームページを作っていくのですが、その前に必要な初期設定をします。
WordPressの管理画面へのログイン方法
まず、ワードプレスの管理画面にログインします。
WordPress管理画面のURL
https://サイトのURL/wp-admin/
(例. https://tonyyy.com/wp-admin/)
管理画面のアクセスしたら、以下のようにログイン画面が出ます。
ホームページの名前とキャッチフレーズを設定する
ホームページは、わかりやすい名前と「どんなサイトなのか」が一言でわかるようなキャッチフレーズを設定します。
❶管理画面の「設定」にマウスポインターを合わせます。
❷「一般」をクリックします。
❶ホームページの名前を入力します。
❷キャッチフレーズを入力します。
❸画面左下にある「変更を保存」をクリックします。
これで、ホームページの名前とキャッチフレーズの設定は完了です。
パーマリンクは最初に設定しておく
設定を後からでも簡単に変更できるのがWordPressの特徴ですが、中には最初に決めておかなければ、後からの変更が難しいものもあります。それが「パーマリンク」の設定です。
パーマリンクとは
パーマリンクとはWordPressで作成した投稿のURLのことです。
初期設定は「http://〇〇◯.jp/?p=記事番号」という形式になっているので、意味のない数字の羅列が投稿のURLになってしまいます。
作成した日付や投稿のタイトルをURLに含めた方が、訪問者にとっては投稿の内容が伝わりやすくなります。
例:
http://tonyyy.com/?p=2023/
初期設定では意味のないURLになってしまう。
http://tonyyy.com/wordpress-beginner/
投稿のタイトルを含めると投稿の内容が伝わりやすい
後からパーマリンクを変更してしまうと、webページのURLが変更されてしまい、他の場所でURLを紹介していたり、リンクが貼られていた場合に、アクセスができなくなってしまいます。
よってパーマリンクの設定は最初に行うようにしましょう。
❶管理画面の「設定」にマウスポインターを合わせます。
❷「パーマリンク設定」をクリックします。
ここでは[投稿名]をパーマリンクとして設定します。
❶「投稿名」をクリックして選択します。
❷「変更を保存」をクリックします。
Webサイト(ホームページ)を更新する操作方法
設定を変更した後やサイトを更新した後に、実際どのようにネット上で公開されているのかを確認することができます。ここでは管理画面とサイトの表示の切替え方を覚えましょう。
「更新」→「実際のサイトの表示を確認」を繰り返すのが、サイト更新作業の基本的な流れです。
❶Webサイト名にマウスポインターを合わせます。
❷「サイトを表示」をクリックします。
そうすると以下のように公開中のWebサイトが表示されます。
Webサイトから管理画面に戻る方法
❶Webサイト名にマウスポインターを合わせます。
❷「ダッシュボード」をクリックします。
そうすれば以下のように管理画面に戻ります。
ホームページはこまめに確認しましょう
「更新」したら「確認」を忘れないようにしましょう。
実際のページが思っていたのと違った!ということはよくあります。
3.ホームページのデザインを選ぶ
WordPressの初期設定が終わったら、次はホームページのデザインを設定していきます。
WordPressでは「テーマ」と呼ばれる完成されたデザインのテンプレートがたくさんありますので、作りたいホームページのイメージにあったテーマを選ぶだけです。
WordPress初心者は無料テーマと有料テーマどちらを使うべき?
テーマには無料のものと有料のものがあります。
無料と有料を比較すると、一番大きな違いは有料テーマにはSEO対策が組み込まれていることです。
SEOとはあなたのサイトがgoogleの検索で上位表示されやすくなるという意味です。
上位表示されると、それだけホームページを訪問する人が増えます。
検索上位を狙ってより多くの訪問者を集めたい!という方なら有料テーマを使うと良いです。
SEOに強い有料テーマを以下の記事にまとめていますので、テーマ選びの参考にしてください。
-
【最新版】SEOに強いWordPressテーマ5選【ブログで稼ぐ】
「テーマ」をインストールする
この記事では、初心者でもお店や会社のホームページを簡単に作ることができる「Lightning」という無料テーマを使ってホームページ作成を解説していきます。
まずは管理画面から
❶「外観」にマウスポインターを合わせます。
❷「テーマ」をクリックします。
そうすれば以下の画面に切り替わります。
❶「新規追加」をクリックします。
❶右上の検索ボックスに「Lightning」と入力して検索します。
❷「インストール」をクリックします。
インストールが完了したら、以下のように「有効化」というボタンをクリックします。
これで、Lightningテーマの設定が完了です。
Lightning以外のテーマもたくさんあり、同じ手順でインストールできます。
-
【最新】アフィリエイトにおすすめのWordPressテーマ6選【収益化しやすい】
4.掲載内容を作成する
今度はホームページにどんな情報を掲載するかコンテンツを考えていきましょう。
どんなページが必要がをリストアップする
まずはどのようなページが必要かを書き出していきます。
お店のホームページであれば、どんなお店なのか、営業時間や住所がわかるページが必要でしょう。さらに商品のギャラリーやイベントなどの情報も載せた方がいいなどの意見もあるでしょう。
リストアップしたら、以下のようなツリー構造でホームページの構成を考えていきます。
どんなWebサイトでも構造はこのようにツリー構造になっています。
「投稿」と「固定ページ」の使い分け
ホームページのコンテンツを充実させるために、WordPressでは「投稿」と「固定ページ」の2つの機能を使い分けてコンテンツを作成していきます。
「投稿」の機能と用途
「投稿」の機能を使ってページを書いた場合、ページが時系列で整理されます。
以下のように最新の投稿が一番上にくるように積み上げられます。
なので、ブログやお知らせ記事のような頻繁に情報更新がされるページは「投稿」で作成すると良いです。
「固定ページ」の機能と用途
お店の情報、住所や地図など滅多に情報が変更されないページは「固定ページ」を使って作成すればホームページの決まった場所に情報を表示しておくことができます。
「投稿」機能でページを作ってみよう
実際に作ってみて覚えましょう。
❶「投稿」にマウスポインターを合わせます。
❷「新規追加」をクリックします。
「タイトルを追加」をクリックし、以下のように投稿のタイトルを入力します。
次に「文章を入力、または/でブロックを選択」クリックします。
❶本文を入力します。
❷「プレビュー」をクリックすると実際のウェブ上での表示を確認できます。
❸「下書き保存」をクリックします。
❶「文書」をクリックします。
❷「パーマリンク」をクリックします。
自動的に投稿のタイトルがパーマリンクに追加されているので、英文字に変更します。
日本語のパーマリンクの場合、リンクをSNSやネット上に貼るとき文字化けする可能性があるので、英文字のパーマリンクに変更してください。
❶英文字のパーマリンクを入力します。どんな英文字でもOKですが、ページの内容を表す英語にするのがおすすめです。
❷「公開する」をクリックします。
「公開」をクリックすると投稿がネット上に公開されます。
画像の挿入や文字の装飾のやり方を解説
本文中に画像を入れたり、強調したい文章は文字色を変えたりなど装飾を加えることで、より読みやすいページを作ることができます。
画像の挿入方法
❶ブロックの追加をクリックする。
❷一般ブロックをクリックする。
❸画像をクリックする。
そして、下の画像のように「アップロード」をクリックします。
❶挿入したい画像を選択します。
❷開くをクリックします。
そうすると、以下のように画像が挿入されます。
「画像サイズ」をクリックすれば画像の大きさを調整することができます。
文字を太字にする方法
❶太字にしたい文字列をドラッグして選択します。
❷太字のボタンをクリックします。
そうすると、以下のように太字になります。
リンクの挿入方法
❶リンクにしたい文字列をドラッグして選択します。
❷リンクのボタンをクリックします。
❶リンク先のURLを入力します。
❷矢印のマークをクリックします。
そうすると、以下のようにリンクが挿入できます。
文字の色を変更する方法
文字色を変更したいブロックを選択します。
❶色設定をクリックします。
❷使用した色をクリックして選択します。
これで文字色が変更できます。
投稿の中に見出しを挿入する方法
見出しを挿入したい箇所の「ブロックの追加」をクリックします。
「見出し」をクリックします。
見出しの文章を入力すればOKです。
他にもたくさんの機能がありますこの記事で全ての機能をご紹介するのは難しいので、代表的なものだけを紹介しています。
使用していて「文字のフォントを変えたい」「動画の挿入はできないのかな?」など色々な疑問が出てくると思います。
そんな時はGoogleで調べるとほとんどの疑問が解決されるでしょう。
困ったときにすぐ解決策を調べることができるのもWordPressの強みだと言えます。
5. 固定ページを作成する
会社情報や問合せ先の情報、住所や地図など滅多に変わることがなく、ホームページの決まった位置に情報を表示させておきたい場合は「固定ページ」機能でページを作成します。
「固定ページ」機能でページを作ってみよう
❶「固定ページ」にマウスポインターを合わせます。
❷「新規追加」をクリックします。
固定ページの編集のやり方は「投稿」でページを作る時と同じです。
❶タイトルを入力します。
❷パーマリンクを英文字で設定します。
❸本文を作成します。
❹「公開する」をクリックすれば公開され完了です。
固定ページに地図を挿入する方法
まずはGoogleマップ(https://www.google.com/maps/)にアクセスします。
❶地図で表示させたいお店名や会社名を検索します。
❷共有をクリックします。
地図を埋め込むをクリックします。
「HTMLをコピー」をクリックするとコードがコピーされます。
固定ページの編集画面に、コピーしたHTMLコードを貼り付けます。
「プレビュー」をクリックすると地図が表示されます。
6. サイト全体の配置を整える
トップページにメインメニューを追加する
ホームページのトップページの上部は1番目立つ場所です。そこにホームページのメインメニューを作りましょう。そうすれば訪問者が探したい情報をすぐに見つけることができます。
❶「外観」にマウスポインターを合わせます。
❷「メニュー」をクリックします。
❸メニューに追加したいページを選択します。
❹「メニューに追加」をクリックします。
❺「Header Navigation」にチェックを入れます。
❻「メニュを保存」をクリックすればヘッダーメニューの完成です。
フッターにロゴと会社情報を表示する方法
会社情報など目立たせなくてもいいが、見える位置に表示させておきたい場合は、以下のようにフッターに表示させておくといいでしょう。
❶「外観」にマウスポインターを合わせます。
❷「ウィジェット 」をクリックします。
❸「VK_プロフィール」を❹のフィッターウィジェット エリア1へドラッグします。
❹ロゴ画像、会社情報などを入力します。
7. プラグイン を活用する
ホームページのデザインと構成が完成したら「プラグイン」 という機能を使って、問合せフォームを設置したりコンテンツを最適化していきましよう。
「プラグイン 」はスマホの「アプリ」のようなものと考えるとわかりやすいです。
スマホにはない便利な機能を使うためにスマホアプリをダウンロードして使いますね。
WordPressでも基本機能にはない、便利な機能をプラグイン をダウンロードすることで使用できるようになります。
プラグイン を使って問合せフォームを作る
ホームページを作るにあたって、訪問者が問い合わせしたい場合に応える「問い合わせフォーム」があるといいですね。
問い合わせフォームはプラグイン をダウンロードすることで作ることができます。
❶「プラグイン 」にマウスポインターを合わせます。
❷「新規追加 」をクリックします。
❶右上の検索欄で「contact form 7」と入力して検索します。
❷「今すぐインストール 」をクリックします。
これでインストールが完了です。
有効化して、早速フォーム作成を行います。
❶「お問い合わせ 」にマウスポインターを合わせます。
❷「コンタクトフォーム 」をクリックします。
コンタクトフォーム1をクリックします。
問い合わせフォームに含めいたい項目があれば、こちらのボタン群をクリックして追加することができます。
次はメ問い合わせを受けたときに受信するメールアドレスを設定します。
❶メールタブをクリックします。
❷「送信先」に入力されているメールアドレスを確認します。
❸問題なければ「保存」をクリックします。
❹フォームのコードをコピーします。
お問い合わせページを作るために、固定ページを編集します。
タイトルと本文の文章を入力します。
❶「ブロック追加」をクリックします。
❷「ウィジェット」をクリックします。
❸「ショートコード」をクリックします。
❶先ほどコピーしたコードを貼り付けます。
❷「更新」をクリックします。
これでお問い合わせフォームが完成です。以下のように表示されました。
初心者でもWordPressでホームページが作れる7ステップまとめ
WordPressはプログラミングができない初心者でも視覚的に操作ができ、ホームページ作成をすることができます。
SEOにも強い設計になっており、あなたのホームページが検索で上位に表示されやすくなり、webサイトを作るツールとして理想的と言えます。
本記事でご紹介した7ステップを参考にして、ホームページの作成にチャレンジしてみてください。
操作や機能で不明点があれば、Googleで調べながら進めれば初心者の方でも大丈夫です。
ホームページを作ってみようと思った方はWordPressでホームページが作れる7ステップの手順に戻るをクリックして、手順の先頭に戻って、さっそく作業を進めてみてください。