TeenyBar

説明

TeenyBar は、ログイン中のサイトのフロントエンドで WordPress の管理バーを隠し、設定したホットゾーンにマウスを移動したときだけ表示する軽量なプラグインです。フロントエンドに常設の表示ボタンやトグル、アイコンを追加しないため、スクリーンショットやデザインレビューの画面をきれいに保てます。

  • フロントエンドに常設の「表示」ボタンやトグル、アイコンを表示しない。
  • ホットゾーンを1つ選ぶ (左上、上辺、右上のいずれか)。管理バーはマウスがその近くにある間だけ表示される。
  • 管理バーの表示中は、その高さの分だけページを下げる。マウスが離れると上部のオフセットは0に戻る。
  • WordPress の管理画面 (wp-admin) には影響しない: 管理バーは通常どおり動作する。
  • 管理バーの背景色はカラーピッカーで変更できる。
  • 対象ユーザーは管理者だけに限定することも、ログイン中のすべてのユーザーに広げることもできる。
  • 固定ヘッダー対応モード: position: fixed または sticky のヘッダーを使うテーマでは、CSS セレクターを1つ以上入力できる。管理バーの表示中は一致した要素を32px (PC) または46px (モバイル) 下げ、管理バーの背後に隠れないようにする。管理バーの非表示中はオフセットを0に固定するため、ページ上部に余白が残らない。
  • 自動検出ボタン: 設定画面には「自動検出」ボタンがあり、フロントページを非表示の iframe で読み込み、スクロール前後で sticky / fixed なヘッダーの候補を探して、最も可能性の高いものを CSS セレクターの入力欄に入力する。確定するまで何も保存しない。
  • 表示 / 非表示の遅延時間: ホットゾーンに入ってから管理バーが表示されるまでの待ち時間 (0、100、200、300 ms) と、離れてから非表示になるまでの待ち時間 (100、200、300、500、800、1000 ms) を選べる。

スクリーンショット

インストール

  1. WordPress の管理画面の「プラグイン > 新規追加 > プラグインのアップロード」からプラグインの ZIP をアップロードする。
  2. プラグインを有効化する。
  3. 「設定 > TeenyBar」を開き、ホットゾーン、対象ユーザー、背景色、固定ヘッダーのセレクター、表示 / 非表示の遅延時間を必要に応じて設定する。

FAQ

WordPress の管理画面に影響しますか ?

いいえ。wp-admin の中では管理バーは通常どおり動作します。非表示とホバーでの表示はフロントエンドにのみ適用されます。

テーマに固定ヘッダーがあり、管理バーが重なってしまいます。

