Как зарегистрировать или подключить пользовательский CSS файл в WordPress?

20 февр. 2013 г., 21:34:26
Просмотры: 18.6K
Голосов: 4

Добрый день.

Я использую тему WordPress и хочу добавить свои собственные CSS стили. Я пробовал добавлять отдельную таблицу стилей после всех вызовов php-стилей в файле header.php. Также пробовал редактировать стили через Внешний вид>Редактор и даже добавлял !important ко всем своим стилям. Но WordPress продолжает перезаписывать мои стили стандартной таблицей стилей.

Я прочитал немного о регистрации/подключении таблиц стилей в functions.wp-styles.php, но этот код для меня как китайская грамота... Я не знаю, куда добавить свой css...

Вот код из страницы functions.wp-styles.php: Буду очень благодарен за помощь!

<?php
/**
 * BackPress процедурный API для стилей.
 *
 * @package BackPress
 * @since r79
 */

/**
 * Отображает стили из очереди или указанные в $handles.
 *
 * @since r79
 * @uses do_action() Вызывает хук 'wp_print_styles'.
 * @global object $wp_styles Объект WP_Styles для вывода стилей.
 *
 * @param array|bool $handles Стили для вывода. Пустой массив выводит очередь,
 *  массив с одной строкой выводит этот стиль, массив строк выводит указанные стили.
 * @return bool True при успехе, false при ошибке.
 */
function wp_print_styles( $handles = false ) {
    if ( '' === $handles ) // для wp_head
        $handles = false;

    if ( ! $handles )
        do_action( 'wp_print_styles' );

    global $wp_styles;
    if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
        if ( ! did_action( 'init' ) )
            _doing_it_wrong( __FUNCTION__, sprintf( __( 'Скрипты и стили не должны регистрироваться или подключаться до хуков %1$s, %2$s или %3$s.' ),
                '<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );

        if ( !$handles )
            return array(); // Нет необходимости создавать экземпляр, если ничего нет.
        else
            $wp_styles = new WP_Styles();
    }

    return $wp_styles->do_items( $handles );
}

/**
 * Добавляет дополнительный CSS.
 *
 * Работает только если таблица стилей уже добавлена.
 * Принимает строку $data с CSS кодом. Если два или более блока CSS кода
 * добавлены к одной таблице стилей $handle, они будут выводиться в порядке
 * добавления, т.е. последующие стили могут переопределять предыдущие.
 *
 * @since 3.3.0
 * @see WP_Scripts::add_inline_style()
 */
function wp_add_inline_style( $handle, $data ) {
    global $wp_styles;
    if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
        if ( ! did_action( 'init' ) )
            _doing_it_wrong( __FUNCTION__, sprintf( __( 'Скрипты и стили не должны регистрироваться или подключаться до хуков %1$s, %2$s или %3$s.' ),
                '<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );
        $wp_styles = new WP_Styles();
    }

    return $wp_styles->add_inline_style( $handle, $data );
}

/**
 * Регистрирует файл CSS стилей.
 *
 * @since r79
 * @see WP_Styles::add() Для дополнительной информации.
 * @global object $wp_styles Объект WP_Styles для вывода стилей.
 * @link http://www.w3.org/TR/CSS2/media.html#media-types Список типов медиа CSS.
 *
 * @param string $handle Название таблицы стилей.
 * @param string|bool $src Путь к таблице стилей от корня WordPress. Пример: '/css/mystyle.css'.
 * @param array $deps Массив зависимостей (названий таблиц стилей, которые должны быть загружены перед этой).
 *  Передайте пустой массив, если зависимостей нет.
 * @param string|bool $ver Версия таблицы стилей. Установите null для отключения.
 *  Используется для гарантии отправки правильной версии клиенту независимо от кэширования.
 * @param string $media Медиа-тип, для которого определены эти стили.
 */
function wp_register_style( $handle, $src, $deps = array(), $ver = false, $media = 'all' ) {
    global $wp_styles;
    if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
        if ( ! did_action( 'init' ) )
            _doing_it_wrong( __FUNCTION__, sprintf( __( 'Скрипты и стили не должны регистрироваться или подключаться до хуков %1$s, %2$s или %3$s.' ),
                '<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );
        $wp_styles = new WP_Styles();
    }

    $wp_styles->add( $handle, $src, $deps, $ver, $media );
}

/**
 * Удаляет зарегистрированный CSS файл.
 *
 * @since r79
 * @see WP_Styles::remove() Для дополнительной информации.
 * @global object $wp_styles Объект WP_Styles для вывода стилей.
 *
 * @param string $handle Название таблицы стилей.
 */
function wp_deregister_style( $handle ) {
    global $wp_styles;
    if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
        if ( ! did_action( 'init' ) )
            _doing_it_wrong( __FUNCTION__, sprintf( __( 'Скрипты и стили не должны регистрироваться или подключаться до хуков %1$s, %2$s или %3$s.' ),
                '<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );
        $wp_styles = new WP_Styles();
    }

    $wp_styles->remove( $handle );
}

/**
 * Подключает файл CSS стилей.
 *
 * Регистрирует стиль, если указан src (НЕ перезаписывает) и подключает.
 *
 * @since r79
 * @see WP_Styles::add(), WP_Styles::enqueue()
 * @global object $wp_styles Объект WP_Styles для вывода стилей.
 * @link http://www.w3.org/TR/CSS2/media.html#media-types Список типов медиа CSS.
 *
 * @param string $handle Название таблицы стилей.
 * @param string|bool $src Путь к таблице стилей от корня WordPress. Пример: '/css/mystyle.css'.
 * @param array $deps Массив зависимостей (названий таблиц стилей, которые должны быть загружены перед этой).
 *  Передайте пустой массив, если зависимостей нет.
 * @param string|bool $ver Версия таблицы стилей, если есть. Этот параметр
 *  используется для гарантии отправки правильной версии клиенту независимо от кэширования.
 * @param string $media Медиа-тип, для которого определены эти стили.
 */
function wp_enqueue_style( $handle, $src = false, $deps = array(), $ver = false, $media = 'all' ) {
    global $wp_styles;
    if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
        if ( ! did_action( 'init' ) )
            _doing_it_wrong( __FUNCTION__, sprintf( __( 'Скрипты и стили не должны регистрироваться или подключаться до хуков %1$s, %2$s или %3$s.' ),
                '<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );
        $wp_styles = new WP_Styles();
    }

    if ( $src ) {
        $_handle = explode('?', $handle);
        $wp_styles->add( $_handle[0], $src, $deps, $ver, $media );
    }
    $wp_styles->enqueue( $handle );
}

/**
 * Удаляет подключенный стиль.
 *
 * @since WP 3.1
 * @see WP_Styles::dequeue() Для информации о параметрах.
 */
function wp_dequeue_style( $handle ) {
    global $wp_styles;
    if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
        if ( ! did_action( 'init' ) )
            _doing_it_wrong( __FUNCTION__, sprintf( __( 'Скрипты и стили не должны регистрироваться или подключаться до хуков %1$s, %2$s или %3$s.' ),
                '<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );
        $wp_styles = new WP_Styles();
    }

    $wp_styles->dequeue( $handle );
}

/**
 * Проверяет, добавлен ли стиль в WordPress Styles.
 *
 * По умолчанию проверяет, подключен ли стиль. Вы также можете
 * передать 'registered' в $list, чтобы проверить, зарегистрирован ли стиль,
 * или проверить статусы обработки с 'to_do' и 'done'.
 *
 * @since WP unknown; BP unknown
 * @global object $wp_styles Объект WP_Styles для вывода стилей.
 *
 * @param string $handle Название таблицы стилей.
 * @param string $list Опционально. По умолчанию 'enqueued'. Значения:
 *  'registered', 'enqueued' (или 'queue'), 'to_do', и 'done'.
 * @return bool Находится ли стиль в списке.
 */
function wp_style_is( $handle, $list = 'enqueued' ) {
    global $wp_styles;
    if ( ! is_a( $wp_styles, 'WP_Styles' ) ) {
        if ( ! did_action( 'init' ) )
            _doing_it_wrong( __FUNCTION__, sprintf( __( 'Скрипты и стили не должны регистрироваться или подключаться до хуков %1$s, %2$s или %3$s.' ),
                '<code>wp_enqueue_scripts</code>', '<code>admin_enqueue_scripts</code>', '<code>init</code>' ), '3.3' );
        $wp_styles = new WP_Styles();
    }

    return (bool) $wp_styles->query( $handle, $list );
}
0
Все ответы на вопрос 1
1

Обратитесь к разделу Codex о функции wp_enqueue_style().

Предположим, у вас есть пользовательская таблица стилей с именем custom.css, расположенная в корневой директории вашей темы:

wp_enqueue_style( 'mytheme-custom', get_template_directory_uri() . '/custom.css' );

Этот код нужно поместить в файл functions.php, внутри функции-обработчика, подключенной к соответствующему хуку, например:

function wpse87681_enqueue_custom_stylesheets() {
    if ( ! is_admin() ) {
        wp_enqueue_style( 'mytheme-custom', get_template_directory_uri() . '/custom.css' );
    }
}
add_action( 'wp_enqueue_scripts', 'wpse87681_enqueue_custom_stylesheets', 11 );

Вы можете экспериментировать с хуком (можно использовать даже wp_head) или приоритетом (по умолчанию 10), чтобы убедиться, что ваша пользовательская таблица стилей загружается после других таблиц стилей, которые вы хотите переопределить. Однако, если вы просто пытаетесь переопределить стандартную таблицу стилей, подойдет любой подходящий хук и любой приоритет, поскольку ссылка на стандартную таблицу стилей обычно жестко прописана в шапке документа в файле header.php.

20 февр. 2013 г. 21:40:44
Комментарии

Чип - благодарю тебя. Ты мой герой сегодня. Я потратил 5 часов, пытаясь решить эту проблему... читал и исследовал, а ты помог мне за 1 минуту... Огромное спасибо

user27777 user27777
20 февр. 2013 г. 22:01:13