Вопрос или проблема
Кто-нибудь может мне помочь, пожалуйста, я не силен в PHP. Я создал пользовательский тип записи под названием “used-car” и пользовательскую таксономию “used-car-category” в functions.php.
Вопрос:
Мне нужно создать форму поиска с выпадающим списком, которая отображает список категорий и подкатегорий на главной странице. Например:
выпадающий список 1 [марка автомобиля] “категория”
выпадающий список 2 [модель автомобиля] “подкатегория”
Кнопка поиска
Когда вы выбираете модель автомобиля в выпадающем списке, например, audi, второй выпадающий список отображает различные варианты моделей audi.
категория в CMS выглядит примерно так:
audi < категория
– a1 < подкатегория
– a6 < подкатегория
mercedes < категория
– класс a < подкатегория
– класс b < подкатегория
– класс c < подкатегория
Я бы хотел, чтобы эта форма поиска отображалась на главной странице. Может кто-нибудь мне помочь? Рабочий код был бы полезным.
Спасибо
<?php if ( is_taxonomy_hierarchical($taxonomy) ) : ?>
<tr class="form-field term-parent-wrap">
<th scope="row"><label for="parent"><?php _ex( 'Родитель', 'родитель термина' ); ?></label></th>
<td>
<?php
$dropdown_args = array(
'hide_empty' => 0,
'hide_if_empty' => false,
'taxonomy' => $taxonomy,
'name' => 'parent',
'orderby' => 'name',
'selected' => $tag->parent,
'exclude_tree' => $tag->term_id,
'hierarchical' => true,
'show_option_none' => __( 'Нет' ),
);
/** Этот фильтр описан в wp-admin/edit-tags.php */
$dropdown_args = apply_filters( 'taxonomy_parent_dropdown_args', $dropdown_args, $taxonomy, 'edit' );
wp_dropdown_categories( $dropdown_args ); ?>
<?php if ( 'category' == $taxonomy ) : ?>
<p class="description"><?php _e('Категории, в отличие от тегов, могут иметь иерархию. У вас может быть категория Jazz, и под ней дочерние категории для Bebop и Big Band. Совершенно необязательно.'); ?></p>
<?php endif; ?>
</td>
</tr>
<?php endif; // is_taxonomy_hierarchical() ?>
Ответ или решение
Создание динамического выпадающего меню для категорий и подкатегорий в рамках пользовательского типа записи в WordPress — важная задача, особенно если вы хотите улучшить пользовательский опыт на вашем сайте. Давайте рассмотрим, как реализовать такую функциональность для вашего кастомного типа поста "used-car" и таксономии "used-car-category", использовав PHP и JavaScript (jQuery).
Шаг 1: Регистрация кастомного типа записи и таксономии
Убедитесь, что ваш кастомный тип записи (CPT) и таксономия правильно зарегистрированы в functions.php. Вы, вероятно, уже сделали это, но на всякий случай добавлю пример.
function register_used_car() {
// Регистрация кастомного типа записи
register_post_type('used-car', array(
'labels' => array(
'name' => __('Used Cars'),
'singular_name' => __('Used Car')
),
'public' => true,
'has_archive' => true,
'supports' => array('title', 'editor', 'thumbnail')
));
}
add_action('init', 'register_used_car');
function register_used_car_category() {
// Регистрация таксономии
register_taxonomy('used-car-category', 'used-car', array(
'labels' => array(
'name' => __('Car Categories'),
'singular_name' => __('Car Category')
),
'hierarchical' => true,
'show_in_rest' => true
));
}
add_action('init', 'register_used_car_category');Шаг 2: Создание формы с выпадающими списками
Теперь перейдем к созданию формы. Эта часть будет содержать PHP для генерации HTML и jQuery для динамического обновления подкатегорий.
HTML и PHP
Добавьте следующий код в том месте, где вы хотите отобразить форму на главной странице:
<form id="used-car-search" method="get" action="<?php echo esc_url(home_url('/')); ?>">
<select id="car-make-dropdown" name="car-make">
<option value=""><?php _e('Выберите марку', 'textdomain'); ?></option>
<?php
$terms = get_terms(array(
'taxonomy' => 'used-car-category',
'parent' => 0,
'hide_empty' => false,
));
foreach ($terms as $term) {
echo '<option value="' . esc_attr($term->term_id) . '">' . esc_html($term->name) . '</option>';
}
?>
</select>
<select id="car-model-dropdown" name="car-model" disabled>
<option value=""><?php _e('Сначала выберите марку', 'textdomain'); ?></option>
</select>
<button type="submit"><?php _e('Поиск', 'textdomain'); ?></button>
</form>jQuery для динамического обновления модели автомобилей
Теперь добавьте следующее в ваш JavaScript файл или прямо на страницу (не забудьте подключить jQuery):
jQuery(document).ready(function($) {
$('#car-make-dropdown').change(function() {
var parentCat = $(this).val();
$('#car-model-dropdown').prop('disabled', !parentCat);
if (parentCat) {
$.ajax({
url: '<?php echo admin_url('admin-ajax.php'); ?>',
type: 'POST',
data: {
action: 'get_car_models',
parent_cat_id: parentCat
},
success: function(response) {
$('#car-model-dropdown').html(response);
}
});
} else {
$('#car-model-dropdown').html('<option value=""><?php _e('Сначала выберите марку', 'textdomain'); ?></option>');
}
});
});Шаг 3: Обработка Ajax-запроса в PHP
Добавьте следующий код в functions.php:
function get_car_models_callback() {
$parent_cat_id = intval($_POST['parent_cat_id']);
$child_terms = get_terms(array(
'taxonomy' => 'used-car-category',
'child_of' => $parent_cat_id,
'hide_empty' => false
));
if (!empty($child_terms)) {
echo '<option value="">' . __('Выберите модель', 'textdomain') . '</option>';
foreach ($child_terms as $term) {
echo '<option value="' . esc_attr($term->term_id) . '">' . esc_html($term->name) . '</option>';
}
} else {
echo '<option value="">' . __('Нет доступных моделей', 'textdomain') . '</option>';
}
wp_die();
}
add_action('wp_ajax_get_car_models', 'get_car_models_callback');
add_action('wp_ajax_nopriv_get_car_models', 'get_car_models_callback');Заключение
Следуя этим шагам, вы сможете создать интерактивное выпадающее меню с динамическим обновлением подкатегорий на вашей главной странице. Это улучшит пользовательский интерфейс и упростит поиск для ваших посетителей. Если у вас есть дополнительные вопросы или проблемы с реализацией, пожалуйста, не стесняйтесь обращаться за дальнейшей помощью.