Bloggerで独自ドメイン／カスタムドメインをhttps接続に設定して使用する方法

無料ブログのBloggerは独自ドメインを設定してレンタルサーバーとして無料で使うことができる。独自ドメインで有料ブログを運営する際にはレンタルサーバーの料金もかかるのが一般的だから安くても年間数千円が差し引かれるのは非常に嬉しい。機能も殆ど変わらない。個人的にGoogleフォトの高画質の写真が載せられるのとBloggerの強制の広告が出ないのが良いと思うBloggerの無料ブログの特徴が独自ドメインで引き継がれるのが嬉しい。ただし一部で新しい機能が追加されるのが遅れる場合があるかも知れないから留意しておきたい。現時点ではSSL暗号化通信（https）が二年くらい無理だったけれども今年の始めから可能になってBloggerの無料ブログと独自ドメインの機能の大きな差はなくなって来た。性能上、明らかに違うのは国別URL（ccTLD）が独自ドメインで発動しなくなる。Bloggerの無料ブログは訪問者の地域によってトップレベルドメインの「.com」が日本では「.jp」とかリダイレクトされるようになっている（ブログが国別の URL にリダイレクトされる）。独自ドメインを設定すると「.com」ならば「.com」のままで、どこの国からでもアクセスするブログになる。通常の場合と同じに戻るといって良い。追記：Bloggerの無料版の国別URLは2018年5月に廃止されてトップレベルドメインは全て「.com」に統一されて以前のものは「.com」にリダイレクト（It’s spring cleaning time for Blogger）。

Bloggerでカスタムドメインを設定する
独自ドメインのDNS設定の二つのCNAME
フォールバックサブドメインの有無
ネイキッドドメインをリダイレクトする
カスタムドメインにhttpsを使用する
鍵マークは緑でなくても構わない
独自ドメインを導入した後の修正点

Bloggerでカスタムドメインを設定する無料ブログから独自ドメインへ移行するにはBloggerのウェブの設定の「公開しています」で設定する。Bloggerでは特にカスタムドメインと呼ばれる。最初は無料ブログで登録したURLの「ブログアドレス」だけが表示されているけれども独自ドメインを導入するためには次の「カスタムドメイン」を使う。開くと入力欄の他に「ドメインを購入」のボタンもあってGoogle Domainsでカスタムドメインのためのドメイン名を購入することができる。注意点としてBloggerの独自ドメインにはサブドメインしか使えないみたいだ。かりにメインサイトを想定する場合でもドメイン名の前に「www」を付けたURLのブログになる。何も付かないネイキッドドメインのURLをリダイレクトすると実質的に同じなので、Bloggerで独自ドメインのメインのサイトとしてブログを運営するならばカスタムドメインに加えて設定すると良いと思う。 Bloggerのカスタムドメインの登録画面

カスタムドメイン｜Blogger

最初にブログに使用するドメイン名を入力して保存する。サブドメインでなくてはエラーが生じるので、独自ドメインの前に「www」や「blog」などを半角コンマ（.）で区切って付けて登録しなくてはならない。すると画面が切り替わって初回ではBloggerに導入する独自ドメインの管理サイトのDNS（ドメインネームシステム）レコードを編集するようになる。Bloggerのウェブの編集で応答サーバーが「http」と表示されているけれども「https」を使いたい場合は後から変更できるから、そのまま、登録して大丈夫だ。独自ドメインのDNS設定の二つのCNAME

[Name, Label or Host（名前、ラベルまたはホスト） ]

新規のサブドメインに関して一律に「ghs.googlehosted.com」を入力

[Destination, Target or Points to（宛先、ターゲットまたは参照先）]

ブログのGoogleアカウントに関して固有のコンテンツのホスト名を入力

Bloggerのウェブの編集でサブドメインのコンテンツのホスト名が「ghs.google.com」になっていてカスタムドメインの詳細ページの「ghs.googlehosted.com」と合わない。どちらでも登録できるし、大丈夫なので、特に気にかけず、入力して良いと思う。個人的にウェブの編集よりも詳細ページの記述が新しいみたいなので、何かしら改善されているのではないかと「ghs.googlehosted.com」を選んでいるんだ。スマホ／タブレットだとウェブの編集の表示が欠けていて最後まで読み取れない場合があるので、ロングタップで冒頭から次の行までコピー＆ペーストを長めに行って部分的に抜き取ると大丈夫だ。独自ドメインの管理サイトのデザインによって入力の仕方が変わって分かり難いかも知れない。僕がBloggerブログで使用しているスタードメインを例にするとユーザー管理ツールのDNSレコード編集からレコード追加で「ホスト名」と「タイプ」と「コンテンツ」を設定するんだ。

ホスト名：新規のサブドメイン

タイプ：CNAME

コンテンツ：ghs.googlehosted.com

ホスト名：ブログのGoogleアカウント

タイプ：CNAME

コンテンツ：固有のコンテンツのホスト名

それぞれ、三つの内容で、CNAMEを介してホスト名とコンテンツのどちらにどちらを入力するのかが惑わしいので、注意を要する。もう一つDNS設定に優先度の入力欄があるけれども「0」のままで大丈夫だ。僕は直ぐに使用できたけど、DNSレコード編集や設定したカスタムドメインが作動するまで二十四時間くらいかかる場合もあるらしい。 Bloggerのカスタムドメインを登録した画面

公開しています｜Blogger

