★★★ たった "1日" でできるWordPressブログの作り方講座 ★★★ はじめてみる

WordPressがhttpsにならない・鍵マークが出ない…5つの対処法

あれ?WordPressをSSL対応したのにhttpsにならない。
ブラウザで鍵マークも出ない...なぜ?
それはページ内にhttpのままのリンク/画像/etcがあるから。それさえ直せれば鍵マークが出るよ。

SSL(https)化したのに鍵マークが出ない・・・

そんなトラブルがWordPressでは多々あります。

そこで過去の経験と相談事例をもとに、
WordPressでhttpsにならない時の対処法 をまとめます。

お困りな方は次を試してみてください。

対処0.WordPressでのSSL化の基本手順

まずWordPressでのSSL基本手順について。

一番楽なのは Really Simple SSL を使うこと

サーバーがSSL対応してる前提ですが、
プラグインからササッと設定できて便利なんですよね。

ここでは解説しません、詳しくは次記事参照

WordPressを一発でhttps化!Really Simple SSL の設定手順
WordPressのhttps化(SSL化)に頭を悩ませている方は多いですよね。そこでここではブログを一発でhttps化できるとても便利なプラグイン「Really Simple SSL」の導入手順について説明します。本当に面倒な手順なしでできるのでおすすめです。

まあ便利なプラグインなんですが・・・条件によってはhttps(ブラウザのアドレス欄に鍵マークが出ない)にならないことがあります。プラグインは決して万能ではないのです。

そういう時の対処法、それを紹介していきます。

対処1.データべ―ス上でhttpリンクを置換

WordPressでは次のようにデータを保存してます。

  • 記事本文やカテゴリーやタグ
    -> 投稿記事のタイトルや本文、タクソノミー、カスタム投稿など。これらはファイルではなく、MySQLというデータべ―ス上に保存される。
  • 画像とか音楽とかPDF
    -> 記事内に埋め込みされる画像/音楽/動画/PDF/etc...。そのままファイルとして保存される。URLから直アクセス可能。

このうち、https化の障害になるのがデータべ―ス です。

データべ―ス上に保存された記事内のテキストリンクとか画像リンクとか・・・そういうのが残ったままだとSSL化してもhttpsにならないんですよね。

そこで一括で置換するいい方法があります。

Search Regexpを使ってhttpをhttpsに置き換え

それはこの Search Regex を使うこと

こちらのプラグイン

Search Regexpを使ってデータべ―ス上のhttpをhttpsに置き換える

メニューから「プラグインを追加」を開き、
検索欄に「search regex」と入力すれば出てきます。

それをインストール・有効化しておいてください。

そしたら「ツール」ー>「Search Regex」をオープン

出てきた画面で必要な項目を入力し、
最後に「全て置換する」を押すだけです。(次画像参照)

赤枠で囲った部分に注目

Search Regexでデータデータ上のhttp://をhttps://に置き換えする時の設定例

各入力・選択項目は次のようにしてください。

  • 検索
    ここには http のままのトップURLを入力。たとえば https://fukuro-press.com のような感じで。ドメイン名だけではダメ(危険)
  • 置換
    ここには https に修正したトップURLを入力。たとえば https://fukuro-press.com のように。ここもドメイン名だけではNG。
  • フラグを検索
    デフォルトでは「大文字と小文字を区別しない」が選択されている。もし選択されているなら選択解除すること。
  • ソース
    特に構う必要なし。ただし投稿・固定ページ以外も置換したいなら、それらを置換対象にもできる。

置換する前によ~く確認!!!

覚悟ができたら「全て置換」を押してください。

記事数にもよりますが、数分ほどで終わるはずです。

あと念のため、置換中は画面を閉じないでください。

対処2.Elementorで URLを変更 を実行する

Elementorは導入している人も多いはずです。

この有名なプラグイン

Elementorプラグインがhttpsにならない原因になっていることも・・・

これがhttpsにならない原因になることもあります。

もし心当たりがあるなら、次手順を試してみてください。

1.ツールページを開く

WPメニューから「Elementor」ー>「ツール」

