ワードプレスHTTPS化(常時SSL化)！バリュードメイン新規取得からエックスサーバーの設定方法

バリュードメインで新規独自ドメインを取得後、エックスサーバーに登録。サイト全体をHTTPS化(常時SSL化)してワードプレスをインストールした時の設定方法や手順を画像と共に全部まとめました。HTTPS化には無料独自SSL「Let’s Encrypt (レッツ・エンクリプト)」を利用。
これから初めてワードプレスでホームページやブログを開設してみようとしている方に役立てば。

参考までに手順をざっと書くと以下のような感じです。

バリュードメインでドメインを新規取得
エックスサーバーで使うための設定
HTTPS化（常時SSL）する方法
WordPressのインストール方法
URLを正規化する方法
WordPressの管理画面での設定

慣れている方はすんなり終わるでしょうが、初めての方は時間がある時にゆっくり設定していくことをおすすめします！
前提としまして、バリュードメインとエックスサーバーのユーザー登録は済ませてあるとしています。

https(常時SSL化)のメリット
独自ドメインの新規取得方法
1. 取得したいドメインを探し新規購入
エックスサーバーへの設定方法
取得したドメインを紐づける方法
HTTPS化（常時SSL）への変更の仕方
簡単！ワードプレスインストール方法
URLを統一して正規化する方法
ワードプレスの管理画面でHTTPS設定
SSL証明書の確認方法

https(常時SSL化)のメリット

サイトのセキュリティ強化
SEOに有利
表示が早くなる
サイト自体の信頼性のアップ

SSLとは、インターネット上での通信「を暗号化」する技術のことです。
そのため、未然にデータや情報の盗聴を防ぎます。通販サイトなんかは、クレジットカード決済を取り扱うので既にSSL化されていますね。
Googleも推奨し検索順位にも関わってきます。また導入後のことを考えればメリットがとても大きいです。

手間は掛かってしまいますが、あのGoogleがHTTPSを推奨しているので、SEOを意識したサイト作成をするなら今のうちに導入すべきです。
昨今はSSLも無料で利用可能になってきましたので、今から独自ドメインでサイトを運営するならhttpsではじめる方が良いです。

という事で、丁度新しいドメインの取得を考えていましたので、当サイトもhttps(常時SSL化)ではじめからスタートする事にしました。
URLをみて頂くと分かるのですが、以下のように安全なサイトとなっています。

一般の方がここを見ているのかと言えば、あまり見ていないかもしれまん。しかし、今後は目に付くようになるでしょうし、やはりGoogleがHTTPSを推奨しているので見逃せないですね。

SSLを提供する会社（認証局）が幾つかあり料金も様々です。シマンテック・ウェブサイトセキュリティ、セコムトラストシステムズ株式会社、GMOグローバルサイン株式会社などが有名です。
無料と有料の違いは、信頼性が高いかという事です。有名な認証局の証明書を使っているならサイト上に表示する事も出来まので、安全性のアピールになります。

但し、SSLの暗号化の強度は変わりません。
個人サイトで、そこまでする必要性があるかは個人によるかと思いますが、企業はしっかりしておいた方がいいと思います。

エックスサーバーでは、SSL証明書「Let’s Encrypt (レッツ・エンクリプト)」が無料且つ無制限に設定できるので、今回はこちらの設定をします。
無料ですが、主要なスポンサーもついていて怪しいものではありません。

独自ドメインの新規取得方法

私はバリュードメイン、ムームードメイン、エックスドメインでドメインを取得しています。
今回は、バリュードメインで取得した際の説明となります。
ムームードメインや他のドメイン会社での取得方法もあまり変わらないと思います。

取得したいドメインを探し新規購入

まずはバリュードメインにアクセスし、自分が欲しいドメインを検索し、欲しいトップレベルドメインに空きがあるか探します。
https://www.value-domain.com/

トップレベルドメインとは、「com」「net」「jp」の部分の事です。

「空きドメイン検索」に取得したいドメインを入力して下さい。

そうすると、購入出来るトップレベルドメインが表示されるので、欲しいトップレベルドメインの「購入」をクリック。

そうするとドメイン登録画面に移動します。

自分の個人情報を世界に発信したくない場合は、ドメインの名義（WHOIS情報）を代理公開する。

