この記事は最後に更新してから1年以上経過しています。
説明
レスポンシブ対応したWordPressの管理画面。プラグインやテーマのカスタマイズで管理画面を拡張しているなら、切り替わるタイミングはきっちり押さえておきたいところではないだろうか。
確認方法は簡単で、ブラウザで幅を狭くしたり、広くしたりすればいい。整理すると、次のような感じになる(他にもあるかもしれないが)。
幅 | 内容 |
---|---|
901ピクセル以上 | 標準設定 |
900ピクセル以下 | サイドナビゲーションがアイコンのみ |
850ピクセル以下 | 投稿画面のウィジェットが1段 |
782ピクセル以下 | サイドナビゲーションが消え、フォントが大きくなる |
画面の見た目がはっきり変わるのが、幅が782ピクセル以下か783ピクセル以上かである。782ピクセル以下の場合は、ページ構成がシンプルになり、フォントサイズが変わることは意識しておきたい。
スタイルシートのスケルトンは次の通り。
<style type="text/css">
/* 幅が901px以上のスタイル */
@media screen and (max-width: 900px) {
/* サイドナビゲーションがアイコンのみ */
}
@media screen and (max-width: 850px) {
/* 投稿画面のウィジェットが1段になる */
}
@media screen and (max-width: 782px) {
/* サイドナビゲーションが消え、フォントが大きくなる */
}
</style>
まあ3.8と3.9ではスタイル設定が微妙に違っているので、最終的には実際の画面で確認してほしい。
最終更新 : 2014年06月03日 18:08
関連
お勧め
wp_get_post_terms(2014年7月4日 更新)
mixed wp_get_post_terms( [ int $post_id = 0 [ , string $taxonomy = 'post_tag' [ , array $args = array() ] ] ] )
投稿記事のタクソノミー情報を取得する。
add_action(2023年7月28日 更新)
bool add_action( string $tag, mixed $function_to_add [ , int $priority = 10 [ , int $accepted_args = 1 ] ] )
WordPressシステムの関数にアクション関数を追加する。
get_editor_stylesheets(2014年9月5日 更新)
array get_editor_stylesheets( )
エディタ向けのスタイルシートURLを取得する。
wp_count_terms(2020年12月14日 更新)
array | int | WP_Error wp_count_terms( array | string $args = array() [ , array | string $deprecated = '' ] )
タクソノミーのターム数を取得する。
the_comments_navigation(2018年5月27日 更新)
void the_comments_navigation( [ array $args = array() ] )
コメントナビゲーションを表示する。