Movable Type 7 の管理画面をカスタマイズしたい

簡単なカスタマイズであれば、プラグインを導入することなく、CSSとJSを読み込むことで対応することが出来ます。

準備

alt-tmplを使用することで、テンプレートファイルの読み込みを切り替えることが出来ますので、管理画面にユーザー独自の CSS と JS を読み込むようにします。

今回は、CSSやJS を追加したいので、管理画面で使用してるヘッダーテンプレートを使います。

Movable Typeに元々入っている
/tmpl/cms/layout/common/header.tmpl

のファイルを
/alt-tmpl/cms/layout/common/header.tmpl
へ、複製します。

複製したテンプレートファイルをエディタで開き、</head> タグの直前くらいに読み込みたい外部ファイルを追加します。

※各パスは、ファイルを設置するところに合わせて、適時書き換えてください。

今回のサンプル構造は下記のようにしています。

今回は、わかりやすくCSSのみで、不要な管理メニューを非表示にします。
※例ではCSSで非表示にしているだけなので、直接URLにアクセスすれば触れてしまうので、本来であればロール設定をしてそれぞれ権限管理しましょう。

追加したCSS内に非表示にしたい要素を display: none; してしまいます。
各要素については、デベロッパーツールなどで、DOMを確認しつつ指定してください。

今回は、タイトル・本文だけのお知らせ機能を想定し、「サイト」や「コンテンツデータ」といったメニューを非表示にしています。

上記CSSを当てたメニューのキャプチャです。

表示だけでなく、いろいろと管理画面をカスタマイズしてみたいという方は、JavaScriptで頑張るということも出来ますが、その労力をかけるのであれば、プラグインを使用したほうがよいと思います。

MTAppjQuery2

こちらのプラグイン、ライセンス費が 25,000円と企業サイトなどで Movable Typeを入れているところであれば、些細な金額かもしれないですが、個人で遊ぶには、ちょっとお高いです。
Movable Type6対応のバージョン1系であれば、個人向けに無料プランあったのですが、MT7のバージョン2系では、有料プランのみとなっているようです。

それでも金額に見合う機能を有しているので、一度は触ってみるとよいと思います。

  • このエントリーをはてなブックマークに追加
  • Pocket

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください