Встроенные стили для jquery-ui-datepicker

Question

Встроенные стили для jquery-ui-datepicker

27 янв. 2013 г., 15:44:47

Просмотры: 25K

Голосов: 12

Я хочу использовать datepicker, который поставляется в комплекте с WordPress, на фронтенде сайта. Я подключил jquery-ui-datepicker, но datepicker не имеет стилей (ошибок JavaScript в консоли нет). Существует ли соответствующий wp_enqueue_style для этого?

Я использовал этот код в functions.php

function rr_scripts() {
  wp_enqueue_script( 'jquery' );
  wp_enqueue_script( 'jquery-ui-datepicker', array( 'jquery' ) );

  wp_register_style( 'bootstrap_css', get_template_directory_uri() . '/assets/css/bootstrap.min.css' );
  wp_enqueue_style( 'bootstrap_css' ); # Я использую Twitter Bootstrap для CSS (если это имеет значение)
}
add_action( 'wp_enqueue_scripts', 'rr_scripts' );

RRikesh

5.66K

css wp enqueue style jquery ui выбор даты

Все ответы на вопрос

Комментарии

+1, но нет необходимости регистрировать скрипт отдельно, а затем подключать его. Объедините в одно действие, например: wp_enqueue_style( 'bootstrap_css', get_template_directory_uri() . '/assets/css/bootstrap.min.css' );

random_user_name

14 янв. 2017 г. 19:19:21

Я застрял на части с CSS, но вы сделали мой день. Спасибо

Frank

13 июл. 2019 г. 12:37:56

Чтобы загрузить скрипт и стили, добавьте следующий код в файл functions.php вашей темы.

function add_e2_date_picker(){
//Файл jQuery UI date picker
wp_enqueue_script('jquery-ui-datepicker');
//CSS-файл темы jQuery UI
wp_enqueue_style('e2b-admin-ui-css','http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/themes/base/jquery-ui.css',false,"1.9.0",false);
}
add_action('wp_enqueue_scripts', 'add_e2_date_picker');

Скрипт для использования в админке:

function add_e2_date_picker(){
//Файл jQuery UI date picker
wp_enqueue_script('jquery-ui-datepicker');
//CSS-файл темы jQuery UI
wp_enqueue_style('e2b-admin-ui-css','http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/themes/base/jquery-ui.css',false,"1.9.0",false);
}
add_action('admin_enqueue_scripts', 'add_e2_date_picker');

Мне нужно подключиться к options-general.php, чтобы отобразить выбор даты в Настройки->Date Picker. Просто поместите этот код снова в файл functions.php после предыдущего кода.

function register_datepiker_submenu() {
    add_submenu_page( 'options-general.php', 'Date Picker', 'Date Picker', 'manage_options', 'date-picker', 'datepiker_submenu_callback' );
}

function datepiker_submenu_callback() { ?>

    <div class="wrap">

    <input type="text" class="datepicker" name="datepicker" value=""/>

    </div>

    <script>
    jQuery(function() {
        jQuery( ".datepicker" ).datepicker({
            dateFormat : "dd-mm-yy"
        });
    });
    </script> 

<?php }
add_action('admin_menu', 'register_datepiker_submenu');

?>

Подробнее смотрите в статье Добавление jQuery Date Picker в тему или плагин WordPress

csehasib

269

25 февр. 2015 г. 07:04:33

david.binda 3.38K · Accepted Answer · 2013-01-27T16:44:42Z

Насколько мне известно, для datepicker нет встроенных стилей. Вам нужно зарегистрировать свои собственные. Тогда код будет выглядеть так:

function rr_scripts() {
  wp_enqueue_script( 'jquery' );
  wp_enqueue_script( 'jquery-ui-datepicker', array( 'jquery' ) );

  wp_register_style( 'bootstrap_css', get_template_directory_uri() . '/assets/css/bootstrap.min.css' );
  wp_enqueue_style( 'bootstrap_css' ); // Я использую Twitter Bootstrap в качестве CSS (если это имеет значение)

  wp_register_style('jquery-ui', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css');
  wp_enqueue_style( 'jquery-ui' );   
}

add_action( 'wp_enqueue_scripts', 'rr_scripts' );

david.binda

3.38K

27 янв. 2013 г. 16:44:42