デジタルライフ ブログ運営

WordPressで運営しているブログをhttps化する方法

投稿日:2016年2月19日 更新日:

スポンサー

https化したかったのは2つの理由

このブログを先日https化しました。ブラウザのアドレスバーのところに鍵のマークが付いてますが、これがあればこのサイトは安全だってことです。

Chromeでは緑の鍵マークが付く

Chromeでは緑の鍵マークが付く

 

なんでこのブログをhttps化したかったのかって言うとですね、大きく2つの理由があったんです。まずはGoogleがhttpsであるかどうかが検索結果に影響を与える可能性があると言ったこと。そして2つめがhttps化に個人的にすごく興味があったってことです。

検索順位にhttpsは影響を与える可能性がある

ウェブマスター向け公式ブログにこのような記述があります。

このランキングの変更は、グローバルでクエリの 1% 未満にしか影響しませんが、これから長い期間をかけて強化していきます。全体的に見ると、このシグナルは良質なコンテンツであるといった、その他のシグナルほどウェイトは大きくありません。https は、優れたユーザー エクスペリエンスを生み出す多くの要素のうちの 1 つです。

今後、より多くのウェブサイトで https が使用されることを期待しています。ウェブの安全性をさらに強化しましょう。

HTTPS をランキング シグナルに使用しますより

検索順位っていうのはコンテンツの質など色々な要素で決められているので、ブログをhttpsにしたからと言って検索順位がすぐに上がるわけじゃありません。ここにも書かれているようにもっと大事な要素(良質なコンテンツであること)もあります。良質なコンテンツを作るっていうことの方が大事。

でもサイト(ブログ)の安全性っていうのも大事だと思うんですよ。より安全にブログを見てもらうっていうこともぼくは考えたいなと思うんです。将来的にはhttpsであることが今よりもっと重要視されるようになるかも知れませんしね。

https化で自分自身がスキルアップできる

今回実際にブログをhttps化して分かったことは、これをやることによって自分自身のスキルアップになったってこと。

https化する時には色々な作業をやりました。たとえばこんなこと。

  • レンタルサーバーにSSLの申込み
  • データベースのバックアップ
  • ワードプレスのアップデート
  • プラグインを使ってのURLの置換
  • サーバの設定

その他にも不具合が見つかるたびに調べ物をしたりしたので結構な時間がかかってしまったんですけど、かなり勉強になりました。今まで知らなかったことを知るっていう喜び、https化ができたという達成感なんかは堪りませんね!

https化の大まかな流れ

今回ぼくが実際に行った、このブログのhttps化について順に書いていきたいと思います。人によって運営しているサーバやブログシステムも違うと思うんですが、誰かの参考になればと思います。

https化に際してこの記事を参考にさせていただきました。内容がとても充実していてかなり勉強になりましたね。こういう記事を書いてくださる方がいて本当に嬉しいです。ありがとうございます!

ブログの完全HTTPS化を完了、HTTPからHTTPSへの移行プロセスを共有 | 海外SEO情報ブログ

まず初めにぼくのブログ環境について。

  • サーバ:エックスサーバー
  • ブログシステム:Wordpress(バージョン 4.4.2–ja)

この順でぼくは作業を行いました。詳細については各記事を見てください。

エックスサーバーでSSLを申し込む

全部自分でやるとめっちゃ大変そうですけど、エックスサーバーでは特に面倒な手続きなしで簡単にできてしまいました。かなり拍子抜けでしたね。httpsでアクセスできるようになるまで2時間くらいだったかな。めちゃくは早くてビックリしました。エックスサーバーはかなり気に入ってます。

データベースのバックアップ

WordPressではデータベースを使って記事やその他の情報を記録しています。今回は記事に書かれているURLを変換しないといけません。

万が一失敗してしまうと記事の内容が変な風に書き換わったり、消えてしまう可能性も。さらにはブログ自体にアクセスできなくなってしまうっていう最悪の事態が起きる可能性もあるんです。

