サイトを作ってみたけど
初心者きつねどうやって公開すればいいの？
と悩んでいませんか？
僕もWeb制作を始めた頃、サイトの公開方法が分からずに3日間悩み続けてしまいました。
しかし、正しく公開方法を理解していれば30分で公開できます。
この記事では、静的サイトとWordPressサイトの公開方法を、初心者向けに画像付きで解説します。
新規サイト制作案件で、クライアントから「サイトが公開されたら納品として構いません」と言われたこともあるので
今回紹介する手順は、現場では必須です。
ぜひ今のうちに習得しておきましょう！
静的サイトの場合
まずは、静的サイトの場合です。
一応説明をしておくと、静的サイトとは「見る人によって表示内容が変化しないサイト」のことです。
ですが、ここではWordPressを利用していないサイトと思ってもらえればと思います。
①ドメイン、サーバーを契約する
では、静的サイトが完成したとしましょう（ローカル環境で確認した際に、すべて出来上がった状態）。
その際にまず取る行動は、ドメインとサーバーを契約することです。
ドメインとは、サイトの住所のことです（例：example.com）。
サーバーとは、サイトのデータを保管する場所のことです。
例えるなら
- ドメイン = 住所（郵便番号：〒100-0001）
- サーバー = 家（データを保管）
- サイト = 家の中身 訪問者がサイトにアクセスする時、ドメイン（住所）を入力して、サーバー（家）にあるサイト（中身）を見る
というイメージです。
おすすめは、ドメインはムームードメイン、レンタルサーバーはXサーバーです。
ムームードメインは、 取得できるドメイン数が多く、セキュリティ対策も徹底されいます。
Xサーバーは高速通信が特徴で、WordPressサイトを立ち上げる環境が整っています。
ムームードメインとXサーバーの契約の仕方は下の記事を参照してください。
②FTPソフトを利用してファイルをアップロードする
ドメイン、サーバーを契約したら、次はFTPソフトというものを利用してサーバーにファイルをアップロードします。
あなたのサイトを公開するには、作成したファイルをサーバー上にアップする必要がありますが
サーバーにファイルをアップするには、FTPソフトを利用して、サーバーにアクセスする必要があります。
有名なFTPソフトは
- FFFTP
- File Zilla
- cyberduck
などです。
Windows、Macの両方で利用できるものもあれば、どっちかしか使えないものもあるので注意してください。
僕のおすすめは、Cyberduckです。
なぜなら、UIがシンプルですし接続が安定しているから。
僕は元々FileZillaを利用していたのですが、接続エラーが出ることがあったのでCyberduckに乗り換えました。
サーバー上にファイルをアップロードできたら、サイト名やドメインを検索してみて実際にサイトが表示されているか確認してみましょう。
ただし、サイトを作ったばかりではGoogleのクローラーが認識していない場合もあります。
そのような場合には、2日〜1週間くらい待ってみて再度確認してみてください。
WordPressサイトの場合
続いては、WordPressサイトの場合です。
WordPressサイトを制作する場合も、最初にドメインとサーバーを取得するのですが、先ほど解説したので省略しますね。
ここからは、既にドメインとサーバーを取得している前提で話していきます。
取得したレンタルサーバーで「WordPress簡単インストール」をする
Xサーバー、ロリポップなどのレンタルサーバーでは、WordPress簡単インストールという項目があり
サイト名や管理画面のID, パスワードなどを決めるだけで初心者でも簡単にWordPressサイトを構築することができます。
今回は、Xサーバーで簡単インストールを行う手順を解説します。
まず、Xサーバーにログインをして、自分が契約したサーバー情報から「サーバー管理」に進んでサーバーパネルにアクセスをします。
そうしたら、WordPressの項目から「WordPress簡単インストール」を選択します。
WordPressをインストールしたいドメインを選択。
選択したら、「WordPressインストール」というタブをクリックして切り替え
サイトURLやサイト名、IDやパスワードなどを設定できるので、入力していきます。
テーマを設定するか決める項目もありますが、インストールした後でも設定できるので
デフォルトテーマのままで大丈夫です。
（ちなみにCocoonはブログサイト、Lightningはホームページ制作でよく利用されるテーマです。）
全ての項目を設定したら「確認画面へ進む」をクリックし、記入事項を確認し「インストール」を押します。
すると、管理画面のURLやID, パスワードが表示された画面に移りますので
指定のURLから管理画面のログイン画面に飛び、ログインします。
- 管理画面のURL
- ID
- パスワード
は、忘れないようにメモをしておきましょう。
この段階で、管理画面の設定>表示設定にて、「サイトをインデックスさせないようにする」という項目にチェックが入っていなければ、サイトは公開されているはずです。
（静的サイトの時と同様に、サイトを作ったばかりではGoogleのクローラーが認識していない場合もあるので、2日〜1週間くらい待ってみて再度確認してみてください。）
ただサイトを公開するだけならここで終了です。
しかし、作成したWordPressサイトをLightningやCocoonなどの既存テーマを利用して運用していくならいいのですが、静的サイトのように自分で作成したファイルを反映させたいなら、指定のディレクトリにそのファイルをアップロードしていく必要があります。
これは、静的サイトの際に紹介したFTPソフトを利用してもできますし、レンタルサーバーのファイルマネージャーというところから行うことも可能です。
その際は、htmlファイルをphpファイルにしたり、必要な箇所をphpの関数で書き換えたり、header.phpやfooter.phpを作ってそれを全てのファイルに読み込まれるようにしたりしなくてはいけません。
詳しく書くとこの記事だけでは収まりきらないので割愛しますが、気になった方は
「WordPress オリジナルテーマ開発」
みたいな感じで、検索してみてください。
一応、phpファイルを全て完成できたと仮定して話を進めると、それらが全てできたら自分のドメインの「themes」というディレクトリの中に好きなテーマ名を決めてディレクトリを作り、その中にphpファイルを入れていきます。
そうしたら、作成したWordPressサイトの外観>テーマエディタに反映されていますので、
ただし、このテーマエディタは、特に初心者はいじらないようにしましょう。（特にfunctions.php）
無理に触ってエラーを出てしまうと、サイトが表示されなくなってしまったり、管理画面にアクセスができなくなってしまいます。
もし、自分はコーディングできないけどテーマエディタに問題がある場合は、どのような事態になっているかにもよりますがWeb制作会社やフリーランスに早急にお願いして直してもらうことをお勧めします。
実際にサイトが検索上に表示されているか確認する方法
ここまでで、サイトを公開する手順については理解できたと思いますが
もし、実際にサイトが検索上に表示されているか確認したい場合は、Google Search Consoleを利用しましょう。
Google Search ConsoleにGoogleアカウントでログインをし、左のメニューの中から「URL検査」を選択します。
そして、検索欄に確認したいサイトのURLを入力しましょう。
きちんとインデックスされており、検索エンジン上に表示されている場合は下のように記載されます。
作ったホームページが公開できない場合の対処法
作ったホームページが公開できていない場合は、どうしたらいいのでしょうか？
前の見出しで解説したサチコのURL検査で「URLはGoogleに登録されていません」という感じで灰色で表示されている場合は、残念ながらホームページが公開されていない可能性が高いです。
作ったホームページが公開されない理由は、大きく分けて2つあります。
- 「robots.txtによりブロックされました」と表示される
- 「noindexタグにより除外されました」と表示される
①「robots.txtによりブロックされました」と表示される
まずは、「robots.txtによりブロックされました」と表示される場合。
この場合は、Googleクローラーがあなたのサイトにアクセスすることができなくなっている状態です。
robot.txtは隠しファイルと呼ばれているため通常は閲覧できませんが、「https://ドメイン名/robot.txt」とURLに打ち込むことで閲覧することができ、下のような記述がされています。
User-agent: *
Disallow: /admin/
Allow: /admin/images/
Sitemap: https://example.com/sitemap.xmlGoogleクローラーがあなたのサイトにアクセスできない場合は、この中の「Disallow」の中にサイトのURLが記述されています。
この記述を削除すれば、エラーが解消されます。
記述を削除する場合は、robot.txtをダウンロードして、テキストエディタやVSCodeなどのエディターソフトを利用して
「Disallow」内の記述を書き換えましょう。
②「noindexタグにより除外されました」と表示される
続いて、「noindexタグにより除外されました」と表示される場合の対処法です。
この警告が出ているということは、noindex設定をしているせいでGoogleクローラーがあなたのサイトにアクセスはできているが、検索にあげることができない状態です。
静的サイトの場合は、headタグ内に以下の記述が入っていないかを確認してみましょう。
<meta name="robots" content="noindex">上のmetaタグの記述が入っていると、検索上にインデックスさせないように処理をしてしまいます。
もしコーディングができない場合は、Web制作会社やフリーランスに頼んで上の記述を削除してもらいましょう。
削除してもらったら、じきにインデックスに上がってきます。
WordPressサイトの場合は、管理画面のダッシュボードの「設定 > 一般設定」から
「検索にインデックスしない」にチェックが入っている可能性があります。
このチェックを外してから変更を保存することで、インデックスに上がってきます。
noindex設定を外したら、サチコのURL検査にて「インデックス登録をリクエスト」をクリックしてしばらく待つようにしてください。
後日、Googleからインデックス登録がされているかのメールが届きます。
最後に
ということで、今回は静的サイトとWordPressサイトを公開するまでの手順を解説しました！
今回の記事でサイトを公開する方法がわかったと思いますので
もしまだポートフォリオサイトを作っていない人がいたら、下の記事を参考にして作ってしまいましょう！
このブログでは、他にもWeb制作に関する話題やコーディング、WordPressなどに役立つ情報を発信しているので
次回の記事もぜひみてみてください！
コメント