【最速&無料】初めてのWordPressでWebサイト/ブログの作り方 ~エックスサーバー編

WordPress

どこより簡単!初めてのWordPressブログの作り方 ~エックスサーバー編

このページではWordPress(ワードプレス)をつかったサイトやブログを誰でも簡単に立ち上げる方法をていねいな手順画像つきで解説しています。

しかも最速かつ無料です!

興味があれば損はないのでとにかくやってみてください。
最速無料ですから合わなければやめてもOKです。

Webサイトを立ち上げる基礎知識全般が手に入ることを考えたら本当に損はしないと思います。




WordPress(ワードプレス)とは?

WordPressは素人でも簡単にサイトの更新ができ、世界のWebサイトの39%が採用しているという驚異のCMS(コンテンツマネジメントシステム)です。

SEOに非常に強い構成であることからも個人ブロガーだけではなく企業も積極的に採用しています。

むしろWordPress一択状態といってもよいくらい人気です。

WordPressを自分で立ち上げるのは難しい?

ただ、素人がワードプレスでサイトを立ち上げるとにかく難しいです。

いや難しいというよりも複雑です。

インストールが必要なだけでなくサイト立ち上げに関するあらゆる知識が必要となり、さらにどこのサーバーで行うかによりまったく違う操作が必要となるからです。

けっこうなWebまわりの知識や経験がないと立ち上げて運用していく前に心が折れてしまうと思います。

いえ、誰でもできます!

でも安心してください。

このページでは順番にていねいに画像付きで説明するので、そのまま進めていけば「最速かつ無料で自分のサイトをまず持つ!」を実現できます。

何事もまず「やってみる」ところから。


エックスサーバーに申し込み

エックスサーバー(XSERVER)は最大手のWordPressレンタルサーバー企業です。

低価格かつ高機能なことから人気があります。

今回はこのエックスサーバーを使うこととします。

10日間無料なので気に入らなかったらあとで乗り換えても大丈夫です。

基本的なやることはほかのレンタルサーバーでも変わりません。


まずはサイトにアクセスし
https://www.xserver.ne.jp/

申し込みボタンを押しましょう。

初めてご利用のお客様
>新規お申込み

申し込みフォームが開きます。

サーバーIDはシステム的なサーバー名です。その後いろいろと使うことになりますが、人に見られるものではないのでそのままでもかまいません。Yahoo!IDみたいなものです。後から変更はできません。

プランに関してはいったんX10で行きましょう。サイトが月間数十万PVとかに成長してから他のプランにのりかえるくらいでかまいません。

WordPressクイックスタートは手間な設定を最初に行えるかわりに、お試し期間がなく、最初から支払いが発生します。ここでは利用なし(チェックしない)で進めましょう。ここですべて説明しますので。

もし、有料でのエックスサーバー利用を決断しておりドメインもエックスサーバーで取得してかまわないならこちらを選んでも大丈夫です。

注)金額に関しては990円/月額~と書いてありますが、初期費用3000円がかかるのと、支払いは3ケ月~になるので初期費用としては最初の3ケ月で税込7,260円~となります。

登録へ進むと、フォーム入力になるので入力して送信。

入力を終えて次に進むと、次はメール届くかどうかの確認。

メールアドレスに届いた確認コードを入力します。

ウィンドウを閉じないようにしましょう。

閉じたらやり直しになります。

次へ進むと入力確認。

さっきはメールでしたが、今度は電話番号をもっているかどうかで本人確認を行います。

とどいた認証コードを入力します。

これで登録は完了です。

「サーバーアカウント設定完了」メールが届きます。

ここで・・・・

いきなりよくわからない画面に遷移して放置されてしまいます。

私もここから「何をしたらWebサイトができるのか?」がわからず動けなくなりました。

1つ1つ説明しますね。

いったん「サーバー管理」と「ファイル管理」ボタンの場所だけ覚えておいてください。

繰り返しになりますが、完了メールが届いているか一応確認しておきましょう。

【Xserver】■重要■サーバーアカウント設定完了のお知らせ

というメールがとどいていていろんな設定情報が書いてありますがたぶんよんでもわからないことだらけなのでいったん無視します。

話を戻します。

先ほどの「サーバー管理」をクリックすると
サーバーパネルというサーバー管理のためのページが開きます。

これがサーバー管理

【補足】ちなみにこれがファイル管理。手動でファイルをアップロードする際などに必要になるので、そういうことができるんだと頭の片隅に置いておいてください。

【分岐】オリジナルドメインにするか、どんなドメインでもよいか

ここで分岐点。

オリジナル(独自)ドメインをこの時点で持つか、今回はお試しだからとにかくなんでもよいか、によって次の「オリジナルドメインを設定」のステップをスキップできます。

