WordPressサイトのSSL対応(HTTPS化)手順のまとめ【さくらサーバー】

公開日: : WordPress, サイト制作

スポンサーリンク

先週頃にこのサイトをSSL対応しましたのでその流れについてまとめておきます。HTTPS化にはただSSLの証明書を購入しておしまいではなく、サイト上の多くのhttpをhttpsに変更する必要があり思いのほか手間なのでSSL化する際は注意してください。
ちなみにこのサイトのサーバはさくらサーバー(スタンダードプラン)です。

きっかけ

Google AdsenseのページにSSL化を勧める文言が出てきたので実施しました。それだけでなく、最近ではGoogleがSSLを推奨する動きがあり、SEOに影響しかねないようなので導入したいという気持ちもありました。

ただ、このサイト自体はメールアドレスやクレジット番号など扱うサイトではないので正直必要なのだろうか?という気持ちもありましたがとりあえず試してみました。

SSL購入

ラピッドSSLから購入しました。さくらインターネットの場合、基本的な流れは公式サイトのサポートに書いてあるのでそちらを参考にしてください。個人向けであれば年間1600円くらいで運用ができます。

SSL化に向けたサイト修正

動作確認方法

httpsで正常に表示されているかどうかはページを読み込んだ時のURLバーの鍵マーク付近が緑色で「保護された通信」の表示が出ているかChromeブラウザで確認しました。

灰色のままの場合は「F12」や右クリックで「検証」を選ぶと開発者モードになるのでそこの「Console」タブに表示されるエラーが無いかどうか見て一つずつ解決していきました。一部ワーニングでも緑色にならない場合があるようですので注意してください。

直書き修正

httpsに変更する際に、注意すべきはimgやlink、script、iframeタグあたりのURLです。aタグは読み込んでいるわけではないので変更する必要は必ずしもあるわけではないです。私は各ブログページやテンプレート(外観>テーマの編集)で該当する箇所を一つずつhttpからhttpsに変更していきました。

ただ、後述しますが、さくらインターネットの場合Wordpress用のSSL対応プラグインが用意されており、そちらを利用すれば過去記事のhttpはhttpsに全て勝手に書き換えてくれるみたいなのでそちらも活用してください。

また、「ACR WEB アクセスランキング」など他サイトのサービスの読み込みもURLがhttpsではない場合変更が必要です。このサービスの場合SSL対応しているようなので問題ないですが、https未対応のサービスの場合はあきらめるという選択肢もやむを得ないと思います。

Zenback修正

このサイトはZenbackという自サイトや他サイトを相互リンクさせるサービスを利用していますが、自サイトのリンク表示がサムネイル表示の場合、その画像は変更前のhttpのURLを使っているため鍵が付かなくなります。これはページによってサムネイルが出る出ないがあるので気付くのに時間がかかりました。

恐らく、ずっと使っていれば勝手にhttpsに変更してくれるのではないかと思いますが、いつになるか不明のためサムネイル表示をやめてテキスト表示にZenbackのページで設定変更しました。

WordPress用SSL化さくらプラグイン適用

さくらインターネットを使用していればSSL化対応のためのアシストプラグインがあったのでそれを使いました。プラグインの検索で「sakura」などと調べると出てくるので導入しましょう。

このプラグインはhtaccessの編集や過去の投稿コンテンツの置換を全て自動で行うことができるプラグインです。ただ、固定ページやテンプレート(「外観」>「テーマの編集」)は必ずしもそうなっているわけではなさそうなのでちゃんと鍵マークが付くようになっているか確認してください。

設定の一覧に「SAKURA RS SSL」が出てくるのでそちらで設定ができます。

公式サイトに導入の方法が書かれているのでそちらをご参考ください。

htaccess修正

さくらのプラグインでhtaccessを自動で書き換えてくれているみたいですが、通常WordPressはarchivesフォルダ以下のhtaccessのみカバーしているようです。このサイトは一つ上のフォルダのindex.phpをいじることでトップページにarchivesが付かないようにしていますので、HTTPS化の際にはそのディレクトリのhtaccessをarchivesフォルダのhtaccessを参考にして変更しました。
この変更は必要な方は実施してください。

.htaccess)

# BEGIN Force SSL for SAKURA
# RewriteしてもHTTPS環境変数を有効にする
SetEnvIf REDIRECT_HTTPS (.*) HTTPS=$1

# 常時HTTPS化(HTTPSが無効な場合リダイレクト)
<IfModule mod_rewrite.c>
RewriteEngine on
RewriteCond %{ENV:HTTPS} !on
RewriteCond %{REQUEST_URI} !/wp-cron\.php$
RewriteRule .* https://%{HTTP_HOST}%{REQUEST_URI} [R=301,L]
</IfModule>
# END Force SSL for SAKURA

(参考:index.php)

<?php
/**
 * Front to the WordPress application. This file doesn't do anything, but loads
 * wp-blog-header.php which does and tells WordPress to load the theme.
 *
 * @package WordPress
 */

/**
 * Tells WordPress to load the WordPress theme and output it.
 *
 * @var bool
 */
define('WP_USE_THEMES', true);

/** Loads the WordPress Environment and Template */
require( dirname( __FILE__ ) . '/archives/wp-blog-header.php' );

Google Analytics設定変更

Google Analyticsを使用している場合はアドレスをhttpsのものに変更します。

まとめ

SSL証明書を購入してサイトをHTTPS化しました。思いのほか面倒なのでこれからSSL化するという方はちゃんと心構えをしていた方がいいです。

スポンサーリンク
  • このエントリーをはてなブックマークに追加

関連記事

WordPressサイトのSSL対応(HTTPS化)手順のまとめ【さくらサーバー】

先週頃にこのサイトをSSL対応しましたのでその流れについてまとめておき

【Google Charts】動的にグラフを更新する方法

はじめに Webサイト上でグラフを描こうと思った場合、いくつかのJa

体重変化量計算シミュレータ【ダイエット/肥満】

ツール本体 入力 カロリー入力 1日の余剰摂取/消費カロリー

おサイフケータイ対応ストレージ32GBのSIMフリースマホまとめ【2017年秋版】

はじめに SIMフリーの格安スマホのおサイフケータイ機能付きのもので

リクルート期間限定ポイントの有効な使い道

はじめに  先日クレジットカードの見直し活動の一環でポイント還元率の

初心者がお金を貯めるための節約・財テク手法まとめ【ポイント還元・投資・税金対策】

はじめに  最近なるべく節約しようと思い、お金周りに関して色々調べて

動画講座を効率的にキャプチャして復習する方法

はじめに  最近、動画媒体の講座などをたまに視聴しています。独学だと

→もっと見る

  • Author : ががんぼ
    プログラミングやWeb関係で気付いたことについてメモしていく予定。だいたいが備忘録ですが、自分でサンプルを作って動かしてみたりしています。
PAGE TOP ↑