OKをクリックすると、自分の個人情報がバリュードメインに変わります。

確認したら支払い方法の設定になります。

私は自動決済は何かあった際に怖いので、クレジットカード手動決済でドメイン代金を支払います。
心配性なので･･･

クレジットカード手動決済をクリックすると金額を入力する箇所がでてきますので、金額をコピペして、次の画面で「内容確認」をクリックします。

エラーですwww

入金額を正しく入力してください。
10 円～5,000,000 円まで指定可能となっております。
戻るにはここをクリック

とあるのでクリックして元の画面に戻ります。

1,253 のコンマ（,）を消します。
次の画面で「内容確認」をクリックします。

認識されました！

良ければ決済サイトへをクリックします。

決済に進むをクリック。

クレジットカード決済の必要事項をご入力をしたら、決済するをクリック。

決済が完了しました。

これで、バリュードメインで新規取得が出来ました。
あなただけのドメインが新規で作れましたね！

↑必ず押して、VALUE-DOMAINに戻ってください↑

とあるので、その指示に従います。

しかし！なんと、まだ「ドメイン・サーバーの購入は完了しておりません」と出るではないか！

お手数ですが、ブラウザの更新ボタンを押して、再読み込みを行ってください。

と表示がありますので、再読み込みを行います。
そうするとドメイン名の登録に課金金額が表示されました。

下にスクロールすると内容をご確認の上、問題なければ「ドメインを登録」を押してください。
となるのでドメイン登録をクリック！！

この設定でよろしいでしょうか？
よろしければ「OK」を押してください。

とでるのでOK！

現在処理中です。暫くお待ち下さい。

のあとに

お申し込み、誠にありがとうございます。正常に登録できました。

と表示されたら完了です！ご苦労様でした！

念のためwhoisをクリックすると･･･

WHOIS代行は有効です
※登録者情報の入力項目はお客様の情報となりますが、WHOISでは全ての項目が弊社の情報で公開されます。

と表示されます。
これで自分の個人情報を世界に発信しなくて済みます。

再度念のためWhois – ドメイン調査ツールで調べてみます。
http://www.cybersyndrome.net/whois.cgi
ちゃんとバリュードメイン側が代行してくれていますね！
これで尚安心！

新規ドメインを取得後、そのURLにアクセスしてみると･･･

サーバーが見つかりませんと表示が出てきます。
まだドメインを取得しただけで、サイトを表示する場所の設定をしていないので当たり前ですね！

続いて、取得したドメインをエックスサーバーで使う設定をします。

https://www.value-domain.com/

エックスサーバーへの設定方法

バリュードメインで取得したドメインをエックスサーバーで使うにはネームサーバーを変更しなければなりません。
その設定方法の説明です。
エックスサーバーは、レンタルサーバ会社の中では少し金額が高いですが、その分高性能なのでおすすめです！

エックスサーバーにログインし、ネームサーバーをクリックします。
https://www.xserver.ne.jp/

ネームサーバーを変更・切り替え画面に移り、今はバリュードメインのネームサーバーが自動で設定されています。

これをエックスサーバーのネームサーバーに変更します。
1～5設定して構わないです。

ネームサーバー1：ns1.xserver.jp（ 219.94.200.246 ）
ネームサーバー2：ns2.xserver.jp（ 210.188.201.246 ）
ネームサーバー3：ns3.xserver.jp（ 219.94.200.247 ）
ネームサーバー4：ns4.xserver.jp（ 219.94.203.247 ）
ネームサーバー5：ns5.xserver.jp（ 210.188.201.247 ）

注釈に、

※当サービスで取得したドメインは、エックスサーバーのネームサーバーが設定された状態です。

と記載があるように、ネームサーバーの変更が手間な方なエックスサーバーでドメインを購入する事をおすすめします。
しかし、数百円程度全体的に高いので、そこはご注意下さい。

エックスサーバーのネームサーバーをコピペしたら、保存するをクリックします。

この設定でよろしいでしょうか？
よろしければ「OK」を押してください。

とでるのでOK！

正常に変更しました。と表示されましたら完了です。

戻るには「ここをクリック」をおしてみると。

エックスサーバーのネームサーバーに変わっていたら成功です！
ネームサーバの反映には、数時間～24時間程度くらいかかります。

