初心者がWordPressでSSL化！大変だったのはカエレバ張替えと全ページチェック

先日このブログを常時SSL化対応しました！

常時SSL化とは？

ウェブサイトのすべてのページを暗号化（SSL/TLS化）することを常時SSL（Always On SSL）といいます。

例えばあるサイト内でメールアドレスなどの個人情報を入力した時に、その情報が暗号化されて守られていますよーという状態です。

簡単に言えばサイト内のセキュリティ強化したよ！ということです。(ざっくり)

GoogleChromeでサイトを見た時は「保護された通信」と表示されるようになり、URLも「https://」から表示されるようになります。

Webに詳しくないゆうちきが、常時SSL化したときに大変だった「カエレバのリンク張替え」と「全ページがちゃんとSSL化しているかのチェック」についてまとめました。

SSL化の手順についてはまとめてくださっているサイトがたくさんあるので、リンクでご紹介します。

こんなこと書いてます

常時SSL化(http→https)の簡単な流れ
- 常時SSL化で参考にした記事一覧
カエレバ、ヨメレバのSSL化手順
「Search Regex」を使ってカエレバシリーズをSSL化する方法
サイト内の全ページの確認方法
SSL化(http→https)のまとめ

常時SSL化(http→https)の簡単な流れ

簡単に全体の流れをまとめてみると、

WordPressでバックアップを取る
サーバ(ミニバード)のSSL化オプションを購入
WordPressの設定からURLを変更
httpからhttpsへのリダイレクト設定
テーマの設定変更
Googleサーチコンソール、アナリティクスの設定変更
カエレバ、ヨメレバの張替え(置換でも可能)
全ページの確認

こんな感じ！

１〜６番に関しては詳しい方法をまとめてくださっているサイトが多数ありましたので、わたしが見ながら作業したページをご紹介します。

常時SSL化で参考にした記事一覧

HTTPS移行に踏み切った理由3つと、SSL化する際に頭に入れておくべきノウハウ7つ。 | 和洋風KAI
→SSL化する前に読んでおくと「本当にSSL化は必要かな？」とか「こういう時どうしたらいいか？」のノウハウで参考になりました。作業に入る前に必読。

WordPressをhttpからhttpsにSSL化した全手順まとめ（エックスサーバー環境）
→エックスサーバー環境ですが、サーバーへのSSL導入は各サーバーのサイトに説明があるかと思いますので、このページのまま進めていけばSSL化対応ができました！

エックスサーバー独自SSLが無料！WordPressサイトをHTTPS化する方法
→カエレバの商品画像をSSL化する方法とChrome のデベロッパーツールでSSL化の邪魔になっている部分を確認する方法を参考にしました。

常時SSL化の弊害となるエラー、ミックスドコンテンツに対する5つの対応策
→この記事をまとめている間に見つけた記事で、カエレバのYahooからの画像読み込みのリンク修正などについて参考にしました。

Firefoxアドオンの「FoxReplace」でカエレバ・ヨメレバのアフィリエイトリンクを一括(Multi Replace)でSSLに置換する<
→カエレバシリーズの一発置換をFirefoxでする場合。今回はプラグインでのやり方をご紹介します。

これらのサイトを見ながら進めれば、１〜６番までの作業は簡単に進めることができました。

ゆうちき

問題はカエレバ・ヨメレバの張替えと、全ページの確認！

カエレバ、ヨメレバのSSL化手順

さて、ここからが大変だった作業です。

何が大変だったかと言うと、カエレバシリーズの各ASP(Yahoo!ショッピング、7net)へのリンクをSSL化することでした。ですが！

カエレバ、ヨメレバ、トマレバのアフィリエイトリンクをSSL対応しました。ポチレバは後日。A8、バリュコマ、もしものリンクです。利用の際には正しいコードが生成さているかご確認ください。不具合があればご連絡いただけると助かります。 #カエレバ #ヨメレバ #tトマレバ
— かん吉@人気ブロガー本【三刷】 (@kankichi) 2017年2月1日

先日カエレバシリーズの作者、かん吉さんのこのツイートを発見。

これでカエレバシリーズはすべてブログパーツを再度作成して張替えすると商品画像、リンク共にSSL化対応出来るようになりました。

わたしは古い記事の確認、商品リンクでYahoo!ショッピング、7netをボタンつけてなかったものの張替えも一緒にしていたのでほぼ全ての記事を手作業で張り替えました。

しかし記事数が多い、カエレバシリーズを使って商品を紹介している記事が多い人が総張替えは大変ですよね。

そこで「Search Regex」を使ってリンクを置換で張り替える方法も載せておきます。

「Search Regex」を使ってカエレバシリーズをSSL化する方法

「Search Regex」プラグインを使用して各アフィリエイトリンクを置換して、SSL化したいと思います。

ただし、A8を利用している場合は置換でのSSL化ができません(A8の問題で)。7netをA8にしている人はこの方法を使えないのでご注意ください！