あとから変更することも可能ですがエックスサーバー上ではサイトを再度新規で立ち上げて引っ越しするという形をとることになります。

オリジナルドメインを取ると、ドメインを決めたり探したり設定したり反映を待ったりなど、それなりに手間と時間がかかります。

本当に初めてでとにかく試したい人はいったんワードプレスを動かしてから、あとでドメインを変更した方がいいかもしれません。

2つ目以降のワードプレスを追加立ち上げること自体は料金なしで、たった数分くらいで出来てしまいます。

本日中にオリジナルドメインでリリースしたいんだ!というひとはぜひオリジナルドメインでやってください!

※ドメインを決めたり、登録したり、設定反映待ち時間などで時間を要すると思いますので覚悟の上で!

オリジナルドメインを設定する

(オリジナル(独自)ドメインがいらない人は飛ばしてください)

さぁ、憧れのオリジナルドメインの設定ですが、ここが鬼門です。

初心者つまづきポイント。

ややこしいですが頑張りましょう!

ドメイン取得サービス(レジストラ)ドメインを取得する

エックスサーバー上でドメインを取るのもよいですが、このままずっとエックスサーバーを使い続けるかどうかはわからないので、ドメインは別のレジストラで取得することをお勧めします。
ドメインの移管作業(携帯のキャリア間移動的な)はけっこう面倒くさいです。

おすすめはお名前.comかバリュードメインです。

同じGMOグループですがバリュードメインの方が.jpドメインでも個人情報さらすことを強要していなかったりと私は方針的に好み。
(ほとんどのレジストラは.jpで名前などの情報の公開を求めてきます)

欲しいドメインが.jpしか取れなかった場合でも個人ブログで本名さらすのやですよね・・・

Value Domain(バリュードメイン)|ドメインと変える、サイトの価値。
Value Domain(バリュードメイン)は、ドメイン登録実績600万件を誇る国内最大級のドメイン取得・管理サービスです。また、高速・高機能なレンタルサーバーや、SSLサーバー証明書なども提供する「ドメイン・ホスティング総合サービス」です。
ドメイン取るならお名前.com|ドメイン取得は最安値1円~
お名前.comは国内最大級のドメイン公式登録サービスです。ドメイン登録実績2400万件を超えました。人気の.com .net .jpドメインを含め580種類以上のドメインを取り扱っています。ドメイン取得は早い者勝ちです。第三者に取得される前に、まずは検索を!新規登録と同時申込みでWhois情報公開代行が無料。

エックスサーバー上で新規ドメインを登録設定する

ドメインは取得できているものとします。

以下のメニューからドメイン設定へ

自分のドメイン名を入力して進む

あれこれ警告してきますが訳が分からないと思うのでいったん追加へ

SSL失敗するかもしれませんが、いったん無視して進めてください。

最大で1時間程度かかりますと書いてありますが、そんなにはだいたいかかりません。

トイレに行ってコーヒーを飲んだくらいでまたページを更新してみてください。

反映が終わると「反映待ち」が消えて、エックスサーバー上のDNSなどが登録されます

エックスサーバー上のネームサーバー名を確認

次のステップ用に「ネームサーバー名」のリストをメモしておきます

ドメイン取得サービス(レジストラ)でネームサーバーの設定をする

レジストラでネームサーバーの設定をします。

たぶんここが一番理解が難しい部分だと思います。

これをやる意味は、取った「ドメインのサーバーの位置を決める場所」を教えてあげることです。

そうすることでユーザーがアクセスするときにこんなことができるようになります。

①ユーザーのブラウザ端末「ドメイン管理者さん、このドメインのサーバーの場所をしっているのは誰?」
②ドメイン管理者「場所はエックスサーバーが知っています」
③ユーザーのブラウザ端末「了解。エックスサーバーさんに聞いてみる」

みたいな感じだとイメージつくでしょうか。

ここでは②の回答をするための設定をしていきます。

バリュードメインでドメインを取得した場合

バリュードメインがレジストラの場合、バリュードメインに「エックスサーバーがサーバーの場所をしっているよ」と教えてあげます。

そういう設定をこれからします。

まずは https://www.value-domain.com/ 上で

右側のネームサーバーの設定

対象のドメインクリック

さきほどレジストラのページで控えた5つのネームサーバー名を書いていきます。
5つ全部書かなくてもよいですが最低2つは書いておきましょう。

反映まで時間はレジストラにもよりますが、バリュードメインの場合は即反映しました。
数時間かかるレジストラもあると思います。

独自SSL設定

SSLとは?

