Category: Works , WordPress
Works

wordpress:メンテナンスモードを固定ページを使って作成。日時指定もできるようにする

wordpress:メンテナンスモードを固定ページを使って作成。日時指定もできるようにする
  • twitter
  • facebook
  • はてな
  • line

先日消費税増税に伴うサイトの更新をいくつか行いました。

その際、サイトをメンテナンスモードにして行ったのですが、これ管理画面から設定できたほうがいいよなと思い作ってみました。

そういう風作っておけばクライアント側でも設定できますしね。

プラグインもありますが、そこまで高機能なものが欲しいわけではないので簡単にやってみました。

メンテナンスモードの概要

メンテナンス中はこんな感じの表示にします。

メンテナンスモード

カスタマイズする内容はこんな感じ。

  • テキスト内容は固定ページの任意のページで作成する
  • メンテナンスモード有効/無効を選択できるようにする
  • メンテナンス開始と終了の日時指定をできるようにする

ではやっていこう!

メンテナンスモードの作成

メンテナンスモードとは言いますが、wordpressの機能wp_die()で出力されるエラーページを便宜上メンテナンスページとして使用します。

固定ページを作る

メンテナンスページ用の固定ページを作成します。

スラッグはmaintenanceにしておいてください。

別なスラッグでもいいですが、違うものにした場合は次に説明する関数内のページ呼び出し部分で設定しているスラッグを変更してください。

適当なタイトルと本文を入力してください。

状態は非公開にしておいてください。

メンテナンスモード

※上の画像はプラグインClassic Editor を使用しています。

関数作成

まずはfunctions.phpにメンテナンスモード実行用の関数を作成します。

function custom_maintenance_mode() {
    
    //ログイン中は何もしない
    if ( is_user_logged_in() ) return;
    
    //メンテナンスモード用の固定ページを取得
    $post = get_page_by_path( 'maintenance' );
    
    //ページがない場合は何もしない
    if ( !$post ) return;
    
    //メンテナンスモードが有効になっていない場合は何もしない
    if( !get_post_meta( $post->ID, 'enable', true ) ) return;

    //現在の日時を取得
    $time = date_i18n( 'Y-m-d H:i:s' );
    //開始日時
    $start = get_post_meta( $post->ID, 'start_date_time', true );
    if( !$start ) {
        $start = '0000-01-01 00:00:00';
    }
    //終了日時
    $end = get_post_meta( $post->ID, 'end_date_time', true );
    if( !$end ) {
        $end = '9999-01-01 00:00:00';
    }

    if ( $start <= $time && $end > $time ) {
        
        //エラーページの追加css
        $style = '<style>#error-page img { max-width:100%; height:auto; }</style>';
        //タイトル
        $title = '<h1>'.esc_html( $post->post_title ).'</h1>';
        //本文
        $content = apply_filters( 'the_content', $post->post_content );
        //エラー出力
        wp_die( $style.$title.$content,get_bloginfo( 'name' ) );
    }
    
}
add_action('get_header', 'custom_maintenance_mode');

コメント書いてる通りですがざっと説明していきます。

カスタムフィールドの詳細は後で説明します。

  • 3行目
    管理画面にログインしている場合は何もしません。じゃないと何もできないしねw
    もっと権限を細かく分けたい方はcurrent_user_can() を使用して分岐をかけてください。
  • 6行目
    メンテナンス用の固定ページデータを取得します。
    スラッグはmaintenanceで呼び出していますが、別のスラッグでページを作成した場合はここを書き換えてください。
    ページが見つからない場合は何もしません。
  • 12行目
    カスタムフィールドのメンテナンス有効値を取得し、チェックがなければなにもしません。
  • 15行目~
    現在の時間、開始時間、終了時間を取得します。
    開始時間や終了時間が設定してなければ適当な時刻を代入します。
  • 28行目
    現在の日時が開始日時以上の場合かつ現在の時刻が終了時刻未満の場合にメンテナンスモードを実行します。
  • 30行目
    エラーページに追加するCSSを設定します。
    画像に関するものなので、画像を使わない場合はこの項目は不要です。
  • 32行目
    メンテナンスモードのタイトル部分は固定ページのタイトルを使います。
  • 34行目
    メンテナンスモードの本文は固定ページの本文を使います。
  • 36行目
    wp_die()でエラーページを出力します。
    引数1番目に出力内容、2番目にサイトタイトルを入れます。
    2番目の引数を設定しない場合「エラー」表示になります。
    メンテナンスモード
  • 41行目
    アクションフックget_headerに上記の関数をセットします。
    これでget_header()が呼び出された時にこの関数が実行されます。
    get_header()を使わないページがある場合はフックをwpにし、is_admin()で分岐させればいけると思います。

カスタムフィールドを作る

カスタムフィールドも自作しようかと思ったのですが、日時指定がめんどくさかったのでプラグインAdvanced Custom Fields を使用しました。

自作してもいいし別のプラグインでも指定した型で日時を登録できるのならなんでもOKです。

メンテナンスモードの有効無効

キー名は「enable

この項目は「真/偽」にします。

メンテナンスモード

日時指定

開始日時・終了日時を作成します。キー名はそれぞれ「start_date_time」「end_date_time

この項目は「Date Time Picker」にします。

表示・返り値のフォーマットはどちらも「Y-m-d H:i:s」にします。

メンテナンスモード
メンテナンスモード

Advanced Custom FieldsのDate Time Pickeは値の入力時にデートピッカーとタイムピッカーを表示してくれるので入力が楽。

メンテナンスモード

任意の固定ページに表示

設定したカスタムフィールドを最初に作成した固定ページにのみ表示させるようにします。

メンテナンスモード

タイトルが表示されてますが、内部では記事IDで判別してるので固定ページのタイトルを変更しても大丈夫です。

使い方

カスタムフィールドを設定した後に作成した固定ページの編集画面にいくと下記のようになりますのでそれぞれ設定してください。

メンテナンスモード

メンテナンスモードを有効にするのチェックが入ってなければ開始時間・終了時間が入力されていてもメンテナンスモードにはなりません。

逆にメンテナンス期間中でもこのチェックを外せばメンテナンスモードは無効になります。

開始時間・終了時間は両方とも任意です。

どちらかだけの設定も可能で、開始時間だけの設定や終了時間だけの設定が可能です。

両方とも入力がなければ常にメンテナンスモードです。

スマホサイズの表示もOK!
※関数でcssを設定しないと画像が縮小されずにはみ出します。

メンテナンスモード

とりあえずデモサイトで確認しながらやりましたが、おかしいところあればコメント等でご連絡ください。

消費税増税前に作っときゃよかった…


おもしろかった・役に立った
  • twitter
  • facebook
  • はてな
  • line
▼ブログランキング参加中!クリック!▼
  • ブログランキング・にほんブログ村へ

Leave a comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

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