WPメニューから「Elementor」ー>「ツール」を開く

その中の「URLを変更」タブをクリック。

すると このような画面 が出てきます。

「URLを変更」タブをクリック。

この画面の左入力欄に非httpのトップURL(例 : https://fukuro-press.com )を、右側にhttpsのトップURL(例 : https://fukuro-press.com)を入力して「URLを変更」をクリック。

左側に非httpのトップURLを、右側にhttpsのトップURLを入力して「URLを変更」をクリック

これで http:// => https:// に置き換わります。

2.CSSを再生成する

最後に「一般」タブを開きます。

「URLを変更」を実行したら「ファイルを再生成する」を実行するのも忘れずに。

そして「ファイルを再生成する」をクリック。

これでElementorでもhttps化は完了。

Elementorユーザーなら一度試すべきですね。

対処3.ウィジェット内のhttpをhttpsに置き換え

これは意外と盲点かもしれません。

  • ウィジェット内のhttp画像リンク
  • ウィジェット内のhttpテキストリンク

こういったウィジェット内に http:// から始まるリンクがある場合、それも "手動" で置き換えないとダメなんです。設置済みウィジェットを1つ1つ念入りに確認してください。

この場面では Search Regex も役に立ちません。

例えば次のHTMLウィジェットがあるとします。

httpsに対応してないウィジェット例

httpsに対応してないウィジェット例

実際はこんなHTMLになっている

<div>
<img src="http://example.com/wp-content/uploads/2018/09/prof.png" width="50%" class="alignnone size-full wp-image-2143"><br>
HN : フク郎<br><br>
<div style="text-align: justify;">自分の「好き」をブログで表現したい、情報発信をしたい方に役立つWordPress術・ブログ構築術を発信中。</div>
<br>
</div>

見ての通り http:// から始まってる画像リンクが...

これだとSSL化に失敗。httpsになりません。

次のように修正する必要がありますね。

↓ 修正後のHTMLの内容

<div>
<img src="https://example.com/wp-content/uploads/2018/09/prof.png" width="50%" class="alignnone size-full wp-image-2143"><br>
HN : フク郎<br><br>
<div style="text-align: justify;">自分の「好き」をブログで表現したい、情報発信をしたい方に役立つWordPress術・ブログ構築術を発信中。</div>
<br>
</div>

http:// ⇒ https:// に書き変え

ウィジェットは意外と盲点です。

鍵マークが出ないなら「怪しい」と見直すべし。

対処4.CSS・JSコードでのURL指定を修正

すこし専門的な話になります。

自分でテーマカスタマイズできる人・・
自分でCSS/JavaScriptコードを書けちゃう人・・

そういう人が遭遇しがちな問題です。

たとえば次のCSSを見てみてください。

#header-logo{
  background-image: 
    url(http://example.com/path/tp/header.jpg);
}

このコードのように background-image などURL指定できる属性を使っている場合、そのURLが http:// のままだとhttpsになりません。Ajaxなどの通信処理についても同じです。

テーマの style.css を編集したり、カスタムCSS/JavaScriptコードを追加している人。そこらへんが大丈夫かどうか、よ~~く確認しておきましょう。

思わぬところに伏兵ありです。

対処5.もし自力で解決できないなら…

httpsにならない原因は単純じゃありません。

そして知識なしで行う作業はリスクを伴います。

そういう人のために、次のトラブル解決サービスも運営してます。

WordPressトラブルの相談・解決します
https://coconala.com/services/902008

お困りならお気軽にご相談ください。

基本的にはどんなトラブルにも対応します。

ここまでの対処法まとめ

ここまで紹介した対処法一覧

以上、WordPressでhttpsにならない対処法でした。

The following two tabs change content below.

フク郎

昔はプログラミングに熱中していたが、ブログとWordPressに興味を持ち始め今はサイト・ブログ作りが生きがい。自分の「好き」をブログに変えたい、情報発信したい人に役立つWordPress術・サイト構築術を発信中。一日一歩楽しんでブログ構築できるように読みやすい&楽しい記事作りを心がけています。