MENU
飲食店専門ホームページ制作プラン

【飲食店HP自作講座】完全初心者対応WordPressの始め方マニュアル

2020 6/12
【飲食店HP自作講座】完全初心者対応WordPressの始め方マニュアル

1. ブラウザの設定

Google Chromeをインストールする

インターネットエクスプローラーはとても古いブラウザです。今でも使っている人を多く見かけますが、どんどん非対応のサービスが増えているので今日から使用をやめましょう。

Google Chromeのインストール方法

Google Chromeのインストールと設定はとても簡単です。まずはこちらからGoogle Chromeのページにアクセスしましょう。

STEP
Chromeをダウンロード

【Chromeをダウンロード】ボタンをクリックしてChromeをダウンロードします。

STEP
Chromeのセットアップ

ダウンロードされた【ChromeSetup.exe】というファイルをダブルクリックして開くと自動的にインストールが始まります。

STEP
インストール完了

以上でクロームのインストールは完了です。早速開いてみましょう。

Google Chromeを既定のメインブラウザに設定する

クロームのインストールを終えたらクロームを既定のブラウザに設定します。デフォルトではWindowsならInternet ExplorerまたはMicrosoft Edge、MacであればSafariになっているはずです。

繰り返しますが、インターネットエクスプローラーはとても古いブラウザです。今でも使っている人を多く見かけますが、どんどん非対応のサービスが増えているので今日から使用をやめましょう。

規定ブラウザの変更方法

STEP
Windowsの設定画面を開く

まず、画面左下のWindowsボタンまたは、キーボードのWindowsキーから歯車ボタン()をクリックしてWindowsの設定画面を開きます。

STEP
【アプリ】をクリック
STEP
【既定のアプリ】をクリック

「アプリと機能」というページが開くので【既定のアプリ】をクリックします。

STEP
【Webブラウザ】を変更する

クロームとは別のブラウザが設定されているので

STEP
【Google Chrome】を選択する
STEP
タスクバーにピン留めする

あとは画面下のタスクバーからクロームのアイコンの上で【右クリック⇒タスクバーにピン留めする】でショートカットを作っておくと以降が楽になります。

これでGoogle Chromeが既定のメインブラウザに変更されました。

スマホにもインストールする

ブラウザはパソコンやiPhone、iPadといった別々のデバイスでもブックマーク等を同期できます。なのでパソコンのブラウザをクロームに変更したと同時にスマホのブラウザもクロームに変更しておきましょう。


2. Gメールアドレスを作る

Gメールアドレス(Googleアカウント)の作り方

STEP
アカウントの作成

まずはGoogleアカウントのトップページにアクセスし【アカウントを作成】をクリックします。

STEP
必要情報の入力

名前や希望のメールアドレス、パスワード、生年月日、性別は入力必須となっています。スパム防止のためのキャプチャ画像に表示されているテキストを入力し、利用規約とプライバシーポリシーに同意するにチェックを入れ【次のステップ】をクリックします。

STEP
アカウントの確認

携帯電話のキャリアメールやYahoo!メールなど現在使っているメールアドレスを入力し【次へ】をクリックします。

STEP
認証コードの入力

入力したメールアドレス宛にGoogleから確認コード付きのメールが届くので、入力して【次へ】をクリックします。

STEP
アカウント作成の完了

「ようこそ!」と表示されてGmailアドレスの取得は完了です。【Gmailに移動】をクリックしてさっそくGmailを開いてみましょう。

このように表示されればOKです。

これでGメールアドレスの取得および、googleアカウントの作成が完了しました。


3. レンタルサーバーを契約する

レンタルサーバーはConoHa WINGが超おすすめ

ConoHa WINGがおすすめな理由
  • WordPressのインストールが超簡単
  • サイトセキュリティを上げる独自SSLの設定も超簡単で無料
  • 通常年間1,000円ほどかかる独自ドメインの維持費も永年無料
  • 大手GMOの運営で安心
  • 超高速の処理速度
  • それでいて安い

多くのレンタルサーバーがありますが、2020年現在もっともおすすめなのはConoHa WINGです。面倒な作業もほとんど自動で終わるので、初心者には選ばない理由のない非常に強力なサービスだと思います。

