• RSS

[WP]ログインフォームをメンテナンス画面として使用できるプラグイン「Maintenance by fruitfulcode」

  • このエントリーをはてなブックマークに追加
  • follow us in feedly

公開前や改修中のページを見られたはマズい…なんて時に、サイトへアクセスしたユーザーに「ただ今メンテナンス中です」のメッセージを表示させることも多いと思います。

WordPressの場合、メンテナンスページの設定管理ができる「Maintenance Mode」というプラグインもありますが、WordPressのバージョンが 3.5 になってから個人的には「Maintenance by fruitfulcode」というプラグインを利用するようになりました。

Maintenance by fruitfulcode のインストール

管理画面のプラグイン新規追加画面より Maintenance by fruitfulcode を検索するか、以下のサイトよりプラグインファイルをダウンロードします。


Maintenance by fruitfulcode の使い方

Maintenance by fruitfulcodeログイン画面をカスタマイズできるプラグインで、WordPressのユーザー「以外」のアクセスに対してログイン画面を表示させることができるようになります。

「メンテンス中です」を表示する以外でも、ちょっとした非公開のコンテンツや会員制サイトにも使えそうなプラグインではないかと思います。


Maintenance by fruitfulcode の基本設定

Maintenance by fruitfulcode プラグインを有効にすると、WordPress管理画面の左メニューに「Maintenance」のリンクを出現しますので、クリックして「Maintenance」ページへ移動します。
[WP]ログインフォームをメンテナンス画面として使用できるプラグイン「Maintenance by fruitfulcode」

メンテナンスモードを有効にする場合は、スイッチをONにしてページ下部の「Save changes」ボタンをクリックします。
[WP]ログインフォームをメンテナンス画面として使用できるプラグイン「Maintenance by fruitfulcode」

フロント画面にアクセスすると、このようなログイン画面が表示されます。

この画面は一般ユーザー向けですので、管理者含め WordPressのユーザーがログイン中であれば、通常通りサイトを閲覧することが可能です。
[WP]ログインフォームをメンテナンス画面として使用できるプラグイン「Maintenance by fruitfulcode」

Maintenance by fruitfulcode のカスタマイズ

メンテナンス画面(ログイン画面)のカスタマイズですが、主に以下の箇所を変更します。
[WP]ログインフォームをメンテナンス画面として使用できるプラグイン「Maintenance by fruitfulcode」

「Page title」にログイン画面の <title> を入力します。

「Head Line」「Description」にはログイン画面に表示するメッセージを入力します。

「Logo」にはログイン画面に表示させるロゴ画像を登録します。

「Background image」「Background color」では、それぞれログイン画面の背景画像、背景色を登録します。

ログイン後、ページの上部に管理バーを表示させる場合は「Admin Bar」にチェックを入れます。

※注意点ですが、通常のログイン画面も上記内容に変更されます。

カスタマイズ例

上記のカスタマイズ例で編集してみた結果、フロント画面(ログイン画面)はこのように変わりました。
[WP]ログインフォームをメンテナンス画面として使用できるプラグイン「Maintenance by fruitfulcode」

補足

Maintenance Mode と違い、Maintenance by fruitfulcode はメンテナンス表示専用のプラグインではなく、ログイン周りのカスタマイズツールのような印象です。

Maintenance Mode のようにメンテナンスの終了時間などは管理できませんが、「Head Line」欄に「○月○日○時にメンテナンスを終了します」のようなメッセージを書いておけば代用できると思います。



  • このエントリーをはてなブックマークに追加
  • follow us in feedly

コメント

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください