WordPress – CSS в постах

Все началось с моей идеи написать статью о CSS3 (она где-то рядом). Естественно, для статьи нужны примеры, и желательно в теле поста. Подозревая, что многие блоггеры столкнулись с этой проблемой, я обратился к гуглу.

 

Так как через wp-admin дописать CSS в шапку поста невозможно, приходится извращатся:

1.Самый очевидный и простой вариант – использовать свойство элемента style. Может и некрасиво, но вплоне пригодно, когда застилить нужно всего пару элементов.

 

2.Использовать плагин Art Direction. Он позволяет включать в посты свой CSS и javascript, но, говорят, несовместим с многими кэширующими плагинами (DB Cache, WP Super Cache, W3 Total Cache). Я им не пользовался, но если нужны динамичные страницы и лень писать что-то самому – попробуйте. Совместимость с WordPress 2.9 под вопросом.

 

3. Добавить в административную панель виджет для вставки CSS. Копируем этот код в functions.php:

 

//Custom CSS Widget

add_action('admin_menu', 'custom_css_hooks');

add_action('save_post', 'save_custom_css');

add_action('wp_head','insert_custom_css');

function custom_css_hooks() {

add_meta_box('custom_css', 'Custom CSS', 'custom_css_input', 'post', 'normal', 'high');

add_meta_box('custom_css', 'Custom CSS', 'custom_css_input', 'page', 'normal', 'high');

}

function custom_css_input() {

global $post;

echo '<input id="custom_css_noncename" name="custom_css_noncename" type="hidden" value="'.wp_create_nonce('custom-css').'" />';

echo '<textarea id="custom_css" style="width: 100%;" cols="30" rows="5" name="custom_css">'.get_post_meta($post-&gt;ID,'_custom_css',true).'</textarea>';

}

function save_custom_css($post_id) {

if (!wp_verify_nonce($_POST['custom_css_noncename'], 'custom-css')) return $post_id;

if (defined('DOING_AUTOSAVE') &amp;&amp; DOING_AUTOSAVE) return $post_id;

$custom_css = $_POST['custom_css'];

update_post_meta($post_id, '_custom_css', $custom_css);

}

function insert_custom_css() {

if (is_page() || is_single()) {

if (have_posts()) : while (have_posts()) : the_post();

echo '<!--  '.get_post_meta(get_the_ID(), '_custom_css', true).'  -->';

endwhile; endif;

rewind_posts();

}

}

Автор кода – Керрик Лонг.

Примечание:Стиль привязывается к теме. Лучше бы это все реализовать в виде плагина.

 

4.Использовать вот этот плагин. Создаем поле (custom field) “Per-Post CSS” и вписываем туда стили. Можно подключить внешний файл через поле “Per-Post CSS File”. Найдено на странице Тревора Крича. Если плагин понравился – подкиньте ему деньжат через PayPal =)

 

Заключение:

Вот несколько вариантов решения поставленной проблемы. Уверен, если подумать, можно найти еще – только зачем? Для своих нужд я использую виджет через модифицированный functions.php – чего и вам желаю.