ConoHa WINGの申込方法

STEP
ConoHaアカウントを作成する

こちらからConoHa WINGの申し込みページにアクセスし、ConoHaアカウントを作成していきます。

STEP
【今すぐお申し込み】をクリック
STEP
メールアドレスを入力してパスワードを設定する
  1. メールアドレスを入力
  2. 確認のため再度メールアドレスを入力
  3. 任意のパスワードを入力
  4. 【次へ】ボタンをクリック
STEP
申し込みプランを選択する
  1. 料金タイプ:「WINGパック」を選択
  2. 契約期間:「12か月」がおすすめ
  3. プラン:「ベーシック」でじゅうぶん
  4. 初期ドメイン:なんでもいいです
  5. サーバー名:そのままでOK
  6. 入力を終えたら【次へ】ボタンをクリック

2020年6月2日、「WordPressかんたんセットアップ」機能がリリースされ、さらに簡単にWordPressが始められるようになりました。このマニュアル執筆時にこの機能はなかったため、利用する場合はこちらのConoHa WING公式サイトから手順をご覧ください。

STEP
契約者情報を入力
  1. 名前や住所など必要事項を入力
  2. 入力し終えたら【次へ】をクリック
STEP
SMS / 電話認証を行う

SMS認証とは電話を使った本人確認です。

  • SMS認証:認証番号がショートメールで送られてくる
  • 電話認証:自動音声電話がかかってきて認証番号を伝えられる

SMS認証はショートメールなので固定電話ではなくスマホの電話番号を入力してください

STEP
決済方法を入力
  1. 支払方法の選択:クレジットカードがおすすめ
  2. カード情報を入力
  3. 【お申し込み】ボタンをクリック

これでレンタルサーバーの契約が完了しました。


4. 独自ドメインを契約する

独自ドメインとは簡単に言うと「○○.com」のようなサイトのURLのことです。このドメインは世界中で1つしか存在しないので早い者勝ちです。

ドメインの取得には本来、取得費用や維持費がかかるのですが、ConoHa WINGを利用し続けるだけで永久に無料で保持できます。

ConoHa WINGのドメイン取得手順

【サーバー管理⇒契約情報⇒無料独自ドメイン⇒未設定】から取得できます

【サーバー管理】ではなく【ドメイン】から進んでしまうと通常取得(有料)になってしまうので注意して下さい。

STEP
ConoHa WINGから新規ドメインを取得する

【ドメイン新規取得】にチェックして【追加する】をクリック

STEP
取得したいドメインを検索

【ドメイン名】の箇所に店舗名など任意の文字列を入力して検索します。

STEP
取得したいドメインをカートに入れる

取得したいドメインが表示されたら【カートに追加】ボタンをクリックします。

繰り返しますが、ドメインは世界で1つしかないので、すでに誰かに取得されているドメインは契約できません。その場合は、文字列を変えるか、ハイフンを入れるか、数字や他の単語を足したりしてください。また、.comや.netなど複数の種類がありますが、特にどれを使っても問題ありません。ですができれば馴染みのある.comで取れるといいかなと思います。

STEP
カートから決済画面へ進む

ドメインをカートに追加したら【次へ】ボタンをクリックしてください。

STEP
契約者情報を入力

名前や住所など契約者情報を入力します。さきほどサーバー契約のときにも入力しましたが、今回はドメインの契約なので別です。

ただ、サーバーの契約者情報がある程度自動的に入力されているはずなので確認しながら進めてください。入力し終えたら【次へ】をクリック

STEP
少し時間がかかります
STEP
申し込みを完了させる

上記のページが開いたら【決定】をクリックしてください。

STEP
サーバーにセットされるのを待ちます

再び画面が暗くなるので100%になるまで少し待機してください。

STEP
ドメインの契約完了

上記の画面に戻ったらドメインの契約が完了です。

STEP
ドメイン認証を行う

ドメインの契約が完了したら、契約時に入力したメールアドレス宛にConoHa WINGから「【重要】[ConoHa]ドメイン情報認証のお願い」という件名でメールが届きます。このメールを開き記載されているURLをクリックして認証を行ってください。