ヘッダーに一致する CSS セレクターを入力すると、固定ヘッダー対応を有効にできます (例: header.site-header、#masthead、header.is-sticky)。カンマ区切りで複数のセレクターを指定できます。設定画面の「自動検出」ボタンに候補を提案させることもできます。

管理バーを非表示にしてもテーマの上部に32px / 46px の余白が残ります。

まさに TeenyBar が解決しようとしている状況です。v0.3.2以降では、TeenyBar を有効にしたフロントエンドのページで WordPress コアの _admin_bar_bump_cb を削除し、管理バーの非表示中は html と body.admin-bar の margin-top / padding-top もリセットします。v0.4.0で固定ヘッダーの自動検出を追加し、v0.4.1は WordPress プラグインディレクトリ公開に向けたメンテナンスリリースです。

自動検出ボタンを押すと自動的に保存されますか ?

いいえ。ボタンはセレクターの入力欄を埋めるだけです。結果を確認し、問題がなければ「変更を保存」を押してください。

評価

このプラグインにはレビューがありません。

貢献者と開発者

TeenyBar はオープンソースソフトウェアです。以下の人々がこのプラグインに貢献しています。

貢献者

“TeenyBar” は1ロケールに翻訳されています。 翻訳者のみなさん、翻訳へのご協力ありがとうございます。

“TeenyBar” をあなたの言語に翻訳しましょう。

開発に興味がありますか ?

コードを閲覧するか、SVN リポジトリをチェックするか、開発ログを RSS で購読してみてください。

変更履歴

0.4.4

  • Updated internal prefixes and contributor metadata for WordPress.org review. No functional changes.

0.4.3

  • Renamed the main plugin file to teenybar.php to align the distributable package with the WordPress.org plugin slug.
  • Updated plugin metadata URLs for WordPress.org submission.
  • No behavior changes for end users.

0.4.2

  • Added Requires at least: 5.8 and Requires PHP: 7.4 headers to the main plugin file so WordPress can surface compatibility requirements.
  • No behavior changes for end users.

0.4.1

  • Maintenance release preparing the plugin for submission to the WordPress plugin directory.
  • Renamed the public name to “TeenyBar” and switched the text domain to teenybar.
  • Reworked dynamic CSS output to use wp_add_inline_style() and switched the bootstrap script to wp_print_inline_script_tag() to satisfy the WPCS escape rules.
  • Removed the manual load_plugin_textdomain() call (WordPress 4.6+ loads it automatically for plugins hosted on WordPress.org).
  • Bumped “Tested up to” to 7.0.
  • Translated readme.txt to English.
  • No behavior changes for end users.

0.4.0

  • Added an “Auto-detect” button to the settings screen.
  • The button opens the front page in a hidden iframe and looks for fixed / sticky header candidates before and after scrolling, then fills the CSS selector field with the best match.
  • Auto-detection acts as an input helper before save; the manual / confirm / save flow is preserved.

0.3.5

  • Limited the fixed-header compatibility shift to elements that are currently position: fixed or sticky.
  • Fixed a case where pre-scroll static navs received the top offset and only the link text was pushed down.

0.3.4

  • Switched the fixed-header top adjustment to inline !important so it can win against themes that set top: 0 !important themselves.
  • Saved and restored the original inline top value and priority so theme inline styles are not lost.

0.3.3

  • Strengthened fixed-header compatibility: the top adjustment is now reapplied after scroll, resize, and DOM / class mutations on the configured selectors.
  • Addressed cases where a fixed header that appears after scrolling would overlap the Admin Bar.
  • Preserved the show_delay / hide_delay behavior and the no-extra-UI policy.

0.3.2

  • Hotfix: removed WordPress core’s _admin_bar_bump_cb from wp_head on TeenyBar-enabled front-end pages so core no longer emits html { margin-top: 32px !important; }.
  • Strengthened the margin-top / padding-top reset on html and body while the Admin Bar is hidden.
  • The visible-state push-down is now centralized on the teenybar-bar-visible class (32px PC / 46px mobile).
  • The fixed-header compatibility flag is now derived from the selector value (empty means OFF, non-empty means ON) to prevent invalid OFF + header.nt-header combinations.
  • Fixed-header compatibility, show_delay, and hide_delay behavior are unchanged.

0.3.1

  • Hotfix: added CSS that cancels the margin-top / padding-top themes apply to body.admin-bar while the Admin Bar is hidden, fixing the residual gap at the top of the page.
  • While the Admin Bar is hidden with fixed-header compatibility ON, the configured elements’ top / margin-top are explicitly reset to 0 to override theme rules such as .admin-bar header { top: 32px }.
  • The hidden-state correction is applied from the initial render, so there is no flash before the first hover.
  • Strengthened the pagehide cleanup so all managed elements are restored to their original inline top.
  • No impact on show_delay / hide_delay or hotzone behavior.

0.3.0

  • Added a reveal delay (0 / 100 / 200 / 300 ms, default 0 ms).
  • Added a hide delay (100 / 200 / 300 / 500 / 800 / 1000 ms, default 100 ms).
  • Leaving the hotzone before the reveal delay fires cancels the reveal entirely.
  • Returning to the Admin Bar / hotzone before the hide delay fires keeps the bar visible.
  • Defaults are close to the v0.2.0 feel (0 ms / 100 ms), so existing behavior is preserved.

0.2.0

  • Added fixed-header compatibility mode (OFF / ON + CSS selector). While the Admin Bar is visible the matching elements are pushed down 32px / 46px, and the original inline top is restored on hide.
  • prefers-reduced-motion: reduce now suppresses the Admin Bar transition.
  • Exposed the --teenybar-bar-h CSS variable so themes can drive their own header offsets.
  • No behavior change with defaults (compatibility OFF and empty selector).

0.1.0

  • Initial MVP release.