だからこういう作業をする前にはデータベースをバックアップするのが絶対に必要なんですね。エックスサーバーは便利なツールが用意されているので簡単にバックアップできます。

URLの変換

ブログには記事に使用している画像やリンク、カエレバなどの画像、ソーシャルボタンなどいろいろあります。それらのURLを変更します。 これは使用しているサービスやWordpressのテーマによって大きく変わってくると思うので、もしかしたらちょっとした勘や経験が必要かもしれません。

今回はぼくの環境でやったことを書いています。

  • ブログサービス:(バージョン 4.4.2–ja)
  • テーマ:Stinger5
  • 利用しているサービス:Amazonアソシエイト

一般設定のURLを変更

これは簡単。Wordpressの管理画面でブログのURLをhttpsに変えるだけ。

“設定” → “一般”をクリック

一般設定

一般設定

2箇所のURLをhttpsに変更する。

URLをhttpsに変更

URLをhttpsに変更

.htaccessの修正

もうひと息です。これが最後の難関ですかね。サーバをあんまり触ったことのない人にはなかなか敷居が高いと思います。ぼくも結構苦手。 ここでやることはhttpでブログにアクセスされた時にhttpsに飛ばすという処理を.htaccessというファイルに書き込みます。

ウェブマスターツールの登録

ウェブマスターツールはブログをhttpsにすると新しく登録しなおさないといけません。

まずウェブマスターツールのホーム画面にアクセスしてください。そして右上に表示されている”プロパティを追加”をクリックします。

プロパティを追加をクリック

プロパティを追加をクリック

ウィンドウが表示されるのでhttpsで始まる新しいURLを入力して、”続行”をクリック。

httpsで始まる新しいURLを入力

httpsで始まる新しいURLを入力

あとは画面に表示される案内どおりにやればおしまいです。

サイトマップの送信

検索エンジンにブログの構造を伝えるために必要なXMLサイトマップを送信します。

ぼくはWordpressのプラグイン・Google XML Sitemapsを使っています。このプラグインが作ってくれるサイトマップをウェブマスターツールで登録します。

Google XML Sitemaps

Google XML Sitemaps

サイトマップのURLはWordpressの左メニューから”設定” → “XML-Sitemap”を見るとわかります。

左メニューから"設定" → "XML-Sitemap"

左メニューから”設定” → “XML-Sitemap”

“あなたのサイトマップのインデックスファイルのURL:”に書かれてあるURLがサイトマップの場所です。これをメモっておきます。

サイトマップのURL

サイトマップのURL

ウェブマスターツールを開けて、新しくhttpsで登録したサイトを開けます。左のメニューから、”クロール” → “サイトマップ”と選択してください。

"クロール" → "サイトマップ"と選択

“クロール” → “サイトマップ”と選択

“サイトマップの追加/テスト”ボタンを押すと、サイトマップのURLを入力する画面が現れます。

サイトマップの追加/テスト

サイトマップの追加/テスト

先ほどメモっておいたサイトマップのURLを入力します。そして”送信”ボタンを押して完了。

httpsで始まる新しいURLを入力

httpsで始まる新しいURLを入力

 

https化で残る大きな課題

httpsしてみたものの色々と課題も見えてきました。今のところ確認しているのはこの2点です。

GetTabInfoなどの画面キャプチャで警告

ぼくはリンクを作成する時にChromeのブックマークレットを使ってリンクを作成しています。とても便利でサムネイル画像も一瞬で作成されるのでかなり気に入っていました。

しかしhttps化と同時に問題が発生したんです。それはサムネイル画像はHeartRails Captureというサービスを使って作成されているんですが、ここで作成された画像はhttpでしか読み込むことができません。httpsにしたブログから読み込むとブログにアクセスした時に“安全でないという警告”が出てしまいます。

httpsで画像を読み込むことができないものかと思って調べてみたんですが、有料サービスを使うしか手はないようです。