この認証を期限内に行わないとドメインが機能しなくなり、ホームページやメールが使用できなくなります。

これで独自ドメインの契約が完了しました。


5. サーバーとドメインを紐づける

ConoHa WINGは自動で紐づけされるので作業の必要なし

レンタルサーバーの契約時とドメインの取得時に、両方で契約者情報を入力する必要があったかと思いますが、本来サーバーとドメインは分かれています。そこでどのドメインをどのサーバーで動かすのかという紐づけの作業が必要になるのですが、ConoHa WINGではその必要がありません。

これもConoHa WINGをおすすめする大きな理由の1つです。


6. サーバーにWordPressをインストールする

いよいよWordPressのインストールです。こちらも以下の手順通りに進めていただければ非常に簡単です。

ConoHa WINGのWordPressインストール手順

STEP
【サイト管理】をクリック

管理画面左のメニューから【サイト管理】をクリックします。

STEP
WordPressをインストールするドメインに切り替える

デフォルトが「○○.conohawing.comになっているので【切り替え】ボタンをクリックしてドメインを切り替えます。

STEP
WordPressをインストールするドメインを選択

先ほど取得した独澍ドメインの左側にある【切り替え】ボタンをクリックしてください。

STEP
【+アプリケーション】をクリック

設定対象が独自ドメインに切り替わっていることを確認して【+アプリケーション】ボタンをクリック

STEP
必要情報の入力
  1. アプリケーション:「WordPress」を選択
  2. インストール方法:「新規インストール」を選択
  3. バージョン:「5.4.1」を選択
  4. URL:どちらでもOK(wwwありのが若干かっこいい)
  5. インストール先:空欄でOK
  6. サイト名:店舗名などを入力(あとから変えられます)
  7. メールアドレス;取得したGメールを入力
  8. ユーザー名:任意の文字列を入力(ログインに必要なのでメモ)
  9. パスワード:任意の文字列を入力(ログインに必要なのでメモ)
  10. データベース
    1. データベース名:そのままでOK
    2. ユーザー名:そのままでOK
    3. パスワード:任意の文字列を入力
  11. コントロールプラグイン:そのままでOK
  12. 自動キャッシュクリアプラグイン:そのままでOK
  13. 入力を終えたら【作成する】ボタンをクリック
STEP
WordPressがイオンストールされたことを確認する

アプリケーションインストールの画面に「WordPress」が表示されていればOKです。

STEP
サイトを開いてみる

「サイトURL」の箇所のURLをクリックしてホームページを開いてみます。

STEP
ページが開かれればホームページ開設成功

「Hello world!」が開かれれば、あなたのURLであなたのお店のホームページが全世界に公開されたことになります。

これでWordPressのインストールは完了です


7. WordPressに最低限必要な初期設定を行う

ホームページが無事に開設されましたが、デザインを整えたり、必要なページを作成する前に「絶対に最初にやっておくべき初期設定」があります。後回しにすると非常にデメリットが大きくなるので、あともう少しだけ作業してください。

7-1. 管理画面にログインしてブックマークする

STEP
管理画面URLをクリック

まず、ConoHa WINGの管理画面から【管理画面URL】をクリックします。

STEP
ログイン情報を入力

WordPressインストール時に設定したログイン情報を入力して【ログイン】ボタンをクリック

「ログイン状態を保存する」にチェックを入れておくと今後が楽です。

STEP
管理画面へログイン完了

こちらがWordPress(ホームページ)の管理画面になります。このページをブックマークしておいてください。

7-2. ドメインに独自SSLを設定する

次にドメインにSSLというサイトセキュリティの設定を行います。SSLを設定したサイトはURLが「http://○○.com」ではなく「https://○○.com」になります。

先ほど開設されたホームページを見てみてください。「保護されていない通信」と表示されているはずです。

なのでSSLの設定をしてサイトのセキュリティを強化します。

ホームページへの通信を暗号化することでサイト訪問者の情報漏洩を防ぐ必須の設定です。

STEP
ConoHa WINGの管理画面を開く

【サイト情報⇒サイト設定⇒かんたんSSL化の【SSL有効化】がグレーアウトしているのがわかるかと思います。

