Розпродаж хостинг-планів на неймовірних умовах!
Знижка від 300 до 500грн!
Як правильно додавати у тему CSS-файли

автор Дмитро Кондрюк

23.01.2011

0

Зверніть увагу: ця публікація побачила світ більше року тому, з того часу багато чого могло змінитися ;)

При розробці тем часто виникає необхідність додати в тему додаткові CSS-файли для оформлення певних частин сайту, або ж специфічний CSS для Internet Explorer.

Це можна зробити прописавши їх вручну у файлі header.php, АЛЕ так не зовсім правильно, краще це робити згідно правил. Я саме про них і розповім.

Розгляну 3 приклади. Один більш складний, другий для додавання стилів для ІЕ, а третій найпростіший.

1) Складніший, але кращий спосіб додавання CSS-файлу
Спочатку ми реєструємо файл, а потім виводимо його. Цей спосіб зручно використовувати коли потрібно у кількох різних шаблонах вивести файл(наприклад, у різних header.php, залежно від випадку). Код реєстрації стилю можна помістити у файлі functions.php, а потім вже просто його викликати.

/**
 * Реєструємо і додаємо новий CSS-файл
 */
$theme  = get_theme( get_current_theme() ); // Отримуємо інформацію про тему

/* Реєструємо файл CSS */
wp_register_style(
	'my-style', // Назва стилю
	get_bloginfo( 'template_directory' ) . '/css/qaz.css', // URL файлу
	false,
	$theme['Version'] // Версія теми
);

/* Виводимо зареєстрований файл */
wp_enqueue_style( 'my-style' );

2) Приклад додавання стилю для ІЕ

wp_register_style( 'cehla-ie-css', get_bloginfo( 'template_directory' ) . '/css/ie.css', false, '13.666' ); // Реєструємо стиль для ІЕ
$GLOBALS['wp_styles'] -> add_data( 'cehla-ie-css', 'conditional', 'lt IE 9' ); // Додаємо умовні теґи
wp_enqueue_style( 'cehla-ie-css' ); // Виводимо стиль у темі

3) Простий спосіб додавання CSS-файлу. Підходить для більшості тем.

/* Можна ще так додавати файли */
wp_enqueue_style( 'qwe', get_bloginfo( 'template_directory' ) . '/css/qwe.css' );

Більше інформації:

Дмитро Кондрюк

Автор публікації Дмитро Кондрюк

В веб-індустрії з 2003 року. В 2009р. заснував проект Український WordPress (що у подальшому став офіційним сайтом команди локалізації WordPress в Україні). З 2010 року засновник і технічний директор проекту Український хостинг для WordPress (WPHost.me) - повноцінного хостинг-сервісу, максимально оптимізованого на використання CMS WordPress.

Є що відповісти?

Ваш email не буде публікуватися

Можна скористатися такими тегами в тексті:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>