取得したドメインを紐づける方法

エックスサーバーの設定ページから、取得した独自ドメインを紐づけます。

エックスサーバーを利用しているので、まずはエックスサーバーにアクセスします。
サーバーパネルにログインをします。

ドメイン設定をクリックします。

ドメインの追加をクリックします。

取得したドメインを記入して、ドメインの追加（確認）をクリックします。

以下のドメインを追加しますか？と表示されるので、ドメインの追加（確定）をクリックします。

ドメイン設定の追加を完了しました。設定内容は以下の通りです。

と表示されればあとは待つだけ！
こちらも数時間～24時間程度くらいかかります。

ＵＲＬ、ドキュメントルートは念のためメモしておくと良いです。

ドキュメントルートとは、サーバ上に公開するためのサーバー上のディレクトリ（フォルダ）です。

エックスサーバーの場合、

※「www」有り・無し両方のURLでアクセスが可能です。

とあるので、このままだと二つのURLからアクセスできますのでSEO上あまり好ましくありません。
こちらは後ほど統一します。

ドメインの一覧に戻りますと、今登録したドメインが追加されています。

因みに、この状態で登録したドメインにアクセスすると･･･

「無効なURLです」として、

設定の反映待ちか、存在しないアドレスです。
しばらく時間を置いてから、再度アクセスをお試しください。

と表示がでます。
暫くして、アクセスしてみると･･･

このウェブスペースへは、まだホームページがアップロードされていません。

と表示がでればネームサーバーも浸透してましたので、ファイルをアップロードすればインターネット上にあなたのサイトが公開されます！

HTTPS化（常時SSL）への変更の仕方

次にワードプレスをインストールする前にHTTPSに変えます。
先に変えておけば、あとでHTTPSに変更する手間が省けます。
既にワードプレスで記事を多く書いている方は、リンクURLの変更とか諸々が大変です。
因みにHTTPSにはSSL証明書が必要となり有料でしたが、無料独自SSL「Let’s Encrypt (レッツ・エンクリプト)」が開始されたため誰でも無料でHTTPS化ができるようになりました。

エックスサーバーのサーバーパネルへログインし、ドメインのSSL設定をクリックします。
https://www.xserver.ne.jp/

SSLを設定したいドメインを選択します。

独自SSL設定の追加を押します。

独自SSL設定を追加する（確定）を押します。
CSR情報(SSL証明書申請情報)を入力する、はチェックに入れなくて大丈夫です。

SSL新規取得中です。しばらくお待ちください。

と表示がで、

独自SSL設定を追加しました。

と画面表示が切り替わりますので待ちます。

SSL設定の一覧を見てみると、アドレスがhttpsに変わっています。
この状態で実際にアクセスしてみると･･･

httpsが反映されていないので、斜線が入ったりしています。
各主要なブラウザでURLを確認してみると･･･

グーグルクロームはプライバシーエラーとなり、「この接続ではプライバシーが保護されません」と表示されます。

ファイヤーフォックスは安全ではない接続となり、「安全な接続ではありません」と表示されます。

インターネットエクスプローラーは証明書のエラーとなり、「この Web サイトのセキュリティ証明書には問題があります。」と表示されます。

1時間程度時間がかかる場合もありますが、私の場合は20分ほどで完了しました。

「このウェブスペースへは、まだホームページがアップロードされていません。」

という独自ドメインのネームサーバーが完了した際に表示された画面に変わります。
これでHTTPS化は完了です！

エックスサーバーのサーバーパネルのSSL設定をみると「独自SSL」が1個と表示されています。

次に、ワードプレスをインストールします。
インストールの仕方は簡単なのですぐ終わります！

簡単！ワードプレスインストール方法

エックスサーバーのサーバーパネルのホームページ「自動インストール」をクリックします。

ドメイン選択画面でインストールしたい独自ドメインを選択します。

「プログラムのインストール」に変えて、「WordPress日本語版」の「インストール設定」をクリックします。

ここでインストールするワードプレスの各種設定をします。