SSLはWebサイトをhttp://だけでなくhttps://でアクセスできるようにするセキュリティ機能のことです。

これでアクセスした情報は暗号化され、盗み見や改ざんなどを防止できます。

現在、SSLに対応されていないサイトはブラウザから警告だされたり、Googleの検索順位にも不利益があったりするので必ずやっておきましょう。

通常有料のSSLの設定ですが、エックスサーバーでは無料のSSL証明書発行サービスを利用します。


SSLに対応していないとどうなるの?と思いますよね。

SSLに対応していないサイトにhttps://でアクセスするとこんな画面が出ます。一度は見たことあるのではないでしょうか?

詐欺サイトやってそうなくらい個人的にはちょっと脅し過ぎだな、と思う怖い画面です。

あまりWeb関連の知識がない人が昔から運営しているサイトなど、対応をほったらかしておくと、ブラウザ開発者側の対応によりいつのまにかこうなりがちです。

全ての情報が暗号化されてないので、何か送信するときは注意してね、という意味です。
通常ページを閲覧する分にはほぼ問題はないです。

ちなみにレンタルサーバー「独自SSL」の独自は「共有SSL」と区別するためのものなのであまり気にしないでよいです。通常は自分の取得したドメインに対して、SSL証明書を1つなのでふつうにSSL証明書と呼んでOKです。

各サーバー会社はあえて共有SSLと区別するために独自SSLと呼んでいるようです。

SSLの設定

さっそく設定しましょう!

サーバーパネルの
ドメイン>SSL設定

このSSL一覧にない場合はまだ設定がされてないので、このまま続けます。
ある場合はもう済んでいるので、ここのステップは飛ばしてOKです。

ドメインにwww.なんていらないぞ?
と思っても気にしなくてOKです。

進みましょう。

追加する。を押してしばらく待ちましょう。

1分くらい待つと終了

一覧にもどってみると追加されています。
反映に最大1時間かかると書いてありますね。

そんなにはかかりません。

再度、トイレとコーヒータイムで待ちましょう。

反映されたら

https://【ドメイン名】/でアクセスしてみましょう。

httpじゃなくてhttpsです。

成功していれば普通にトップ画面が表示されるはずです。

ブラウザのURLバーの部分が、こうなったら失敗です。

これが成功

ひとまずSSLの設定はこれで終了です。

ワードプレスの設定がまだ済んでない場合は進みましょう!

エックスサーバーでWordPressインストールする

サーバーパネルにログインします。

ウィンドウを閉じたりして、わからなくなったらとりあえずトップページから再度入りましょう。

https://www.xserver.ne.jp/

今後何度も入ることになるのでいったん説明しておきますね。

サーバーパネルにログインします。

ログイン
>サーバーパネル

サーバーIDとサーバーパネルパスワードと言われます。
(各種パスワードなどは完了メールに記載)

サーバーパネル?サーバーパスワード?サーバーID?サーバーパネルパスワード?もはや統一した単語が使われていないので、何を言っているのかわからなくなるレベルでいろんな独自用語が大量発生します。
ここはいったん考えないでください。


何も考えず最初に登録したメールアドレスとパスワードで普通にログインできます。

これでサーバーパネルが開きます

何度見ても難解な画面です。。

私もそう思いますので、くじけないでください。

簡単インストール

とりあえず今はドメインはどうでもいいという人はデフォルトのドメイン***.xsrv.jpを選択。

先に新規ドメインを取って設定を終えている方はそちらを選択してください

WordPressインストールのタブをクリック。

見つけづらい・・・

自分のドメイン OR ***.xsrv.jp
どちらかでインストールします。

インストールするを押す。

そのまま1~2分待つかもしれません。

完了したらURLが2つ出来ます。


サイトURL http://【ドメイン】/
管理画面URL http://【ドメイン】/wp-admin/

確認のため↑サイトURLにアクセスしてみましょう。

初期状態だとダサすぎてバグっているようにすら見えますがこれで正常です。

今度はワードプレスの管理画面へ。

インストール時に設定したアカウントでログインします。

これがうわさのワードプレスの管理者画面です。成功!

最初の記事を投稿してみる

投稿>投稿一覧から新規追加

なにこれ?この画面大丈夫?と思うような画面が出てきますが正常です。

これがデフォルトのワードプレスの編集画面です。

ここは我慢してタイトルと内容だけとりあえず書いて公開を押してみましょう

公開ボタンを押したら投稿を表示

ついに記事が世の中に公開されました!

ちょっと感動ですね!

ただ・・・・・・・・・・・
バージョンによって多少見た目の違いはあるようですが
いずれにしても、本当にひどい画面で、これはサイトなのか?何かの間違い?
と思うことでしょう。

