WordPressのカテゴリー選択を1つに制限する方法をチェックボックスからラジオボタンに変更してみた(クイック編集にも対応)

WordPressの豆知識

こんにちは、チーフクリエイターのSHOJIです。

WordPressのカテゴリー選択がチェックボックスで実装されているため、複数選択ができてしまうのはみなさんご存じの通り。

しかし、弊社で制作するサイトのほとんどはカテゴリーを1つに絞って設定させるため、カテゴリー選択を1つに制限するソースコードをfunctions.phpに記述することで制御しています。

ですが、WordPressのバージョンアップに伴って、これまでの設定ではチェックボックスの制御が上手くいかなくなり、カテゴリーを複数選択できてしまうようになりました泣。

WordPressのカテゴリー選択を1つに制限する方法をチェックボックスからラジオボタンに変更してみた(クイック編集にも対応)

そこで今回の豆知識は『WordPressのカテゴリー選択を1つに制限する方法をチェックボックスからラジオボタンに変更してみた(クイック編集にも対応)』と題してお届けしますので、どうぞ最後までお付き合いください。
 
 従来の設定
 チェックボックスからラジオボタンに変更
 クイック編集でもラジオボタンに変更
 最後に
 

従来の設定

先述の通り、WordPressのカテゴリー選択はチェックボックスで実装されているので、複数選択ができて当たり前なのですが、このチェックボックスに対して選択できる箇所を1つだけに制御するという無理やりな指示をしてしまっているのが現状です。

ネット上に多くの紹介記事が公開されているので、同様の方法でカテゴリー選択を1つに制限している方もおられることと思います。

WordPressのカテゴリー選択を1つに制限する方法をチェックボックスからラジオボタンに変更してみた

本来、複数選択ではなく単一選択させたいのであれば、チェックボックスではなくラジオボタンで実装すれば良いだけの話なんですよね。
 

チェックボックスからラジオボタンに変更

従来の制御で、functions.phpに記述したカテゴリー選択を1つに制限するソースコードを、下図のようにコード書き換えます。

WordPressのカテゴリー選択を1つに制限する方法をチェックボックスからラジオボタンに変更してみた

要は、Javascriptにてinputタグのtype属性を『checkbox』から『radio』へと置換させるコードを管理画面のフッターに挿入することで、投稿画面のカテゴリー選択項目においてチェックボックスからラジオボタンに変更されるというものです。

WordPressのカテゴリー選択を1つに制限する方法をチェックボックスからラジオボタンに変更してみた(クイック編集にも対応)

見事、チェックボックスからラジオボタンへと変更されたので、カテゴリーが1つしか選択できなくなりました。ついでに、存在価値のなかった『よく使うもの』タブと『+新規カテゴリーを追加』のテキストリンクも非表示にすることができて嬉しさ2倍です!

今回は、Analog Studio様の記事『WordPressの投稿画面でカテゴリ選択を一つだけに変更する方法【ラジオボタン化】』を参考にさせていただきました。

こちらの記事では、さらに詳しく丁寧にコードや設定の解説をしてくれてますので、初心者の方は是非チェックしてみてください!

参考:『Wordpressの投稿画面でカテゴリ選択を一つだけに変更する方法【ラジオボタン化】』
https://web.analogstd.com/tips/posts/web/wordpress-category-singleselector.php

 

クイック編集でもラジオボタンに変更

また、投稿一覧画面内の「クイック編集」においても同様に、カテゴリー選択をチェックボックスではなくラジオボタンに変更したいと思われる方も多いはず。

Analog Studio様の記事では触れられていませんでしたが、上図のコードを参考にしてクイック編集内のカテゴリー選択項目もラジオボタンに変更することが可能です。

ただし、上記方法のままラジオボタンに変更してしまうとデータベースにカテゴリーは保存されているのですが、クイック編集の際にカテゴリーのチェックが外れてしまうためリセットされた状態で上書き保存されてしまいます

そのため、クイック編集の際にラジオボタンのチェックが外れないよう投稿データを引き継ぐためのjQueryを追加してあげます。

WordPressのカテゴリー選択を1つに制限する方法をチェックボックスからラジオボタンに変更してみた

今度は、かもメモ様の記事『WordPress 投稿のカテゴリーをラジオボタンにカスタマイズしたら、クイック編集でカテゴリーがチェックされなくなったので。』を参考にさせていただきました。

こちらの記事も、さらに詳しく丁寧にコードや設定の解説をしてくれてますので要チェックです!

参考:『WordPress 投稿のカテゴリーをラジオボタンにカスタマイズしたら、クイック編集でカテゴリーがチェックされなくなったので。』
https://chaika.hatenablog.com/entry/2015/06/08/210000

WordPressのカテゴリー選択を1つに制限する方法をチェックボックスからラジオボタンに変更してみた(クイック編集にも対応)

上図のように、先ほど追加したjQuery(ファイル名『inline_category_select.js』)を同時に読み込み、投稿画面ではカテゴリ選択ボックスのid属性だった「#categorychecklist」から、クイック編集のカテゴリー選択ボックスのclass属性「.category-checklist」へと変更して設定しています。

WordPressのカテゴリー選択を1つに制限する方法をチェックボックスからラジオボタンに変更してみた(クイック編集にも対応)
WordPressのカテゴリー選択を1つに制限する方法をチェックボックスからラジオボタンに変更してみた(クイック編集にも対応)

見事、クイック編集でもラジオボタンに変更することができて、チェックが外れてリセットされることもなくカテゴリーを1つに制限することができました。
 

最後に

さらに、以前このブログで紹介した『投稿画面でタグをチェックリストから選択する方法』のように、投稿画面のタグ設定をチェックリストに変更している場合でも干渉しないようにコードを記述してあるので安心です。

もちろん、クイック編集内のタグ選択項目がラジオボタンに変更されないようにもしていますが、この辺りについては実際にみなさんの設定と異なる場合がありますので、必ず元のfunctions.phpをバックアップをとってから編集を行い、正常に再現されることを確認してくださいね。

Webの豆知識」の関連記事

インフォコネクトに
相談してみませんか?

経営コンサルティングやITサービス活用支援、ホームページ制作などに関するご依頼や、ご質問・ご相談など、なんでもお気軽にお問い合わせください。