インストールURL：ワードプレスをインストールするドメイン選択（後ろの枠は空白でOK）
ブログ名：サイト名・ブログ名を記入（後で変更可能）
ユーザー名：ワードプレスの管理画面にログインする際に使用
パスワード：分かりにくいもの！adminとか推測されるものは厳禁！
メールアドレス：ユーザーのメールアドレス
「自動でデータベースを作成する」にチェックが入っているか確認

最後に「インストール（確認）」をクリックし、確認画面に移ります。

インストールを行うと、インストール先ディレクトリ内の「index.html」が削除されます。ご注意ください。

と表示が出て、初心者の方は躊躇してしまいそうですが、気にせず「インストール（確定）」をクリックして下さい。
「index.html」は不要なので安心してください。

WordPress のインストールを完了しました。

と表示されたら、WordPress のインストールが完了しました。
そこに表示されているID、パスワードなどは必ずメモをとっておくかpdfや画像（スクショ）で保存しておきましょう。

では、実際に取得したURLにアクセスしてみてください！
ワードプレス公式のテーマでサイトが表示されるはずです！

で！もう一つお忘れのことが有りませんか？

URLを統一して正規化する方法

今回は、はじめからHTTPSでサイトを運営する事が前提でした。
そのため今の段階ですと、

http://1bocci.com/
https://1bocci.com/
http://www.1bocci.com/
https://www.1bocci.com/

の4URLがネットには存在していることになります。

※「www」有り・無し両方のURLでアクセスが可能です。

とHTTPSの設定時にも複数のURLのことは表示されていましたね！

このままですとSEO上よくありません。
「SEOなんて関係ねー」という方はこのままでもいいかと思います。

正規化する場合は、まずエックスサーバーのサーバーパネルのhtaccess編集をクリックします。

ドメイン選択画面で編集したいドメインを選択します。

「この機能は上級者向けの機能です」と表示されますが行います！

htaccess編集を選んで下さい。

ここでミスをしてしまうとエラーがでて、超大変なことになるかもしれないので、心配性の私は記載されているものをコピペします。

wwwあり・なしを統一してドメインを正規化する方法

wwwなしに統一する方法。
私はなしに統一しています。

RewriteEngine on
RewriteCond %{HTTP_HOST} ^www\.1bocci\.com$
RewriteRule ^(.*)$ https://1bocci.com/$1 [R=301,L]

wwwありに統一する方法。

RewriteEngine on
RewriteCond %{HTTP_HOST} ^1bocci\.com$
RewriteRule ^(.*)$ https://www.1bocci.com/$1 [R=301,L]

「$」がないとホスト名が前方一致になります。

httpからhttpsへのリダイレクトの仕方

RewriteEngine on
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L]

を追加します。

そして、htaccessを編集する（確認）を押し、htaccessを編集する（確定）を押します。

これで、http://1bocci.com/にアクセスするとhttps://1bocci.com/にリダイレクトされます。
ついでに、あと1つ手を加えてみましょう。

index.php（html）のあり・なしの統一方法

重複コンテンツの回避のために下記の二つファイルをどちらかに統一します。
1bocci.com/
1bocci.com/index.php（またはhtml）

恐らく「なし」にされているサイトが多いかと思いますので「なし」で統一します。
下記のタグを.htaccessに追記します。

RewriteEngine on
RewriteCond %{THE_REQUEST} ^.*/index.php
RewriteRule ^(.*)index.php$ https://%{HTTP_HOST}/$1 [R=301,L]

私はphpを使用しているので上記になります。htmlならindex.phpをindex.htmlに変更すれば大丈夫です。
「https」か「http」でもどちらでもいいと助言をもらったので、私は「https」にしています。

まとめると･･･

となります。
<IfModule mod_rewrite.c>
</IfModule>
は忘れないように。

httpからhttpsへの301リダイレクトの方法も他サイトで見たことがあると思いますが、今回ははじめからhttpsなので301リダイレクトは使っていません。
元のURLのページ評価を引き継ぎたい場合は、ただのリダイレクトではなく、301リダイレクトにする必要があります。
サイトの移転などでドメイン自体が変更になる場合やサイト構成の変更によるURL変更など、URLが変更される場合には基本的に301リダイレクトで対応します。

canonicalタグでURLを正規化する方法

<head>内にcanonicalタグを記述し、サーバーにアップロードすればURLが正規化出来ます。
記述したcanonicalタグの「URL」がGoogleに認識され統一されます。

