MENU
カゲオ
管理人
陰ながらサイト運営を応援するブログ「カゲサイ」の管理人です。
WordPressやブログについてかゆいところに手が届く解説を心がけています。

WordPress

その他

運営中のサブブログ

主に私のデスク周りアイテムを紹介しています。
在宅作業の参考になるかもしれません。

サブブログ|デスク環境構築サイト運営中⇒見てみる

WordPressのCloudflare設定【簡単・無料・高速化】

当ページのリンクには広告が含まれています。
WordPressのCloudflare設定
Cloudflaretとは?

世界最大級のネットワーク(データセンター)

通常はレンタルサーバーをそのまま使いますよね。
最近のメジャーなレンサバは、障害などのトラブルもほとんどなくなってきたため、普段はそれで問題ありません。

ただもしもレンタルサーバーになにか起きた時、Cloudflareに切り替える方法も知っておくと役に立つかもしれません。

設定も楽ですし、無料で使えるので、ぜひ覚えておきましょう。

管理人のデスク環境ブログも運営中です

在宅作業の参考になるアイテムがあるかもしれません。
デスク周りのアップデートを検討されている方はぜひ覗いてみてください。

目次

管理人のデスク環境ブログも運営中です

在宅作業の参考になるアイテムがあるかもしれません。
デスク周りのアップデートを検討されている方はぜひ覗いてみてください。

Cloudflareの特徴やメリット

超ざっくりいうと、サーバーの保険です。

やり方さえ覚えておけば、普段はCloudflareでサイトを管理しておき、Cloudflareに障害が発生した場合は、レンタルサーバーに切り替えることもできます。

このように運用することで、両方同時に障害が発生しない限り、サイトが閲覧できなくなることはありません。

デメリットは?

デフォルトのままだと使い勝手が悪いことです。
当記事の解説をやっておけば問題ありません。

そのほか無料版だと、アップロードに100MB(メガバイト)の制限があります。
100MBというと、めちゃくちゃデカいMP4動画を無理やりアップでもしなければ、まずいくことはありません。

※.ちなみにYouTubeやTikTokなど外部の埋め込み動画は、制限と関係ないのでご安心を。

Cloudflareの登録方法

STEP

無料プランを選択する

Cloudflareサインアップ

サインアップをクリック

Cloudflareプラン選択

0ドル/月のWebサイトを追加をクリック

STEP

登録する

Cloudflare登録

Eメールパスワードを入力
サインアップをクリック

パスワード条件
・8字以上
・数字を入れる
・特殊文字を入れる
・先頭または末尾の空白NG

STEP

サイトを追加する

CloudflareにWebサイトを追加する

Webサイトまたはアプリケーションを追加するをクリック

Cloudflareドメイン追加

ドメインを入力後→続くをクリック

Cloudflareプラン選択

無料プランを選択後→続くをクリック

Cloudflare DNSレコード確認

続くをクリック

STEP

レンタルサーバーでネームサーバーを変更

Cloudflareネームサーバーをコピー

2つのネームサーバーをコピーする
このままCloudflareのページは開いておいてください。

レンタルサーバーはmixhostを前提に解説していますが、他のサーバーでもやり方は同じです。

ミックスホストマイドメイン

ログイン後、マイドメインをクリック。

ミックスホストネームサーバー編集

変更したいドメインのネームサーバーを編集をクリック

ミックスホストネームサーバー変更

カスタムネームサーバーを使用を選択
Cloudflareのネームサーバー2つを貼り付ける
ネームサーバーを変更をクリック

ミックスホストネームサーバー変更完了

変更が正常に保存されました!と表示されればOK。

Cloudflareネームサーバーをコピー

Cloudflareのページに戻って、続くをクリック

STEP

クイックスタートガイド設定

Cloudflareセキュリティ設定

セキュリティの向上をクリック
常にHTTPSを使用するをクリック

Cloudflare HTTPS設定

ONにする
保存をクリック

Cloudflare クイックスタートガイド設定終了

概要をクリック
終了をクリック

STEP

ドメインと接続状況の確認

Cloudflareドメイン接続状況確認

トップページを開いて、ドメインがアクティブになったら接続完了です。

Cloudflareとレンタルサーバーを切り替える方法

Cloudflareに障害が発生したときのために、ネームサーバーを切り替える方法を覚えておきましょう。

mixhostでドメインを管理している場合

mixhostネームサーバー変更方法

