今さらの常時SSL化 - とっても簡単+ちょっと複雑!?

ロリポップ モジュール版PHP+WordPress4.9.8+その他いろいろでSSL化!!

スポンサードリンク

常時SSL化はSEOの観点からも必須だよ! といわれているだけに、手順を解説してくれている諸先輩の記事もとてもたくさんありますね。

私はロリポップのユーザーですが、ご存知のようにロリポップには無料でSSL化を支援してくれるサービスがあります。今回私がSSL化に利用したのがこのロリポップの [独自SSL証明書導入] の中の [独自SSL(無料)] 。SSL化に必要な作業は大きく分けて下のような 4 項目(4項目+プラスアルファ)。

やってみると分かりますが、最初の3項目にあまり極端なむずかしさはないように感じます。
(とは言っても、私も実際の “施工” の前に1か月ほどの時間をかけて、この手順を確認したのですが ^^;)

  1. サーバーの設定:独自SSLを申し込み
  2. WordPressの設定:一般設定
  3. http:// ~ を https:// ~ にリダイレクト
  4. 常時 SSL 化のための作業:プラグイン「Search Regex」を使って
    内部リンクのURL のSSL化
    ・外部リンクのURL のSSL化

:基本の第1 /  :第1の基本設定+その後の内部・外部のリンク修正の両方に関係する項目)

それに対して、4項目目のプラスアルファ 2つの部分は、それぞれ自分のサイトにどんなカスタイマイズを加えているかによって作業内容やその複雑さが違ってきますね。

ロリポップの[独自SSL(無料)] の最初の注意事項

ただ、導入の前に承知しておかなくてはいけないのは、[独自SSL(無料)] を紹介しているロリポップのページに紹介されているこの説明。

※ Let’s Encryptとその提供元のポリシーを確認・同意の上でご利用ください。また、Let’s Encryptの仕様変更等によって予告なく利用できなくなる場合もあります。ご了承ください。

もし利用できなくなるとなったら「予告なしの場合がある」というので、注意しましょう。

内部リンク:Search Regex ではできない http: → https: の修正

検証ツールは Chrome+F12

サーバーの設定、WordPress の設定、リダイレクトの設定終え、Search Regex で内部リンクをすべて書き換えたつもりでもたあと、保護された通信 の表示が得られない! その私のサイトのカスタマイズ寄りの問題を教えてくれたのが、諸先輩も紹介してくれている Chrome+F12 で呼び出せる診断機能の [Console] タブです。

なんでダメなのかな?? と思ったときに、Chrome+F12 + Console タブ を見る*と、不具合箇所がリスト表示されています。

Analysing-display-of-Chrome
Google Chrome + F12
私のサイトの場合: Dynamic to Top の矢印画像

Chrome+F12 + Console タブ に表示された不具合 その1が…

私のサイトを見ていただくと画面の右下に画面上に戻るのシンボルボタンが表示されています。このシンボルは Dynamic to Top というプラグインを使って表示しているのですが、Search Regex を使った http: → https: の修正を行ったあとも、このシンボルマークが http: から呼び出されている! 処理未完成のものとして認識され、保護された通信 の表示が得られない原因のひとつでした。

ところが Dynamic to Top には矢印画像やその情報を保存する場所を指定する場所などありません!

表示をページごとの条件(ページのサイズなど)に合わせて自動的(ダイナミック)に矢印画像を配置するだけでなく、設定環境も WordPress のそのときの設定に合わせて決めてくるのかな? と想像(勝手に深読み^^; )し、プラグインとしての Dynamic to Top を停止し、再度有効化

(矢印のデザインを少し変更した以外は何もせず)それだけで、Chrome+F12 + Console タブ のエラーメッセージはなくなりました。

私のサイトの場合: サイドバーに表示しているシンボルアイコン

Chrome+F12 + Console タブ に表示された不具合 その2は…

私のサイトの PC モードのディスプレイにはシンボルアイコン(のつもり^^; )を表示していますが、これもまた、保護された通信 の表示が得られない原因のひとつでした。

このシンボルアイコンはサイドバーにテキスト ウィジェットを配置して、その中に貼り付けているのですが、そのURLが旧型の http: だったのです。Search Regex ですべて書き換えられるんだろうと思っていた私には、これが死角でした。

この症状はけっこう大事なことを示していますね。

Search Regex は検索・置き換えの対象をいくつかのオプションとして切り替えられるようにできていますが、サイドバーに直接書き込んだ・仕組んだ設定は、Post xxx のオプションの対象ではなく、WordPress の設定に含まれるものだということ。

よく考えれば「あたり前!」なことだと思いますが、WordPress の一般設定 のほかにも、WordPress にどんなカスタイマイズをしたのかは自分以外には分かりませんから、Chrome+F12 + Console タブ の情報を落ち着いて、注意深く読んでください、ということですね。

参考として、基本中の基本

*: 私は、サイトのデータ+データベースのバックアップを取ってから、修正作業にかかりました。サイトに直接手を加えましたわけですが、この方法はあまりお勧めできない方法かも知れません。

スポンサードリンク

私のサイトはまだローカル化が完全に終わっていません。それがサイトのデータを直接修正に行った理由です。
ただ、SSL化のような作業は本来なら、

  1. サイトのローカル化をしておいて、
  2. ローカルで修正・検証を終え、
  3. サイトのデータをバックアップした上で、
  4. OKとなったらファイル全体をサイトにアップロード

するという手順をとりたいところです。

言うまでもないと思いますが、WordPress で何らかの修正を加えて表示を確認するときには、サーバー側とブラウザー側の両方でキャッシュを削除してページをロードし直す必要があります。
もちろん、サイトのデータ+データベースのバックアップを取ること! あるいは、ローカルで検証を終わらせるのがベストだろうと思います。

このあとは、基本手順を逆にたどりながら備忘録を続けてみようと思います.
to be continued …
スポンサードリンク

返信を残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です