【WordPress】常時SSL化してみたよ

いや…ほんと、大変だった…。まず始めに証明書を取るんだけど…証明書は本来「rinpress.com」で取るんだけど、間違えて取っちゃって…。さくらインターネットに問い合わせたら、「諦めてください…」って(笑)3年で3,200円…勉強代と思えば高くないか…。でも、無駄にしてしまったのがもったいない…。ちなみに…もしさくらインターネットのサーバーのWordPressを常時SSL化しようとしているなら…この記事を最後まで読んでほしんだ…。(いや…むしろ最後だけで良いかもしれない…)

証明書の取得

さくらインターネットのラピッドSSLの証明書はこちらから申請すれば…

簡単に…行かなかった!というか…ちゃんとメールが飛んできてそれに従えば簡単なんだけどね…
これが、飛んできたメールの内容…

■認証ファイルのアップロード手順

▽STEP1
会員メニューにログインし、「契約情報」の一覧から該当サービスの「サー
バ証明書」ボタンをクリックしていただき、詳細画面より認証ファイルをダ
ウンロードしてください。

・会員メニュー – 契約情報
https://secure.sakura.ad.jp/menu/service/index.php

▽STEP2
ダウンロードした認証ファイルを、申請時に指定したFQDN(コモンネーム)
配下にアップロードしてください。

※認証ファイルは以下のいずれかのURLに配置
認証ファイル名は、xxxxxxxx.txtです

例)
http://<申請時に指定したFQDN(コモンネーム)>/aaaaaaaa/bbbbbbbb/xxxxxxxx.txt
https://<申請時に指定したFQDN(コモンネーム)>/aaaaaaaa/bbbbbbbb/xxxxxxxx.txt

※「/aaaaaaaa/bbbbbbbb/」のフォルダはお客さまで作成ください

▽STEP3
認証用ファイルが配置されたことを認証局が確認し、証明書を発行します。

※認証局は、自動的に認証ファイルのクローリングを行っています
認証ファイル設置後、証明書が発行されない場合は、お問い合わせください。

注)公開して都合が悪そうな内容は、当方で伏せ文字にしています。

色々調べてみると、認証方法が何回も変更されているみたいなんだ。
この方法はあくまでも2017年7月12日の情報ってことで理解してほしいんだ。

その他の手順についてはさくらインターネットで丁寧に説明してくれているので、そちらを見てほしいんだよ。

一応、ここに書かれている範囲で「https://」でアクセスできるようにはなるんだけど…
色々と…エラー的なのがたくさん発生するんだよね…

Chromeのデバック(PF12を押すと表示される)で見ると…「Mixed Content」ってのがたくさん発生するんだ…
これを一つずつつぶしていくんだよ…

まずは…WordPressの設定やらウィジェットやら…

WordPressの設定にサイトのURLを入れているところがあったらそこを変更しないと…探してみると…
ダッシュボードから「設定」→「一般」→「WordPressアドレス(URL)」&「サイトアドレス(URL)」
に…僕の場合は…「https://rinpress.com」から「https://rinpress.com」に変更

ウィジェットも丁寧に点検して…「http://」を発見したら適宜変更…
僕の場合は…以下が対象になったんだ…
* カスタム検索エンジンの設定
* ブログ村へのリンク
* Googleアドセンスの設定

他にも直したかもしれないけど…こんなもんだったかな…?

各記事の「http://」退治

本気で一つずつ退治していったら、時間がかかりすぎてやってられないんだ…。そこで色々と調べてみると…

なるほど…「Search Regex — WordPress プラグイン」ってプラグインを使えばいいんだね!早速インストール!
内容を見ながら、部分的に一括変換!とっても便利!

ここで本気でつまずく…

ここまでは順調だったんだけど…
トップページを表示したときはちゃんと表示されるんだけど…そこから別のページに移動すると、画面構成が崩壊しちゃんだ…
結構長時間いじってたから、目撃した人もいるんじゃないかな?

「ああじゃねぇ~こうじゃねぇ~」うわーっ!!!ってこういう状態になると超イライラするんだよね。

そんな時にこんな記事を発見!

ん?WordPressのバグなん?
これって…この記事の通りに関数を直接指定に書き換えるより…根本的に解決したほうがいいんじゃねぇ???
ってなって…PHPのコードを色々と読み始める…当然だけど…僕はPHPのコードを読めない(笑)もう、SE辞めたしねぇ(笑)
読んで読んで…結局わからず…

ふぅ~あきらめかけた時に、このサイトを見つける!

うわぁ~同じ現象だぁ…リンク先に入ってみる…

ちょ…いろいろ調べていて「違うだろぉ~!」って勝手に決めつけていたやつが正解だった…orz
これをやってみたら…見事にブラウザのURL表示欄に「保護された通信」って出るようになりました!

やったね!

最後にブログカードが…

少しページの内容を確認してみると…ブログカードが表示されていない…
これだと…(諸事情により)アクセス数が稼げない(笑)

慌てて手段を調べてみる…


このプラグインが使いやすいみたい!

早速入れると…どうやら「[blogcard url=”xxxx” title=”xxxx” content=”xxx”]」って記述しなければならないみたい…

じゃぁってことで、すでにChromeにインストール済みの「Create Link – Chrome ウェブストア」に設定を追加する!

Name:適当(BlogCARDなど)
Format:[blogcard url=”%url%” title=”%title%” content=”%text%”](表示の都合でカッコを全角にしています。コピペするときは半角にしてください)

これで、便利になった!

大変だけど、全部手動でブログカードを書き直した!

蛇足

この記事を書くために少し調べてたら…こんなん出てきた…

説明を見る限り…一番つまづいた設定の部分をプラグインで一気に設定してくれるみたい…おいおい…今までの苦労を返してくれ…