[WordPress] 間違って記事を公開しないように、「公開」ボタンを押した後に確認アラートを入れる
公式プラグイン化しました。→ 記事公開前に確認アラートを表示する「One Step Before Publishing」が WordPress プラグインディレクトリに掲載されました · rakuishi.com
WordPress で記事をしこしこ書いて、下書きとして保存しようとした時に、間違って記事を「公開」してしまった経験は誰でもあると思います。
これは、「下書きとして保存」ボタンよりも「公開」ボタンが青く強調されているからいけません。例えるならば、剥き出しの非常ベルがそこにある状態です。誰でも押したくなる、よくない設計だと思います。
この記事では、間違って記事を公開しないように「公開」ボタンを押した後に、一度確認アラートを表示するように WordPress を改造してみます。
間違って記事を公開しないように、確認アラートを入れる
WordPress を改造と言いましたが、きちんと WordPress 側で用意された方法に則って修正していきます。
現在、使用しているテーマの「テーマのための関数(functions.php)」を開いて、以下の文章を <? php > 内に記述します。
function publish_confirm_admin_print_scripts() {
echo <<< EOM
<script type="text/javascript">
<!--
window.onload = function() {
var id = document.getElementById('publish');
if (id.value.indexOf("公開", 0) != -1) {
id.onclick = publish_confirm;
}
}
function publish_confirm() {
if (window.confirm("記事を公開してもよろしいですか?")) {
return true;
} else {
var elements = document.getElementsByTagName('span');
for (var i = 0; i < elements.length; i++) {
var element = elements[i];
if (element.className.indexOf("spinner", 0) != -1) {
element.classList.remove('spinner');
}
}
document.getElementById('publish').classList.remove('button-primary-disabled');
document.getElementById('save-post').classList.remove('button-disabled');
return false;
}
}
// -->
</script>
EOM;
}
// 公開する前にアラートを表示する
add_action('admin_print_scripts', 'publish_confirm_admin_print_scripts');
管理画面に JavaScript を追加して記述できる admin_print_scripts のアクションをフックして、新しくアラートを表示するための JavaScript を記述しています。
「公開」ボタン(id=“publish”)が押された後に、記事を公開してもよいかどうかの確認アラートを表示するようにしています。
キャンセルした際に、色々とクラスを削除していますが、こちらは、ボタンを押せないように見せるクラスやローディングアニメーションのクラスを削除する処理となっています。