は、先ほど解説したの操作からネームサーバーを開きます。
デフォルトネームサーバーを使用を選択
ネームサーバーを変更をクリック
変更が正常に保存されました!が表示されればOK。

お名前.comでドメインを管理している場合

お名前.comネームサーバー変更方法

お名前.comにログイン
変更したいドメインのネームサーバー下リンクをクリック

お名前.com他のネームサーバーを利用

ドメインにチェックを入れる
他のネームサーバーを利用を選択
ネームサーバー情報を入力欄にお使いのレンタルサーバーのネームサーバーを入力する。
確認画面へ進むをクリック

お名前.comドメインプロテクション設定

設定しないを選択

お名前.comネームサーバー変更を確定

設定するをクリック

お名前.comネームサーバー変更完了

ネームサーバーの変更完了が表示されればOK

Cloudflare基本操作

ドメインを選択する

Cloudflare ドメイン選択

ログインしたら、設定するドメインを選択してください。

言語を日本語にする

Cloudflare言語設定

右上の選択項目から日本語を選ぶ

サイトを追加する

Cloudflare サイトを追加する

トップページでサイトを追加するをクリック。
→以降は登録方法の解説と同じです。

ネームサーバーを確認する

Cloudflareネームサーバー確認方法

左サイドバーからDNSをクリック

Speed最適化

主に読み込み速度の向上を図れます。

コンテンツの最適化

Cloudflare コンテンツの最適化

①Speed
②最適化
③コンテンツの最適化

Cloudflare Fonts

Cloudflare Fonts設定

2024年3月時点、まだベータ版ではありますが、Google Fontsを利用している方はONにしておきましょう。
読み込み速度を向上させます。

Rocket Loader

Cloudflare Rocket Loader

ONにしましょう。
JavaScriptが含まれるページの読み込みを短縮します。

Auto Minify

Cloudflare Auto Minify

すべてチェックしておきましょう。
なおコード圧縮系のプラグインは不要になります。

プロトコルの最適化

0-RTT 接続再開

Cloudflare 0-RTT 接続再開

①プロトコルの最適化
②0-RTT接続再開をONにする。
サイトに接続したことがあるユーザーの読み込みを短縮します。

Caching構成

Cloudflare キャッシュ構成

①Caching
②構成

ブラウザキャッシュ TTL

Cloudflare ブラウザキャッシュTTL

キャッシュ(保存)の期間を指定できます。
頻繁に情報を更新するサイトであれば、1〜3日。
ほとんど更新しないサイトであれば1週間〜1ヶ月あたりが良いでしょう。

ブラウザキャッシュの仕組み

キャッシュの仕組みイメージです。

ページルールを作成する

Cloudflareの効果を特定のページだけ除外します。
例えば、WordPressの管理画面記事のプレビューではキャッシュ機能は必要ないためです。

Cloudflare ページルール作成

①ルール
②ページルール
③ページルールを作成

管理画面のキャッシュを無効にする

Cloudflare ページルール WordPress管理画面を追加

ドメイン/wp-adminy/*と入力
パフォーマンスを無効にするを選択
ページルールを保存および デプロイをクリック

プレビューのキャッシュを無効にする

Cloudflare ページルール WordPressプレビュー画面を追加

ドメイン/*preview=true*と入力
パフォーマンスを無効にするを選択
ページルールを保存および デプロイをクリック

サイトを削除する

Cloudflare Webサイト削除方法

ログイン後→①概要→②Cloudflareから削除をクリック

Cloudflare Webサイト削除

削除をクリック

アカウントを削除する

Cloudflare マイプロフィール項目

マイプロフィールをクリック

Cloudflare このユーザーを削除する

このユーザーを削除するをクリック

Cloudflare ユーザー削除警告

ユーザーを削除をクリック

結論:Cloudflareとレンタルサーバーの2刀流がベスト

以上、WordPressでCloudflareを使う方法を解説しました。

保険としてのCloudflareは大いにありですね。
5〜6年前はもう少し複雑な感じでしたが、UIもどんどんブラッシュアップされて、今は選ぶだけで十分なパフォーマンスを発揮してくれます。

ぜひ挑戦してみてください。

WordPressのCloudflare設定

この記事が気に入ったら
フォローしてね!

シェアしていただけると励みになります
  • URLをコピーしました!

記事への質問等はこちらからどうぞ

コメントフォーム

※日本語が含まれない内容は投稿できません。

目次