STEP
【サイトセキュリティ】をクリック
STEP
【無料独自SSL】をクリック
STEP
【ON】をクリック
STEP
SSL有効化が青くなればOK(少し時間かかります)

長いと30分ほどかかることもあるようですが、数分で青くなるはずです。【サイトURL】をクリックしてホームページを確認してみましょう。

STEP
【保護されていない通信】が消えていればOK
STEP
鍵のアイコンがついていればOK
STEP
サイトのURLをhttpsに変更

管理画面にログインし、設定⇒一般から一般設定を開きます。

  • WordPressアドレス(URL)
  • サイトアドレス(URL)

の両方ともhttpsに変更します

STEP
ページ下部の【変更を保存】をクリック

【変更を保存】ボタンを押して設定を保存します。

これででSSL化は完了です

7-3. パーマリンクの設定をする

パーマリンクとはページ単体に振られるURLのことです。○○.com/△△△のように表示されます。

これも途中で変更すると作業が大変な上に、シェア数がリセットされたり、SEOの評価が下がったりとデメリットしかないので必ず先にやっておきましょう。

STEP
WordPressのダッシュボードからパーマリンク設定画面を開く

WordPressにログインし、設定⇒パーマリンク設定をクリックします。

STEP
【投稿名】を選択

【投稿名】を選択して【変更を保存】ボタンをクリック

よく【変更を保存】のクリックを忘れてしまう方がいるので注意してください。

これでパーマリンクの設定は完了です


8. テーマのインストール

ここまでで共通の作業は終わりです。これからいよいよ本格的にホームページの制作に入っていくわけですが、デザインを変更するためテーマ(テンプレート)をインストールします。

テーマは無数にありますが、ホームページを作るうえでおすすめのテーマは2つだけです。

おすすめのテーマ
  • SWELL(このサイトで使ってるテーマ):17,600円 / 買い切り
  • Snow Monkey(SWELLより初心者向き):16,500円 / 年

ただし、2つとも有料のテーマとなりますので、少しでも出費を抑えたいなど無料のテーマを使いたい場合は『Cocoon』というテーマがおすすめです。

SWELLとSnow Monkeyはどちらを使ってもほぼ同じことができます。僕個人の感想としては

  • SWELL
    • 弊社で運営しているサイト(PC11・鉄板焼葉山・伊豆駿東まっぷ)のデザインが好きな人
    • ブログ・コンテンツマーケティングも行いたい人
  • Snow Monkey
    • かんたんにおしゃれなサイトを作りたい人
    • どちらかというとカタログサイトをサクっと作りたい人

におすすめです。

圧倒的に違うのはSWELLは1回買取、Snow Monkeyは年額がかかります。お金で決めるものではないかなと思いますが大きく違うのでご注意ください。

その他必要に応じてやるべきこと

  • グーグルアナリティクス(アクセス解析)の設定
  • ウェブマスターツール(サイト診断)の設定
  • SNSアカウントの作成
    • Facebookページ
    • Instagramビジネスアカウント
    • Twitter
    • LINE公式アカウント
    • YouTube
  • MEO(グーグルマイビジネス)の設定
  • Web予約システムとの連携
    • ホットペッパーグルメ
  • 独自ドメインのメールアドレスの作成

随時マニュアルを追加・更新していきます。

記事内で不明な点はお気軽にご質問ください

  • 手順通りに進めたけどうまくいかない
  • 記事内に不明な点がある
  • 新たな疑問や悩みが生まれた
  • 他でこんなこと聞いたけどどうなの?

などなど、意見や疑問がありましたらお気軽にご連絡ください。

ご不明な点はご質問ください

この記事が気に入ったら
いいね または フォローしてね!

この記事を書いた人

野口 銀河のアバター 野口 銀河 代表取締役

PC11株式会社代表取締役。鉄板焼レストラン&バー『葉山』を経営してます。大学2度中退→ホームレス→DJ→Web制作・ブロガー→法人設立。地元の飲食店が大金をかけずネットでも集客できるようホームページの自作・集客方法などを発信しています。コロナに負けるな沼津の飲食店。

目次
閉じる