HeartRails | システム提供 (SaaS/ASP)

ということでお手軽にサムネイル画像を使うことは難しいようですね。なんとかしたいな〜

A8.netの広告コードで警告

アフィリエイトプログラムで有名なA8.netですが、これも広告コードはhttpなんです。これも同じように警告メッセージが表示されてしまいます。

どうにかならないものかと思って問い合わせてみましたが頂いた回答はこのようなものでした。今のところはどうしようもないようです。

A8.netでは現在、SSL対応の広告素材はご用意がございませんが、httpsに対応しているサイトへ広告素材を掲載して頂く事は可能です。

ただ、サイト閲覧者の利用環境によってはご指摘のようなSSL通信のダイアログが表示されること等がございますので、何卒ご了承ください。

早く対応されることを願うばかりです。

食べログの店舗情報の埋め込みが表示されない

食べログにはサイト内に簡単に店舗情報を表示させるためのコードが用意されています。これもSSL化したサイトでは作動しませんでいた。

食べログの埋め込みコード

食べログの埋め込みコード

表示されるのは店名だけで、その下に表示されるべき店舗情報はまったく表示されません。

https化をやってみて思ったこと

実際にやってみるまでは大丈夫かなと心配だったんですけど、意外にすんなりとhttps化できたっていうのが率直な感想です。

昔やっていたデバッグを思い出しながら少しずつ直していくっていう作業は面白かったですね。

そしてなによりもできたという達成感ですかね。いろいろと勉強にもなりました。

すぐにhttpsにする必要があるかって言うとそんなに急ぐ必要はないと思いますが、興味があるっていう人はやってみてもいいんじゃないでしょうか。もちろんデメリットもしっかりと考えたうえでね。

-デジタルライフ, ブログ運営
-,

執筆者:

「デジタルライフ」のオススメ

Qi(チー)

これは便利!ケーブルなしでスマホを充電できるQi対応充電器

置くだけ簡単充電 最近スマホを新しくしたんですがそれに合わせてQi対応充電器というのも導入してみました。いやぁ〜これ便利ですよ。置くだけで充電できるんです。これまではケーブルを差して充電してたんですが …

使ってみようをタップ

自分のスマホをもっと便利に使わない?Google Nowの始め方

Google Nowを使うとなにが良いのか? Googleの提供しているGoogle Nowって言うのが地味に便利なので紹介します。何が便利かっていうとですね、自分の必要としている情報が一つのページに …

恥をかいていることすらわからなくなるくらい恥をかきまくれ

恥をかけるあなたは勇気ある人だ こうやってブログを書くようになって分かったことがあります。それは恥はどんどんかいたらいいってこと。 ブログを書くということは全世界の人に自分の考えを発信するということで …

あの日何してたっけ?Googleマップのタイムラインには移動履歴が残っているから見てみよう

自分の行動がGoogleマップに全部記録されている Googleが面白い機能をさりげなく追加していました。それはタイムラインと呼ばれるもので自分の移動した履歴が一目瞭然になるというものです。いつどこに …

ライトモード使用中の表示

Googleマップのライトモードにしたら元に戻せなくなってしまった

Googleマップのライトモードから戻せない ブログに地図を埋め込むことって多いですよね。そんな時によく使うのがGoogleマップです。Googleマップには地図を簡単に埋め込むことができる機能がつい …

moriはこんな人

カンボジアが自炊が大好き。不安定で次に何が起こるか分からない状態を楽しんでいます。好きな言葉は「安定なんてクソくらい」
詳しいプロフィールはこちらから

自炊の楽しさ伝えます!

自炊の楽しさをあなたのところへ伝えに行きます!

自炊デリバリー

ブログの中を検索する

読みたい記事のカテゴリーを選ぶ

今日もいろいろつぶやきます

moriのほしいもの

noteもやってるよ

Instagramもよろしくね