MovableType.net Dashboard Utility ver0.9.3 リリースしました！
ども、どもども、西山です。
この記事は、Movable Type Advent Calendar 2025の13日目の記事です。
先日、個人開発しているChromeブラウザの拡張機能「MovableType.net DashBoardUtility」の新バージョン、version 0.9.3をリリースしました。
6月にもアップデートしていましたが、今回もあると便利だなと思った機能を追加しています！
MovableType.net DashBoardUtilityとは
MovableType.net DashBoard Utilityは、Chromeブラウザのエクステンション（拡張機能）で、これをご利用いただくと、MovableType.netの管理画面をより使いやすくできる拡張機能です。
Chromeウェブストアから無料でインストールできます。
この拡張機能をChromeにインストールすると、以下のことができるようになります。
- ダッシュボードから直接、ウェブサイト／ブログのテンプレート編集画面へ移動できる
- ファイルマネージャ内で画像のサムネイルを表示する
- ダッシュボードで「新しく〜を作る」をサイドバーに移動
- プレビュー／確認のボタンをスクロール追随型に変更
- 記事・ウェブページ編集時のサイドバーをソータブルに変更
- カスタムスクリプトおよびエディタCSSのコードをハイライト表示
- 編集中のブロックを強調表示（ON/OFF切替）
- 追加するブロックが属する親ブロックを表示
- ウェブページ／記事の作成時、左右サイドバーを非表示にし本文部分を最大幅で表示 [NEW]
この記事では、今回追加した機能「フルスクリーンモード」についてご紹介します。
MT9で実装された「左サイドバーの折りたたみ機能」
今年10月22日に、Movable Type 9がリリースとなりました。
その際に提供されたUI改善の1つに「コンテンツ編集を行なう中央のスペースをより広く確保できるように左サイドバーを折りたたむ」という機能があります。
リッチテキストエディタだけじゃなくブロックエディタを使用するときも、本文エリアが狭く感じることがあると思うので、とても便利そうです！
MovableType.netの場合
ただ、この左サイドバーの折りたたみ機能はソフトウェア版のみでの提供となっていて、MovableType.netでは利用できません。
例えば、MovableType.netで複数カラムを使用するレイアウトの場合。
編集画面では、以下のような感じになります。
カスタムブロックの作り方にも寄りますが、このように各ブロックの入力欄がエディタ部分をはみ出してしまったり、入力欄が狭くなってしまうことがあります。
また、エディタCSSを利用している場合は、こんな感じになってしまうこともあります。
以下の例はテキストと画像を横並びにするブロックですが、エディタCSSのレスポンシブ対応が適用されてそれらが上下に重なっています。
スマートフォンなどでの見栄えを確認しつつ入力していくにはこれも良いのですが、画面の大きなサイズを確認したい場合は、その都度「プレビュー」をしなければなりません。
エディタCSSにレスポンシブ対応部分を含めないなどの方法も取れますが、運用上、それもちょっと面倒ですよね（汗）
MovableType.netにもサイドバーを折りたたむ機能が欲しい…
先日のMTDDC Meetup TOKYO 2025で、シックス・アパート社の早瀬さんのセッションを聞いていて、以前にDashBoardUtilityで実装しようと思ったことがあったのを思い出し、左サイドバーを折りたたむ機能と同等の機能をMovableType.net DashBoardUtilityに実装することにしました。
フルスクリーンモードの実装
左サイドバーを非表示にするだけでも良かったのですが、コンテンツを作成しているときは右サイドバーもなくていいですよね。
そこでテンプレート編集画面で「フルスクリーンモードにする」という機能があったのを思い出し、それに倣うカタチにしました。
通常時の記事／ウェブページ編集画面
MovableType.net DashBoardUtilityをインストールすると、ウェブページ／記事の作成・編集画面の右上に「フルスクリーンモードにする」というボタンが追加されます。
フルスクリーンモード時の編集画面
この「フルスクリーンモードにする」をポチッとすると、左右のサイドバーが非表示になります。
大きなサイズの画面も管理画面から移動することなく確認できるので、これは便利！（自分で言います笑）
戻すときは「フルスクリーンモードを終了」をクリックすると戻ります。
これでプレビューをその都度確認する必要がなくなったので、コンテンツ作成も捗ります。
また、先ほどの3カラムブロックを利用する編集画面もこんな感じになります。
これならどこに何を入力するのかもはっきりします。
フルスクリーンモード、便利！（もう一度自分で言います笑）
バージョン0.9.3のダウンロードはこちら
Chromeウェブストアより無償ダウンロードすることができるので、MovableType.netユーザーの方でChromeブラウザをご利用中の方は、ぜひお試しください。
（12月10日にリリースしたので、現在この拡張機能をご利用中の方は自動アップデートしていると思います）
MovableType.net Dashboard Utility
これ便利だな！と思ったら評価をつけてくれると嬉しいです！
あと、この記事下部にある「ビールをごちそうする」で100円からのカンパもお待ちしています（笑）
今回の開発パートナーたち
前回の0.8.3ではChatGPTとあれこれ相談しながら作りましたが、今回はCursorにも加わってもらいました。
ChatGPTでおおよその構造を相談して、その後、Cursorに拡張機能と管理画面のHTMLを読み込ませて作った感じですが、ChatGPT単体よりも早かったかなと思います。
いやぁ、AIってすごいですね（笑）
明日以降のMovable Type Advent Calendar 2025もお楽しみに！