各ASPのSSL化参考記事(公式サイトより)

アフィリエイトリンクを【HTTPS対応】しました | もしもアフィリエイト公式ブログ
 広告スペースのSSL対応について | 管理画面ヘルプ | バリューコマースアフィリエイト
 A8.netのアフィリエイト広告タグがSSL化しました。
アフィリエイトリンクのSSL対応について【楽天アフィリエイト】

上記の記事を元にSSL化していきます。

「Search Regex」の使い方についてはSSL化の参考にした記事にもありますし、「カエレバがhttpsに対応！WordPress過去記事のリンク修正に便利なプラグインの紹介！ | Notes of Life」こちらの記事がわかりやすいです。

今回置換するのは各ASPへのリンクなのでそれぞれ下記の様に進めていきます。

一度「Search Regex」で置換作業をしてしまうと戻すことは出来ないので、必ず１つ１つ置換するものを確認してから保存するようにしてください。自己責任でお願いします！

Amazonアソシエイトの場合

Serch pattern・・・「http://ecx.images-amazon.com」を指定
Replace pattern・・・「https://images-fe.ssl-images-amazon.com」を指定

→読み込んでいる商品画像をSSL化

もしもの場合(２度の置換作業が必要です)

Serch pattern・・・「http://c.af.moshimo.com」を指定
Replace pattern・・・「//af.moshimo.com」を指定

→リンク部分のサブドメイン変更

Serch pattern・・・「http://i.af.moshimo.com」を指定
Replace pattern・・・「//i.moshimo.com」を指定

→インプレッション計測部分のサブドメイン変更

参考記事：アフィリエイトリンクを【HTTPS対応】しました | もしもアフィリエイト公式ブログ

バリューコマースの場合(２度の置換作業が必要です)

Serch pattern・・・「http://ck.jp.ap.valuecommerce.com」を指定
Replace pattern・・・「//ck.jp.ap.valuecommerce.com」を指定

→「http:」を削除した状態

Serch pattern・・・「http://ad.jp.ap.valuecommerce.com」を指定
Replace pattern・・・「//ad.jp.ap.valuecommerce.com」を指定

→「http:」を削除した状態

参考記事：広告スペースのSSL対応について | 管理画面ヘルプ | バリューコマースアフィリエイト

A8の場合(置換作業はできません！)

実はA8の場合SSL化に伴いURLがまるっと変わってしまっているため、置換での変更ができません。

各商品のリンクを取り直して、張り替える必要があります。

参考：アクセストレードに続きバリューコマースも SSL に対応！アフィリエイトのコードを https 化する方法

楽天の場合(商品画像を楽天から読み込んでいる場合も)

Serch pattern・・・「http://thumbnail.image.rakuten.co.jp/」を指定
Replace pattern・・・「//thumbnail.image.rakuten.co.jp/」を指定

→カエレバ商品画像のSSL化

Serch pattern・・・「http://hb.afl.rakuten.co.jp」を指定
Replace pattern・・・「//hb.afl.rakuten.co.jp」を指定

→リンクのSSL化

参考記事：アフィリエイトリンクのSSL対応について【楽天アフィリエイト】

サイト内の全ページの確認方法

ここまで作業が完了したら、あとは全ページ問題なくSSL化されているか目視で確認です。

この状態になっているか１ページずつ見ていきます。

わたしは「PS Auto Sitemap」プラグインを使用してサイト内の全記事を一覧で出して1つずつ確認しました。プラグインの設定方法は下記記事を参考にしてみてください。

PS Auto Sitemapの設定方法と使い方

プラグインで全記事を表示したら、

各記事を１つずつ開いてSSL化のエラーが出ていないか確認
カテゴリページを1ページずつ確認
タグページを確認

これで完了です！正しくSSL化されていれば、基本的にWordPressの管理画面もエラーが出ないはずです。

また「カテゴリ」ごとのページや、タグのページはどこか１ページでエラーがないことを確認できれば大丈夫だと思います。

SSL化(http→https)のまとめ

今回「Googleが常時SSL化対応していないサイトに警告を出す」という情報を見て、前々から気になっていたSSL化対応に踏み切りました。

参考：突然「保護されていません」と警告が!?Chromeの新しい安全性表示

以前から憧れていた「ももねいろ」ブログさんが常時SSL化した、というのも背中を押してくれました。

SSL化は手間もかかるし、コストもかかるし、現状何がいいのかというとはっきりわかりません。

でもこれから流れが常時SSLに向かうというのは間違いないんじゃないかなと思うので、面倒な作業を早めにやってしまった、ということで個人的にはほっとしています。

ゆうちき

このブログをこれからも大切に育てていこう！

手間をかけて対応したことで決意も新たになりました^^

セキュリティ強化された当ブログをこれからもよろしくお願いします〜。

※この記事はわたしが自分自身で調べながらSSL化した方法をまとめたものなので、実際に作業される場合は自己責任でよろしくお願いします。

では、また！