Пишем тему для WordPress - стили

После значительного перерыва решил дописать серию статей по созданию темы для WP с нуля. Итак, сегодня мы выполняем разбивку HTML-заготовки по соответсвующим файлам шаблона. Приступим.

WordPress - style.css

Создайте папку будущей темы "http://example.com/wp-content/themes/codapress-purple". Я назвал её "codapress-purple".

  1. Поместите CSS-файлы "main" и "skin" в нашу новую папку. Туда же копируем папку с изображениями (design).
  2. Переименуйте "skin" в "style", "design" в "images".
  3. Откройте "style.css". Он является главным. Чтобы платформа опознала новый "скин" добавьте туда следующий заголовочный комментарий-описание:
    /*
        Theme Name: CodaPress Purple
        Theme URI: http://druweb.ru/wordpress-templates.html
        Description: Собрана на основе готовой HTML-верстки от TempltesDock.
        Author: Владимир Н.
        Author URI: http://druweb.ru
        Version: 1.0.0
        Tags: two-columns, fixed-width, right-sidebar, white, light, purple
    */
    
    Друг за другом идут наименование, URL темы, описание, автор, URL автора, номер версии, метки. Поясню лишь последнюю строчку: метки позволяют системе группировать "шкурки" со схожими свойствами, например по цвету (white) или ширине (fixed-width, фиксированная).
  4. Подключите второй "main". Я сделаю это средствами CSS:
    @import url(main.css);
    
    "Трюк" сработает на актуальных версиях Chrome, Opera, IE, Firefox.
  5. Помня поправки выше, пользуемся функцией поиска и замены вашего редактора (я предпочитаю Notepad++) заменяем все подключения картинок. Т.е. "../design" на "images".

На этой ноте считаю этап по предварительной подготовке каскадных таблиц стилей завершенным успешно.





© 2012-2014 Druweb.ru. Вы можете спокойно копировать любые материалы сайта только при наличии обратной ссылки.