こちらは、ワードプレスにログイン後「外観」＞「テーマの編集」に移動し、header.php等に追加します。
※子テーマを使用している場合や使用のテーマによってはheader-○○.php等かもしれません。

<head>
<link rel="canonical" href="https://1bocci.com">
</head>

上記を記述してしまうと全ページ同じになってしまいます。
これでは重複コンテンツと見なされ、ペナルティを受けるかもしれません。
ワードプレスなら自動でページごとにcanonical URLを表示することも出来ます。

まず、wp_headにcanonical URLを出さないように、function.phpに以下の1行を記述します。

remove_action('wp_head', 'rel_canonical');

remove_actionの記述がないと1ページに2つ反映されます！

今ワードプレスでは自動でcanonicalタグが生成されます。
ですが、トップページには生成されません。※私の何かが悪いのか？
そのため、この一行はとても大事！

そして、header.phpのhead要素内に以下を記述します。

<?php if ( is_home() ) {
$canonical_url=get_bloginfo('url')."/";
} 
else if (is_category())
{
$canonical_url=get_category_link(get_query_var('cat'));
}
else if (is_page()||is_single())
{ 
$canonical_url=get_permalink();
}
if ( $paged >= 2 || $page >= 2)
{
$canonical_url=$canonical_url.'page/'.max( $paged, $page ).'/'; 
}
?>
<link rel="canonical" href="<?php echo $canonical_url; ?>" />

これで各記事ごとにcanonical URLが表示されるようになります。

WordPressの超有名プラグイン「All in One SEO Pack」をインストールする場合は、「Canonical URL」にチェックを入れれば自動で設定されます！
インストールしない場合でも自動で設定されるようになっていますが、トップページには設定されなかった･･･
ここは自分でもソースをみて確認して下さい。

Google Search Console にHTTPSを追加する

Google Search Console（旧ウェブマスターツール）は、自分のサイトがGoogleの検索エンジンからどのように評価されているかが色々確認できるお役立ちツールです。

こちらに「https://1bocci.com/」「https://www.1bocci.com/～」と「http://1bocci.com/～」「http://www.1bocci.com/～」の計4サイト分を登録し、且つ「wwwなし」URLに統一します。
参考 Google Search Consoleでwwwあり・なしの統一が出来ない

ワードプレスの管理画面でHTTPS設定

ここの変更を忘れないで！

長かったバリュードメインでの新規ドメイン取得からエックスサーバーへの設定方法。そしてワードプレスHTTPS化！
その道のりももう終わりに近づいています！

ワードプレスにログインして下さい。

設定＞一般をクリックすると一般設定の画面になります。

エックスサーバーでワードプレスをインストールした際のサイトタイトルなどが表示されています。

何も変更していない状態ですと「WordPress アドレス (URL)」「サイトアドレス (URL)」がhttpsになっていません。
この部分をhttpsのURLに変更して、「変更を保存」を押せば完了です。

一度強制ログアウトされるかもしれませんが、普通にログインすればOK！

SSL証明書の確認方法

一先ず、自サイトを開いた時に、「緑色の鍵マーク」だったり「保護された通信」と表示されていれば大丈夫！

Let’s EncryptのSSL証明書が有効か確認するには、鍵マーク部分にカーソルをもっていくと「サイト情報を表示」とでますのでクリックします。
画像はグーグルクロームでみた場合です。

次に証明書：有効という部分をクリックして下さい。

そうすると発行者に「Let’s Encrypt (レッツ・エンクリプト)」と表示がされていますので、ご自身のサイトはSSL化が出来ているという事が証明書情報からでも確認ができます。

ほんとーーーにお疲れ様でした！
これで、全て終了です！
今後の注意点は、今新しくWordPressのサイトを作成したので「http://～」で始まる画像URLなどはありません。
そのため、「http://～」で始まる画像リンクなどは使用してはいけません。
使用すると黄色警告マークが出てしまいます。
外部リンクは「http://～」から始まっても大丈夫です。その場合は、プロトコル相対URLは使わないように気をつけて下さい。サイトによってはアクセスできませんので。

ではでは、さっそくワードプレスにログインして、テーマなどを選択して使ってみてください！
https://www.xserver.ne.jp/