さくらインターネットのレンタルサーバーでWordPressのブログを常時SSL化したので忘れないように手順だけメモ。(自分用)

さくらインターネットのレンタルサーバーでWordpressのブログを常時SSL化したので忘れないように手順だけメモです。自分にしか分からないレベルで書いていますのであしからず…

参考にしたサイトは

「WordPressをhttpからhttpsにSSL化した全手順まとめ(エックスサーバー環境)」
https://nelog.jp/wordpress-ssl

こちらです。こちらのほうが信頼性が遥かに高いので、ぜひ参考にどうぞ。
自分のはただのメモです。

手順は

・データベースとファイルのバックアップを行う
・さくらインターネットの無料SSLボタンをポチる
・ワードプレスの設定のURLをhttps://にする

・プラグインSearch Regexでサイト内のURLを2種類置換
・.htaccessにリダイレクト用のコードを追記
・メニューのリンク等、自分でURLを打った部分は手作業でhttps://ドメイン名に変更
・Feedlyへのリンク(ガジェット)は一旦除去
・ニコニコ動画の埋め込みサムネと埋め込みプレイヤーのURLをSSLに置換

こんな感じです。

 

やったのはざっくりとこれだけです。

・データベースとファイルのバックアップを行う

まずバックアップをしましょう。データベースとファイルの2種類です。

1.データベースはさくらインターネットのコントロールパネル → phpmyadmin から。
保存するときは .zipで圧縮にしないとインポートできないので .zipで圧縮しましょう。データ自体はSQL形式でのバックアップです。
拡張子は「ファイル名.sql.zip」のようになります。

2.ファイルはFileZillaなどのファイル転送ツールでダウンロードするだけです。

 

・さくらインターネットの無料SSLボタンをポチる

自分はさくらインターネットのレンタルサーバーのスタンダードプランなので、
無料で常時SSL化が出来ます。

さくらのコントロールパネルから、ドメイン/SSL設定で、自分の登録した独自ドメインの「SSL」>「証明書」の部分で「登録」をクリック。
ちなみに更新は自動でやってくれるそうです。

そうしたら、http://のアドレスとともに、https://にもアクセスしてログイン出来るようになります。

(反映には数時間かかります…と書いてありますが、一時間以内くらいで反映されるかと思います)

http://でもhttps://でもサイトが表示されて、アクセス出来るという不思議な状態になります。

 

・ワードプレスの設定のURLをhttps://にする

さて、この段階ではワードプレスはhttp://のほう(SSLじゃないほう)にアドレスが設定されているので、
「設定」>「一般」から
・「WordPress アドレス (URL)」と
・「サイトアドレス (URL)」
の2つを、 https://自分のドメイン名 に変更します。

http://leez.info
にしていたら
https://leez.info

にするという感じです。小文字のsを付けるだけ。

ここをミスるとログインできなくなるので、両方同時に設定できているかよく確認して「変更を保存」します。

両方というのは
・「WordPress アドレス (URL)」と
・「サイトアドレス (URL)」
の2つのことです。

・プラグインSearch Regexでサイト内のURLを2種類置換

ツイートでも書いたのですが、

・http://ドメイン → https://ドメイン
・http://www.ドメイン → https://www.ドメイン

の2種類を、ワードプレスのプラグイン「Search Regex」で置換しました。

詳しくは先ほどのサイト
https://nelog.jp/wordpress-ssl
によく書かれています。

ワードプレスでは画像などのパス(URL)は相対パスではなく絶対パスなので、ここはURLを書き換えてあげる必要があるのです。
ここも一応、ミスると後戻り出来ないので、注意してやりましょう。


・.htaccessにリダイレクト用のコードを追記

これはリダイレクト用です。古いリンクからアクセスが来た場合も、勝手にサーバーのほうでsをつけてSSL化したサイトに飛ばしてくれる、というイメージです。

.htaccessは、サイトのルートにあるファイルなので、ファイル転送ツールでダウンロードしたものをエディタで追記して、アップロードし直してあげます。

