a-blog cmsで管理ページの削除ボタンを無効化する #CSS

a-blog cmsの管理ページ「ブログ」「カテゴリー」「ユーザー」の詳細画面は、青い「保存」ボタンのすぐ横に赤い「削除」ボタンがあります。

このボタンが「押してしまいそうで怖い」と言われたので（一応、onclickで警告は出ますが）、根幹の設定に関わる親ブログのブログ・カテゴリーの削除操作を禁止してみました。

a-blog cmsの重要な機能を封印するので、取り扱いには注意してください。

管理ページのhead要素について

管理ページのhead要素テンプレートは /themes/system/include/head/ 以下にあります。これを利用中のテーマの同じ階層に複製・編集すれば良いのですが、バージョンアップ後もコアのCSS・JSに影響を出ないよう編集するのが難しいです。

唯一問題が起きても大丈夫そうなのが、「ブログのキーカラー」のCSSを呼び出している以下のファイルです。

/themes/system/include/head/blog-color.html

ここにコードを追記することにします。

CSSを追加する

以下のとおりa-blog cmsのIFブロックとCSSを追加してください。

blog-color.html

<!-- BEGIN_IF [%{BID}/eq/1] -->
<style>
/* 管理ページ内でサイトの根幹に関わる設定の削除を禁止する */
.acms-admin-form input[name^="ACMS_"][name*="Blog_Delete:"],
.acms-admin-form input[name^="ACMS_"][name*="Category_Delete:"] {
    position: relative;
    background: #ccc none;
    color: #333;
    border-color: #999;
    opacity: .5;
    pointer-events : none;
}
</style>
<!-- END_IF -->

まず、IFブロックで封印するのはルートのブログのみとしました。
さらにフォームのボタン内のname属性を解析し、「ACMS_」ではじまり「Blog_Delete:」「Category_Delete:」を含むボタンを無効化しています。

pointer-eventsはIE11以降とモダンブラウザで有効になり、CSS側でクリックイベントを禁止します。

補足

「JavaScriptでonclick禁止とdisabled付与をすればいいのでは？」と突っ込まれそうなのですが、blog-color.htmlテンプレートはacms.jsの呼び出しよりも前に書かれているため、ACMSオブジェクトを利用することができません。

管理画面にも、head要素末尾に安全に自作テンプレートを追加できるようになればいいなと思います。