Tăng chiều cao và thêm ô tìm kiếm cho tất cả hộp danh mục

Dùng đoạn dưới đây để tăng chiều cao và thêm ô tìm kiếm cho tất cả hộp danh mục dùng giao diện chuẩn WordPress, gồm bài viết và nhiều plugin có Custom Post Type hoặc taxonomy riêng.

/**
 * Tăng chiều cao và thêm ô tìm kiếm cho các hộp danh mục
 * trong trang quản trị WordPress.
 */
add_action('admin_head-post.php', 'dpm_category_box_style');
add_action('admin_head-post-new.php', 'dpm_category_box_style');

function dpm_category_box_style() {
	?>
	<style>
		/* Tăng chiều cao danh sách danh mục */
		.categorydiv .tabs-panel,
		.postbox .categorychecklist {
			max-height: 650px !important;
		}

		/* Ô tìm kiếm danh mục */
		.dpm-category-search {
			width: 100%;
			margin: 8px 0;
			padding: 7px 10px;
			box-sizing: border-box;
		}
	</style>
	<?php
}

add_action('admin_footer-post.php', 'dpm_category_search_script');
add_action('admin_footer-post-new.php', 'dpm_category_search_script');

function dpm_category_search_script() {
	?>
	<script>
	document.addEventListener('DOMContentLoaded', function () {

		function normalizeText(text) {
			return text
				.toLowerCase()
				.normalize('NFD')
				.replace(/[\u0300-\u036f]/g, '')
				.replace(/đ/g, 'd')
				.trim();
		}

		document.querySelectorAll('.categorydiv').forEach(function (categoryBox) {

			/* Không tạo lại nếu ô tìm kiếm đã tồn tại */
			if (categoryBox.querySelector('.dpm-category-search')) {
				return;
			}

			const checklist = categoryBox.querySelector('.categorychecklist');

			if (!checklist) {
				return;
			}

			const searchInput = document.createElement('input');
			searchInput.type = 'search';
			searchInput.className = 'dpm-category-search';
			searchInput.placeholder = 'Tìm kiếm danh mục...';
			searchInput.autocomplete = 'off';

			const tabs = categoryBox.querySelector('.category-tabs');

			if (tabs) {
				tabs.insertAdjacentElement('afterend', searchInput);
			} else {
				checklist.parentNode.insertBefore(searchInput, checklist);
			}

			searchInput.addEventListener('input', function () {
				const keyword = normalizeText(this.value);

				checklist.querySelectorAll('li').forEach(function (item) {
					const label = item.querySelector(':scope > label');

					if (!label) {
						return;
					}

					const categoryName = normalizeText(label.textContent);

					if (
						keyword === '' ||
						categoryName.includes(keyword) ||
						item.querySelector('li:not([style*="display: none"])')
					) {
						item.style.display = '';
					} else {
						item.style.display = 'none';
					}
				});
			});
		});
	});
	</script>
	<?php
}

Thêm phần cho phép kéo dãn ô danh mục

/* ==========================================================================
   MỞ RỘNG CHIỀU CAO Ô DANH MỤC TRONG SỬA BÀI VIẾT
   --------------------------------------------------------------------------
 * Tăng chiều cao và thêm ô tìm kiếm cho các hộp danh mục
 * trong trang quản trị WordPress. có thể ké dãn
   ========================================================================== */


add_action('admin_head-post.php', 'dpm_category_box_style');
add_action('admin_head-post-new.php', 'dpm_category_box_style');

function dpm_category_box_style() {
	?>
	<style>
		/* Tăng chiều cao danh sách danh mục */
		.categorydiv .tabs-panel,
		.postbox .categorychecklist {
			max-height: 400px !important;
		}

		/* Ô tìm kiếm danh mục */
		.dpm-category-search {
			width: 100%;
			margin: 8px 0;
			padding: 7px 10px;
			box-sizing: border-box;
		}
	</style>
	<?php
}

add_action('admin_footer-post.php', 'dpm_category_search_script');
add_action('admin_footer-post-new.php', 'dpm_category_search_script');

function dpm_category_search_script() {
	?>
	<script>
	document.addEventListener('DOMContentLoaded', function () {

		function normalizeText(text) {
			return text
				.toLowerCase()
				.normalize('NFD')
				.replace(/[\u0300-\u036f]/g, '')
				.replace(/đ/g, 'd')
				.trim();
		}

		document.querySelectorAll('.categorydiv').forEach(function (categoryBox) {

			/* Không tạo lại nếu ô tìm kiếm đã tồn tại */
			if (categoryBox.querySelector('.dpm-category-search')) {
				return;
			}

			const checklist = categoryBox.querySelector('.categorychecklist');

			if (!checklist) {
				return;
			}

			const searchInput = document.createElement('input');
			searchInput.type = 'search';
			searchInput.className = 'dpm-category-search';
			searchInput.placeholder = 'Tìm kiếm danh mục...';
			searchInput.autocomplete = 'off';

			const tabs = categoryBox.querySelector('.category-tabs');

			if (tabs) {
				tabs.insertAdjacentElement('afterend', searchInput);
			} else {
				checklist.parentNode.insertBefore(searchInput, checklist);
			}

			searchInput.addEventListener('input', function () {
				const keyword = normalizeText(this.value);

				checklist.querySelectorAll('li').forEach(function (item) {
					const label = item.querySelector(':scope > label');

					if (!label) {
						return;
					}

					const categoryName = normalizeText(label.textContent);

					if (
						keyword === '' ||
						categoryName.includes(keyword) ||
						item.querySelector('li:not([style*="display: none"])')
					) {
						item.style.display = '';
					} else {
						item.style.display = 'none';
					}
				});
			});
		});
	});
	</script>
	<?php
}

/**
 * Cho phép kéo giãn chiều cao các hộp danh mục
 * trong trang quản trị WordPress.
 */
add_action('admin_head-post.php', 'dpm_resize_all_category_boxes');
add_action('admin_head-post-new.php', 'dpm_resize_all_category_boxes');

function dpm_resize_all_category_boxes() {
	?>
	<style>
		/* Vùng danh sách danh mục chuẩn WordPress và Glossary */
		.categorydiv .tabs-panel,
		.postbox .tabs-panel {
			resize: vertical !important;
			overflow: auto !important;

		/* Giữ tay nắm kéo ở góc dưới bên phải */
		.categorydiv .tabs-panel::after,
		.postbox .tabs-panel::after {
			content: "";
		}
	</style>
	<?php
}

Duy chỉ kép dã và định chiều cao không có ô tìm kiếm

/**
 * Cho phép kéo giãn chiều cao các hộp danh mục
 * trong trang quản trị WordPress.
 */
add_action('admin_head-post.php', 'dpm_resize_all_category_boxes');
add_action('admin_head-post-new.php', 'dpm_resize_all_category_boxes');

function dpm_resize_all_category_boxes() {
	?>
	<style>
		/* Vùng danh sách danh mục chuẩn WordPress và Glossary */
		.categorydiv .tabs-panel,
		.postbox .tabs-panel {
			resize: vertical !important;
			overflow: auto !important;

			height: 500px;
			min-height: 180px;
			max-height: 1200px !important;
		}

		/* Giữ tay nắm kéo ở góc dưới bên phải */
		.categorydiv .tabs-panel::after,
		.postbox .tabs-panel::after {
			content: "";
		}
	</style>
	<?php
}