ウェブの編集へ戻って保存すると完了してブログのアドレスがカスタムドメインと元々のBloggerのサブドメインの二列で表示される。後者から前者へはリダイレクトで自動的に転送されるし、削除されずに残っているので、カスタムドメインを右端の「×」から削除するとBloggerのサブドメインに又戻る。フォールバックサブドメインの有無2020年9月からフォールバックサブドメイン」の項目が追加された。以前の「不明なファイルを使用しますか」という項目に等しく、カスタムドメインと共通のドメインからもう一つのサブドメインを設定するとことができる。通常の使用では必要なくて例えば他のサイトから移転するときなどにサイトアドレスが合わなくてもエラーページを回避してリダイレクトしりすることができる。

関連ページ

Bloggerのフォールバックサブドメインについて

ネイキッドドメインをリダイレクトするブログに設定した「www」などのカスタムドメインへ任意で何も付かないネイキッドドメインをリダイレクトできる。ネームサーバーのDNS設定からＡレコードを介してネイキッドドメイン／独自ドメイン自体にGoogle IPの四項目を参照するように個別に設定する。使用されるGoogle IPの四項目

216.239.32.21

216.239.34.21

216.239.36.21

216.239.38.21

カスタムドメインの設定と合わせるとDNSレコードに六つの記載が追加されるようになる。

ホスト名：ネイキッドドメイン

タイプ：Ａ

コンテンツ：216.239.32.21

ホスト名：ネイキッドドメイン

タイプ：Ａ

コンテンツ：216.239.32.21

ホスト名：ネイキッドドメイン

タイプ：Ａ

コンテンツ：216.239.34.21

ホスト名：ネイキッドドメイン

タイプ：Ａ

コンテンツ：216.239.36.21

ホスト名：ネイキッドドメイン

タイプ：Ａ

コンテンツ：216.239.38.21

DNS設定の入力欄の優先度は全て「0」のままで、大丈夫だ。ウェブの編集のブログのアドレスのカスタムドメインの編集から入ってネイキッドドメインからカスタムドメインへリダイレクトするチェックボックスをオンにして保存すると完了する。僕は失敗して、二回、繰り返した。たぶんDNS設定に時間がかかるせいかも知れないので、ある程度、待つべきだと思う。カスタムドメインにhttpsを使用するBloggerは今年の始めからSSL暗号化通信のhttpsがカスタムドメインでも設定して使用できるように変わったのが非常に嬉しい。無料ブログのBloggerのサブドメインはデフォルトでhttps接続へ移行したから今ではもう設定する必要すらもなくなってしまっている。主にメールフォームやコメント欄で送受信の安全性が確保される。そしてGoogleのサイト評価にもhttpsが加味されるので、SEO対策（検索エンジン最適化）としてブログの検索エンジンからのアクセスアップに多少とも役立たないとはかぎらない。是非とも付けておきたいと考える。無料でLet's Encryptから証明書が自動的に発行される。カスタムドメインで設定するのは容易くてウェブの編集の設定のHTTPSの「HTTPS の使用」を「はい」にするだけで良い。時間が何分かかかるようなので、待っていて、もう一度、開き直すと完了している。さらに「HTTPS リダイレクト」も「はい」にするとhttpからのアクセスがhttpsに自動的に切り替わるから良いと思う。ブラウザの保護された接続の詳細画面

保護された接続｜Let's Encrypt

ブログがhttps接続になるとブラウザのアドレスバーで左端に鍵マークが付いたサイトアドレスが表示される。クリック／タップして「保護された接続」と出てくれば作動しているのを確認できる。詳細からSSL暗号化通信の状況と証明書情報なども分かるようになっている。普通は鍵マークとhttpsが緑になる。それ以外だとサイト内にhttpのリンクが残っているのが原因だったり、httpsが十分に作動してないからソースコードを修正しなくてはならない。鍵マークは緑でなくても構わないBloggerの場合はhttpのリンクが残っているブログでもhttpsが正確に作動するみたいだ。ところがブラウザのアドレスバーの鍵マークが出ても緑にならなくて僕は混乱してしまった。確認すると「保護された接続」と表示されるし、間違いなく、大丈夫なので、一体、何なんだ。調べて気付いたのはテンプレートのデザインのせいだった。デバイスによって反映しない場合もあるけど、2017年の公式テーマのContempoとSohoとEmporioとNotableなどを使っているとアドレスバーの色が変わって暗めか濃いめだと鍵マークが同調して白か灰色になる。だから飽くまでもブログにhttpsが作動しているかどうかはアドレスバーの鍵マークの色ではなくてクリック／タップで「保護された接続」と表示されるかどうかで確認するべきなんだ。振り返れば無料ブログの頃にもそうだったのに独自ドメインでhttps接続が上手く行くかと心配しながら殊更に焦らされたわけだ。ブラウザのアドレスバーのデザインはChromeやSafariなどに適用される。HTMLのmetaタグのtheme-colorでカスタマイズされている（アイコンとブラウザの色）。HTML編集で明るめか淡めの色に変更するとブログのhttpsの鍵マークは緑で表示されるようになる。<meta name='theme-color' content='色指定'/>2017年の公式テーマでは独自タグの<b:include data='blog' name='all-head-content'/>による自動挿入だからカスタマイズするのはちょっと厄介だ。消すとファビコンなどの他のソースコードが幾つも出なくなってブログに支障を来すので、当該の独自タグの上にtheme-colorのmetaタグを追加してデザインを上書きするのが無難かも知れない。