WordPress3.2のアップグレード警告、ブラウザ判別機能を調べてみた

ブラウザアップグレード警告WordPress3.2からの管理画面では、ブラウザのバージョンが古かったりするとこのようなアラートが表示されるようになっています。

今回は、この新しく追加されたアラートのボックスの改変および、バージョン判定のロジックを調べてみました。

アラートそのものを非表示にする

表示されているボックスの「却下」をクリックすれば、非表示になりますが、これは、表示オプションで消した状態になっているので、少なくとも最初の1回は表示されてしまうことになります。

このアラートは、他の「現在の状況」「クイック投稿」同様、ウィジェットとなっているので、「デフォルトのウィジェットを削除する」のコードを CODE 1 のように少し変更してあげれば、アラートのボックスも消すことが出来るようになります。

function remove_dashboard_meta_boxes( $screen_id ) {
    global $wp_meta_boxes;
 
    if ( $screen_id == 'dashboard' ) {
        $meta_boxes = array(
            'normal' => array(
                'dashboard_right_now', // 現在の状況
                'network_dashboard_right_now', // 現在の状況(ネットワーク管理)
                'dashboard_recent_comments', // 最近のコメント
                'dashboard_incoming_links', // 被リンク
                'dashboard_plugins', // プラグイン
                'dashboard_browser_nag', // お使いのブラウザは古すぎます。
            ),
            'side' => array(
                'dashboard_quick_press', // クイック投稿
                'dashboard_recent_drafts', // 最近の下書き
                'dashboard_primary', // WordPress 開発ブログ
                'dashboard_secondary' // WordPress フォーラム
            )
        );
        foreach ( $meta_boxes as $context => $arr ) {
            foreach ( $arr as $id ) {
                $priority = $id == 'dashboard_browser_nag' ? 'high' : 'core';
                if ( isset( $wp_meta_boxes[$screen_id][$context][$priority][$id] ) ) {
                    remove_meta_box( $id, $screen_id, $context );
                }
            }
        }
    }
}
add_action( 'do_meta_boxes', 'remove_dashboard_meta_boxes' );

アラートの文言を変更する

アラートのhtmlは、wp-admin/includes/dashboard.php に記述されている wp_dashboard_browser_nag という関数で生成されています。
生成されたhtmlは、表示の直前に browse-happy-notice というフィルターフックを通るので、これを用いて好きなように表示を変えることもできます。

CODE 2 をテーマの functions.php に記述すると、意味もなくツンデレっぽいメッセージに変更されます。

ツンデレ風アップグレード警告

CODE 2

function tsundere_browse_happy_notice( $notice, $response ) {
	if ( $response ) {
		$notice = '';
		$browser_nag_class = '';
		if ( !empty( $response['img_src'] ) ) {
			$img_src = ( is_ssl() && ! empty( $response['img_src_ssl'] ) )? $response['img_src_ssl'] : $response['img_src'];
			$notice .= '<div class="alignright browser-icon"><a href="' . esc_attr($response['update_url']) . '"><img src="' . esc_attr( $img_src ) . '" alt="" /></a></div>';
			$browser_nag_class = ' has-browser-icon';
		}
		$notice .= '<p class="browser-update-nag' . $browser_nag_class . '">';

		if ( $response['insecure'] ) {
			$notice .= sprintf( 'ちょっとっ!使ってる <a href="%s">%s</a> が危険よっ!', esc_attr( $response['update_url'] ), esc_html( $response['name'] ) );
		} else {
			$notice .= sprintf( 'ちょっとっ!使ってる <a href="%s">%s</a> が古いわよっ!', esc_attr( $response['update_url'] ), esc_html( $response['name'] ) );
		}
		$notice .= sprintf( '<p>WordPress を使いこなしたかったら、最新版の %s に<a href="%s">アップデート</a>しなきゃだめなんだからねっ!<br />ぷんぷくり~ん(怒</@p>', esc_html( $response['current_version'] ), esc_url( $response['update_url'] ) );

		$notice .= '<p class="hide-if-no-js"><a href="" class="dismiss">お断りします</a></p>';
		$notice .= '<div class="clear"></div>';
	}
	return $notice;
}
add_filter( 'browse-happy-notice', 'tsundere_browse_happy_notice', 10, 2 );

ブラウザの判定方法

ブラウザの判定は、wp-admin/includes/dashboard.php に記述されている wp_check_browser_version 関数にて行われています。

この関数では、ユーザーエージェントを api.wordpress.org のAPIに投げて結果を取得するようになっています。また、結果はユーザーエージェントをキーとした1週間のキャッシュを保持するようになっているため、毎回リクエストが発生するわけではありません。

得られる結果については、OSやブラウザの種類、バージョンだけでなく、ブラウザの画像データURL、アップグレードのURL、最新バージョン、アップグレード必要性の有無、安全かどうかなどの項目が配列で返されてきます。(参照:CODE 3)

CODE 3

この記事は、jim912によって書かれたものです。
引用を行う場合は、著作権法に定める範囲にて、引用元であるSimple Colorsの出展元表示とhttp://www.warna.info/archives/1408/へのリンクを必ず行って下さい。

array(9) {
  ["platform"]=>
  string(7) "Windows"
  ["name"]=>
  string(5) "Opera"
  ["version"]=>
  string(5) "10.61"
  ["update_url"]=>
  string(21) "http://www.opera.com/"
  ["img_src"]=>
  string(48) "http://s.wordpress.org/images/browsers/opera.png"
  ["img_src_ssl"]=>
  string(47) "https://wordpress.org/images/browsers/opera.png"
  ["current_version"]=>
  string(5) "11.11"
  ["upgrade"]=>
  bool(true)
  ["insecure"]=>
  bool(false)
}

この方式でのメリットは、あたらしいブラウザなどがリリースされても、API側をアップデートすれば対応できるため、個々の WordPress 側で対応する必要が一切ないという点となります。

その一方、1週間のキャッシュがあるとは言え、APIを利用することは表示の遅延に繋がります。
また、管理画面で利用する分には、利用されるブラウザのバージョンは限定的となるため、問題とはなり得ませんが、これを公開する表示で利用するとなると、OSやブラウザ、バージョン、パッケージなど雑多なユーザーエージェントを受け付けることとなり、表示の遅延と、判別結果のキャッシュデータがデータベースのサイズを肥大化させることになるため、この方式では管理画面のみでの利用に限定しておいた方がよいでしょう。

カテゴリー: WordPressの小技 タグ: , , パーマリンク

コメントを残す

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