エックスサーバー&お名前.comでSSL化のワードプレスの始め方🔰

2019年6月11日

🔰エックスサーバーとお名前.comのWordPressなら

初心者でもちょっとしたコピペですぐできる!

その方法を過去に何十サイトとワードプレスサイトを立ち上げた経験のある筆者が初心者が失敗しやすそうなポイントも含め分かりやすく解説させていただきます。
たまたま立ち上げ中の北欧ヴィンテージクロニクル(https://vintage-chronicle.com/)という新規サイトを例に見ていきましょう。

【やること】
お名前.comで取得してある独自ドメインとエックスサーバー(Xserver)を紐付けて、無料SSLの設定をしてWordPress(ワードプレス)への投稿が可能になるところまで。*エックスサーバーはお試し期間中でもOKです。*無料SSLは「X10・X20・X30」プランのどれでも使えます。

下記に画像多めでわかりやすく解説しているつもりですのでぜひ肩の力を抜いてご覧ください。

あかちゃん

エックスサーバーとお名前.comでのワードプレス立ち上げの手順

まずはあなたが取得したお名前ドットコムの独自ドメインを、エックスサーバーに紐付します。
その後はエックスサーバーのみでの作業ですのでSSL化の反映時間を除けば15分程度で完了できると思います。

手順の全体像
  1. お名前ドットコムにエックスサーバーのネームサーバーをコピペ
  2. エックスサーバーにお名前ドットコムのドメインを登録(ドメイン名をコピペ)
  3. エックスサーバーでワードプレスを自動インストール
  4. wwwの有り無しの統一設定、各種リダイレクト設定

*意味がちんぷんかんぷんでも全然問題ありません。
淡々とコピペしていけば完了しますので落ち着いていきましょう。

STEP1/4 お名前ドットコムでネームサーバー設定

まずはお名前.com Naviにログインし「ドメイン一覧」へ移動

「ドメイン一覧」はここをクリック
お名前ドットコムのドメイン一覧の場所

次へ

「ドメイン一覧」の対象ドメインの「ネームサーバーをクリック」
お名前ドットコムのネームサーバー変更の場所

次へ

「ネームサーバーの変更」で対象ドメインを選択
お名前ドットコムのネームサーバーの変更

次へ

「ネームサーバーの変更」で「他のネームサーバーを利用」にチェック
お名前ドットコム 他社のネームサーバーを利用

次へ

「ネームサーバー情報を入力」して「確認画面へ進む」
お名前ネームサーバーコピペ欄

これをコピペしてください

*もともと入力されているのは削除してOK。

ネームサーバー1 ns1.xserver.jp
ネームサーバー2 ns2.xserver.jp
ネームサーバー3 ns3.xserver.jp
ネームサーバー4 ns4.xserver.jp
ネームサーバー5 ns5.xserver.jp

ボタンをクリックすると

入力内容を確認して正しければ「設定する」ボタンを押す
確認画面

ボタンをクリックすると

手続き完了になっていたらお名前.comでの作業は終了です。
お名前ネームサーバー手続き完了メッセージ

STEP2/4 エックスサーバーにドメイン登録

Xサーバーで取得したドメインを登録します。
まずはインフォパネルにログインしましょう。

**注意点**
ログインするのはエックスサーバーの「インフォパネル」です。サーバーパネル、ファイルマネージャ、WEBメールへのログインと間違いやすいので注意が必要です。
エックスサーバーのインフォパネルログイン画面

ボタンをクリックすると

「ご契約一覧」の「サーバー管理」をクリック
XSERVER ご契約一覧

ボタンをクリックすると

「サーバーパネル」の「ドメイン設定」へ移動
XSERVERのサーバーパネル

ボタンをクリックすると

「ドメイン設定」の「ドメイン設定追加」をクリック
ドメイン設定追加の場所 エックスサーバー

ボタンをクリックすると

ドメイン名を入力して「確認画面に進む」
エックスサーバーのドメイン追加設定

無料独自SSLを利用する(推奨)
高速化・アクセス数拡張機能「Xアクセラレータ」を有効にする(推奨)

ボタンをクリックすると

確認画面。正しければ「追加」ボタンを押してください。

ボタンをクリックすると

エックスサーバー パークドメイン設定完了

これで、エックスサーバーへのドメイン登録完了です。
最近ついでにSSLの設定もできるようになったので、いつの間にかSSLの設定も完了しています。(実際にサーバーに反映されるまで数十分~一晩かかることがあります。)

https(←さいごにSが付いているSSL対応のURL)であなたのドメインにアクセスしてみてエラーになるなら少し時間をおいてから確認しなおしてください。

http(←Sが付いていない)のままでもワードプレスのインストールはできるので次の工程に進みましょう。安心してください。簡単ですよ。

STEP3/4 エックスサーバーでWordpressの簡単インストール

ワードプレスロゴ
この工程はほとんどクリックだけで終わります。
開くページはエックスサーバーのサーバーパネル

エックスサーバのワードプレス簡単インストールのページ

ボタンをクリックすると

「WordPress簡単インストール」の「WordPressインストール」を選択してください。
エックスサーバーでワードプレスを設置するときの確認事項

複数ドメインを所有している場合は設定対象ドメインが、ワードプレスを設置したいドメインになっているか注意してください。

ボタンをクリックすると

「WordPress簡単インストール」
各項目を埋めて最後に「確認画面に進む」ボタンをクリック
Xサーバーのワードプレス導入画面

ワードプレス設定メモ
サイトURL欄⇒サーバーに何も入っていない場合は空欄でいいです。
ブログ名⇒後でも変えられるのでとりあえず入れてしまってもOK

確認ボタンをクリックすると、「インストールを行うと、インストール先ディレクトリ内の「index.html」が削除されます。ご注意ください。」とメッセージが出ます。これもサーバーに何も入っていなければ無視して大丈夫。
警告メッセージ

このまま「インストールする」ボタンをクリックしましょう。

最後にユーザー名とパスワードが表示されるので忘れないようにどこかにメモを残しておいてください。

あなたのドメインにブラウザでアクセスしてみて次のような画面になっていたら成功です。
hello world

これでステップの3/4は完了です。
あと一息。

STEP4/4 wwwの有り無し、http⇒https統一

SEO

今のままでもワードプレスの運用はスタートできますが、エックスサーバーの仕様で、

・サブドメインwwwが付いているサイト
・サブドメインが付いていないサイト
・http://のサイト
・https://のサイト

全く同じ内容でこの4つが出来ています。

これをどちらかに転送して統一します。
http://www.hogehoge.jpにアクセスしてもhttps://hogehoge.jpに自動的に振り分けてくれるみたいな挙動になります。

wwwの有り無しとかを統一しないといけない理由

このままの仕様でサイトを運用すると、同じコンテンツのサイトができることになってグーグルからスパムサイトのペナルティを受ける可能性があるからです。
その他にも、SEOの観点でwwwの有り無しどちらか一方に統一してSSLサイト転送することが望ましいです。

wwwあり・なしは、どちらかに統一することでSEO効果が期待できます。
もし、wwwあり/wwwなし、両方のドメインでアクセスできる状態だと、Googleからの評価そのものが分散されてしまい、SEO効果が薄れてしまいます。

被リンクの分散以外にも、重複コンテンツといった評価を受けてしまい、それによってサイトの評価が最大限に発揮できなくなり、最悪Googleペナルティを招く恐れがあります。

そのため、wwwあり/wwwなしのどちらか一方のドメインだけにアクセスできるようにし、リンクやコンテンツを1つのドメインに集中させ、サイト評価を統一することが重要です。
引用元:SEOラボ:wwwあり・なしのSEO効果について

SSL化+www無しに統一する方法

https://hogehoge.com/ ←この形式にする方法です。

エックスサーバーの管理画面で「.htaccess」というものを編集します。
言葉の意味が分からなくても問題ありません。サイトをいじり倒す必要のない多くの方は今後二度と目にしません。

不運にも(?)また.htaccessに出会う機会が有ったらその時に理解することにして、今日はあまり気にしないでください。
サイトに命令を出すためのメモ書きみたいなもんだと思っておいたらおk。

まずはその[.htaccess]を編集するためのページにアクセスしてください。

htaccess編集画面

ボタンをクリックすると

ここにコピペしてください。もともと書いてあるものは消さないように、下にでも張り付けてください。
SSLのwwwなしの場合 エックスサーバー設定

SSL化+wwwなしで統一したいときはこれをコピペ
RewriteEngine on
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://ドメイン名/$1 [R=301,L]
RewriteEngine on
RewriteCond %{HTTP_HOST} ^(www\.ドメイン名\.com)(:80)?
RewriteRule ^(.*) https://ドメイン名/$1 [R=301,L]

↑ドメイン名と.comはあなたのドメインに合わせて書き換えてください

SSL+wwwありに統一する方法

https://www.hogehoge.com/ ←この形式にする方法です。

エックスサーバーの.htaccess編集画面に以下をコピペしてください。
*もともと書いてあるものは消さないように。

SSL+wwwありに統一したいときはこれをコピペ
RewriteEngine on
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://www.ドメイン名/$1 [R=301,L]
RewriteEngine on
RewriteCond %{HTTP_HOST} ^(www\.ドメイン名\.com)(:80)?
RewriteRule ^(.*) https://www.ドメイン名/$1 [R=301,L]

↑ドメイン名と.comはあなたのドメインに合わせて書き換えてください

書き換えが完了しましたら、

http://のURLとサブドメイン有り無しのURLでアクセスしてみて、指定した形式のURLに転送されたら成功です。

ワードプレス管理画面でこんなエラーメッセージが出ていたら・・・?

これで設定は完了していますが、ワードプレスのダッシュボードに下記のエラーメッセージが出ていたら、URLの修正が必要です。
「設定 -> 一般のアドレス (URL) が SSL (https://) になっていないようです。設定をチェックしてください。」
SSLのURL エラーメッセージ

こんな時の直しかたは簡単。
ワードプレスダッシュボードの「設定」⇒「一般」に「WordPress アドレス (URL)」と「サイトアドレス (URL)」というURLを入力する欄があるので、httpをhttpsに半角で書き換えて「変更を保存」ボタンをクリックしてください。

カフェ

お疲れ様です。
以上でお名前ドットコムとエックスサーバーでワードプレスサイトを立ち上げる手順です。