これはワードプレスを始めた人全員が思うことですので気にしないでください。

今は世の中に自分のサイトを公開できたことだけを喜んでください。

一つずつ修正していきましょう!

テーマを変える

WrodPressのテーマはサイトの基本構成や見た目のデザインなどを決める機能です。1つのWordPressサイトに対し1つのテーマを設定します。

ワードプレスは初期状態ではあまりいい見た目のデザインのテーマは存在しません。

最初はコンテンツがスカスカで写真などがないことも大きな要因ではあります。

いきなりおしゃれなデザインを目指すというよりは徐々に修正していくようにしていくといいです。

9割以上の人はブログもサイトも1か月以上運営することができません。
継続して更新できないからです。

最初はあまり凝らずに、とにかくアウトプットを最優先にしていくことが先決です。

1日1%改善していっても1年で300%以上の改善ができますから。

今一番人気のcocoonというテーマをインストールしてみましょう。

日本語対応&無料&SEO対応と3拍子そろったおすすめのテーマです。

テーマのインストール

テーマのインストールの仕方は大きく2種類あります。
①公式サイトからクリックするだけでインストール
②所有するテーマのファイルをアップロードしてインストール

cocoonは②なのでそのやり方を説明します。

公式サイトからファイルを2つダウンロード

https://wp-cocoon.com/downloads/

1つ目。親テーマファイルをダウンロード

2つ目。子テーマファイルをダウンロード

※補足

親テーマと子テーマという言葉が出てきましたが、これはテーマ自体をカスタマイズするときに利用する概念です。

何かのファイルを複数人で共有して修正すると一人が修正した箇所を他の誰かが消してしまった。。。などの問題が起こりますよね。
それを避けるために親子という概念が存在しています。

親は開発者がいじる方、子は利用者がいじる方という感じです。
せっかく苦労してカスタマイズしたのにテーマを最新版にアップデートしたら全部消えてしまった!なんてことを子テーマのおかげで防止できます。

Cocoonのインストール

ワードプレスの管理画面に戻ります。

https://【サイトのドメイン】/wp-admin/

外観>テーマ

へ移動

上の新規追加ボタンをクリック

テーマインストール画面に遷移します。

テーマのアップロードボタンをクリックすると

ファイルをアップロードするためのブロックが開くので
ファイルを指定します。

まず上記でダウンロードした1つ目。親ファイルを指定します。

こんな感じのファイル名(バージョンは時期によって変わります)
cocoon-master-2.2.6.6.zip

ファイル指定したら、今すぐインストールをクリック。


テーマのインストールが成功しました。

インストールしただけではまだテーマは使えません。

有効にして初めて使えるようになります。

有効化をクリック。

これでcocoon親テーマが有効になりました!

続いて子テーマをインストール。
また同じ作業のくり返しです。

再びファイルアップロード画面に行きましょう!

cocoon-child-master-1.1.2.zip ※バージョンは時期によって異なる

をアップロードします。

同様に「有効化」を忘れずに!

これでcocoonのインストール設定は完了です。

直後の状態はこんな感じだと思います。

インストール自体はここで終了ですが、あと少しオマケを。

cocoonにはスキン機能という見た目を着せ替えのように変更にできるすばらしい機能があるのでやっておきましょう。

必要ない人はここで終了でもOKです。


メニューの「cocoon設定」画面に行くと
スキン一覧があるのでそこから選択するだけです。

気づきにくいですがプレビューしながら選べます。
選んだらまとめて保存ボタンを押しましょう。

確認

最初書いた記事はこんな風になりました。

インストール直後はこれでしたから、、、、

初期状態よりは大分ましになり、更新していく準備は出来ました。

ここまでだけでいいサイトが出来た!みたいには決してなりませんが
まだまだこれからです。

とにかく内容のアウトプット優先でがんばって行きましょう!

気に入ったらお金を払って契約

エックスサーバーの無料試用期間は10日間ですが、期限後もすぐに使えなくなるわけではなく数日の猶予はあるようです。

使い続けるならなるべく早めに料金を支払いましょう!

料金支払いメニューから

契約サーバーと期間を選びます。

最短3ケ月~。初期費用3000円と合わせて7260円~です。

クレジットカード入力に進みます

これで完了です

期限切れマークが消えて自動更新になっています!

一応確認。3カ月ごとの自動更新になっています

これでいったん終了です。

WordPressサイトの立ち上げ方法がだいたいわかったのではないでしょうか?

でも、ここからがスタートです。

まずはサイト運営を1か月!を目標にがんばってみてください!

最後までお読みいただきありがとうございました。


コメント

タイトルとURLをコピーしました