# Bartender 6で追加されたWidgets機能で自作メニューバーアイテムを簡単に作成する URL: https://webrandum.net/bartender-widgets/ 公開日: 2026-02-12 更新日: 2026-02-12 カテゴリー: 作業環境整備 タグ: Bartender 出典: Webrandum(著者: サイトウ マサカズ) Bartenderは大量のメニューバーを整理・管理するためのアプリですが、Bartender 6から追加された「Widgets」機能を使うと、簡単にメニューバーアイテムを作れるようになりました。 今回はこのWidgetsについて深掘りします。 ## Bartender ![](https://webrandum.net/mskz/wp-content/uploads/2026/02/image_1-1-1024x555.jpg) [Bartender 3 - How to hide menu bar icons on Mac](https://www.macbartender.com) Bartenderは散らかりがちなmacOSのメニューバーをキレイに整理・管理してくれるアプリです。 「Shown Items(表示アイテム)」と「Hidden Items (隠しアイテム)」をあらかじめ設定しておき、Bartenderのメニューバーアイコンをクリックすることで、それらを切り替えて使います(常に非表示にしたい項目は「Always Hidden Items」に設定することで非表示にできます)。 他にも「スペーサー」という区切りを追加したり、「メニューバーアイテムグループ」を追加するなどもできます。 最近では条件に合わせて項目を表示させる「Triggers」機能や、あらかじめ用意したメニューバー設定に簡単に切り替えられる「Presets」機能など、メニューバー関連でよくここまで新機能を思いつけるなと、少し狂気を感じるレベルです。 ## Widgets機能 Widgets(ウィジェット)と聞くと、macOSのデスクトップや通知センターに配置する表示のように思えてしまいますが、実際は全然違う機能です。 これはドラッグアンドドロップだけで誰でも簡単に好きなメニューバーアイテムを自作できる機能(Alfredを使っている人は、カスタムワークフロー機能を想像すると分かりやすい)です。 なお、2026年2月現時点ではまだWidgetsはBeta機能です。今後大きく機能が変わる可能性があるのでご注意ください。 ## Widgetの作り方 ### Widgetの新規作成 Bartenderの設定画面を開き、サイドバーの[Widgets]をクリックします。右上の「+」アイコンをクリックすると新規Widgetが追加されます。 ![](https://webrandum.net/mskz/wp-content/uploads/2026/02/image_2-1-1024x616.png) そして追加したWidgetを右クリックして[Edit]を選択するとタイトルと説明文を変更できます。 ![](https://webrandum.net/mskz/wp-content/uploads/2026/02/image_3-1-1024x616.png) ### Widgetの編集画面 Widgetを左クリックで、編集画面に移動します。 真ん中のアイコンがびっしり詰まった背景部分がメインカラムで、右サイドバーにはさまざまな要素(ノードと呼ぶそうです)が並んでいます。 ![](https://webrandum.net/mskz/wp-content/uploads/2026/02/image_4-1-1024x616.png) 右サイドバーから必要なノードを選択し、それらをメインカラム上でつないでメニューバーアイテムを自作します。 今回は試しに、クリックするたびに「ダークモードとライトモードが切り替わるメニューバーアイテム」を作ってみます。 #### メニューバーアイテムの表示 右サイドバーにある「Menu Item」をクリックします。 するとメインカラムに何やらカードのようなものが表示されました。これがノードです。 ![](https://webrandum.net/mskz/wp-content/uploads/2026/02/image_5-1-1024x616.png) 今回追加した「Menu Item」は「メニューアイテムを表示する」という役割をしています。下にある鉛筆アイコンをクリックすると、メニューアイテムの細かい設定ができます。 - アイコン - 表示するテキスト - アイコンとテキストの表示形式 ![](https://webrandum.net/mskz/wp-content/uploads/2026/02/image_6-2-1024x616.png) #### ダークモードとライトモードの切り替え 「Menu Item」の設定ができたら、次は右サイドバーで「Dark/Light Mode」を選択します。すると別のノードが追加されます。 ![](https://webrandum.net/mskz/wp-content/uploads/2026/02/image_7-1-1024x616.png) ノードはメインカラム上を自由にドラッグアンドドロップできるので、重なってしまった場合はドラッグして移動させましょう。 これが「ダークモードとライトモードを切り替える」役割を持っているノードです。 次に、先ほどの「Menu Item」Node内にある「Left Click」すぐ右の黄色いエリアをから、「Dark/Light Mode」内の「in」すぐ左の黄色いエリアまでドラッグします。 ![](https://webrandum.net/mskz/wp-content/uploads/2026/02/image_8-1-1024x616.png) するとこの2箇所を線で繋げます。 これで、「メニューバーアイテムを左クリックすると、ダークモードとライトモードを切り替える」という流れを設定できました。 このようにWidgetsでは、ノードを並べてそのノード内の要素をドラッグでつないでいくことで、簡単にメニューバーアイテムを自作できます。 Alfredのカスタムワークフローを作ったことがある人であれば、何となく理解しやすいのではないでしょうか。 ### Widgetの動作確認 Widgetの作成はこれで完了です。実際に作成したメニューバーアイテムの動作確認をしてみましょう。 メニューバーに先ほど設定したアイコンが表示されているはずですので、クリックしてダークモードとライトモードが切り替わるか見てみましょう。 ## ノードの種類 こういった機能は何ができるかの種類が重要です(ノード数が少ないと結局何もできません)。 2026年2月時点のノード一覧をまとめておきます。 | カテゴリ | アクション名 | 内容 | 備考 | | --- | --- | --- | --- | | Menu Items | Menu Item | メニューアイテムの表示 | 基本的にここからスタート(もしくはTimer) | | | Graph | グラフを表示する | データを渡してグラフを作成し、それをMenu Itemの「Image」などに渡す | | | Menu | メニューを表示する | Menu Itemの右クリック時にメニューを表示するなどが可能 | | Actions | Run a Script | スクリプトの実行 | 下記のスクリプトが実行可能 ・Shell Script ・AppleScript ・JavaScript ・PHP ・Perl | | | Dark/Light Mode | ダークモードとライトモードの切り替え | | | | Dark Mode | ダークモードへの切り替え | | | | Light Mode | ライトモードへの切り替え | | | | Toggle a Desktop Icons | デスクトップアイコンの表示・非表示の切り替え | | | | Hide Desktop Icons | デスクトップアイコンを隠す | | | | Show Desktop Icons | デスクトップアイコンを表示する | | | | Lock Screen | 画面をロックする | | | | Open Trash | ゴミ箱を表示する | | | | Toggle Volume | 音声のミュートを切り替える | | | | Beep | ビープ音を再生する | | | | Empty Trash | ゴミ箱を空にする | | | | Open File | 指定ファイルを開く | | | | Open URL | 指定URLを開く | | | | Perform Hot Key | 指定ホットキーを押す | | | Music | Apple Music | Apple Musicの再生・停止を切り替える | | | | Spotify | Spotifyの再生・停止を切り替える | | | Logic | Switch | 管理しやすいように切り替え用のレバーのようなノード | 「Starting Output」でどちらに分岐するか選択する | | | On/Off | Toggle/On/Offで状態を変え、状態に応じてアウトプットを切り替えられる | | | Utility | Delay | 指定時間遅延させる | | | | Timer | 一定時間ごとに発火させる | | | | Random Number | 最小値と最大値を決め、その間の数字をランダムに出力する | | | | Variable | 変数を設定する | 「Update Value」に線を繋げると変数が上書きされる | | Input | CPU Usage | CPUの使用量(%)を出力する | | | | Memory Usage | メモリの使用量(%)を出力する | | | | Network Data | ネットワークのDownloadとUpload(Mbit/s)を出力する | | | Triggers | Timer | 一定時間ごとに発火させる | UtilityのTimerと全く同じ | ### Keyboard Maestroマクロを発火させる Keyboard Maestroのマクロを発火させたい場合は「Run a Script」を使います。 Keyboard Maestroのマクロ設定でトリガーの下にある「or by script: 」を「Or by Apple Script:」に変更すると、AppleScriptが表示されます。 ![](https://webrandum.net/mskz/wp-content/uploads/2026/02/image_9-1-1024x1002.png) このコードをWidgetsの「Run a Script」ノードの設定を開いて、「Script Type」をAppleScriptに変更して、スクリプト欄にKeyboard MaestroマクロのAppleScriptを貼り付けます。 ![](https://webrandum.net/mskz/wp-content/uploads/2026/02/image_10-1-1024x624.png) これでメニューバーアイテムからKeyboard Maestroのマクロを発火できます。 ## まとめ メニューバーアイテムの自作はBetterTouchToolでも可能ですが、BetterTouchToolではアイテムを左クリックしたときと右クリックしたときで処理を分けるなど細かな指定まではできませんでした(Keyboard Maestroにも機能はありますが、あくまでKeyboard Maestroのメニューバーアイテム内に項目を追加するレベルです)。 BartenderのWidgets機能は、「Menu」ノードを使うと右クリックで詳細メニューを表示させるようなことができるので、かなり高機能なメニューバーアイテムを自作できます。 ただ、現状ではまだベータ機能というのと、設定のインポート・エクスポートができません。 設定のバックアップという意味でも、作成したWidgetの配布という意味でも、設定のインポート・エクスポートができるようになるとさらに積極的に使っていきたくなるなと感じました。