このファイルは重要なファイルなので、ミスったときに古い方に戻せるように、必ずコピーを作っておきましょう。
(というか最初にバックアップを取っているので大丈夫だと思いますが)

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTPS} !=on [NC]
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

このコードを.htaccessの冒頭に追記します。そうして保存したらアップロードして終わり。



番外編:

https://ドメイン名
となっているサイトの中に
https://ドメイン名/blog/
のようにして、サブディレクトリ以下にワードプレスを入れている場合もあると思います。
その際は、

https://ドメイン名/
のディレクトリ(ルート)にある .htaccess の頭に先程の

<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTPS} !=on [NC]
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

を追記(.htaccessファイルがない場合は新規作成)して、

同様に
https://ドメイン名/blog/
のディレクトリにある .htaccess の頭にも
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{HTTPS} !=on [NC]
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>

を追記するとうまく動作しました。
※.htaccessはよく分かっていないので、あまりアテにしないで下さい。

ちなみに .htaccess のパーミッションは共有サーバー(レンタルサーバー)の場合は604に設定するそうです。
参考:「何となくで使ってた「.htaccess」について勉強し直す」

その他の参考サイト:
「.htaccessの書き方(SSLに転送)」
・「常時SSL化。.htaccessでhttpからhttpsへ301リダイレクトする方法」


・メニューのリンク等、自分でURLを打った部分は手作業でhttps://ドメイン名に変更

プラグインを使ってhttp://をhttps://にしたのですが、サイトのメニューなど、自分でカスタマイズした部分のURLは入れ替わっていなかったので手動で変更しました。

・Feedlyへのリンク(ガジェット)は一旦除去
Feedlyの登録ボタンをガジェットに追加している場合は、https対応をする必要があるようです。
feedlyの登録ガジェットが原因で https:// の認証にエラーマークのようなものが出ました。

対応策は

「https(SSL対応)にしたときに必要になるFeedlyボタンの対応方法」

https://homepage-reborn.com/2016/08/17/https%EF%BC%88ssl%E5%AF%BE%E5%BF%9C%EF%BC%89%E3%81%AB%E3%81%97%E3%81%9F%E3%81%A8%E3%81%8D%E3%81%AB%E5%BF%85%E8%A6%81%E3%81%AB%E3%81%AA%E3%82%8Bfeedly%E3%83%9C%E3%82%BF%E3%83%B3%E3%81%AE%E5%AF%BE/

こちらにありますのでご参考まで。
Feedlyで取得した埋め込みURLの中の http:// を https:// に変更するだけです。

・ニコニコ動画の埋め込みサムネと埋め込みプレイヤーのURLをSSLに置換

これが一番予想外でした。2016年より前くらいに埋め込んだニコニコ動画の「埋め込みサムネ」と「埋め込みプレイヤー」は、常時SSL化すると表示されなくなってしまいました。

これは、ニコニコ動画の埋め込みサムネと埋め込みプレイヤーのリンクが共に

http://

になっていたのが原因です。(当時、常時SSL化に対応していなかったようです。)

これの対応策は、

プラグインSearch Regexを使って、
【埋め込みプレイヤー】
http://embed.nicovideo.jp/ を https://embed.nicovideo.jp/ に置き換える

【動画情報とサムネイル埋め込み】
http://ext.nicovideo.jp/ を https://ext.nicovideo.jp/ に置き換える

この2つをするだけです。

詳しくはコチラ。
「SSL化したサイトの、ニコニコ動画の動画埋め込み対応が楽チンにできたよ!(wordpressの場合)」
https://mofday.info/ssl-nicovideo-embed/


また、必須ではないですが

同様に
http://www.nicovideo.jp

https://www.nicovideo.jp
に変更しておいても良いと思います。旧埋め込みコード内で使われています。

以上です。


※記事に誤りがあった場合は @so_meru までご連絡頂けると幸いです。
また、この記事は内容及び動作の保証をするものではありません。
常時SSL化はご自身の責任で行って下さい。