Редактирование кода CSS

При изменении внешнего вида блога с помощью кода CSS следуйте описанным ниже правилам.

Настройка переменных

В разделе кода <head> необходимо установить теги <b:skin> </b:skin>.

Между этими тегами располагаются объявления стилей CSS, а также названия переменных, благодаря которым ваш дизайн будет совместим со страницей "Шрифты и цвета".

Пример

<head>

    

    ...

    <b:skin>

     <style type='text/css'>

     /*

      * Определения переменных:

      *  <Variable name='bgcolor' description='Page Background Color'

          type='color' default='#fff'/>

      */

     body {

       background: $bgcolor;

       margin: 0;

       padding: 40px 20px;

     }

     </style>

    </b:skin>

    </head>

В блоге не показывается код CSS, заключенный в теги комментариев /* и */.

Здесь перечисляются переменные (по одной для каждого шрифта или цвета с вкладки "Шрифты и цвета"), каждая из которых должна содержать информацию, представленную в примере выше.

name – может содержать буквы или цифры. Названия переменных в шаблонах не должны повторяться.
description – добавление описания, которое появится в разделе "Шрифты и цвета".
type – font (шрифт) или color (цвет).
default – значение по умолчанию. Для цветов следует использовать шестнадцатеричные коды, например #FF0066. Для шрифтов используется набор атрибутов font-style (стиль), font-weight (насыщенность), font-size (размер) и font-family (семейство шрифтов).

Использование переменных

Чтобы использовать значение заданной переменной, укажите ее название в виде $variable_name в фрагменте кода CSS b:skin.

Типы переменных

В дизайнере шаблонов можно редактировать заданные вами типы переменных CSS. Руководствуйтесь следующими правилами:

переменные цветов позволяют выбрать цвет из палитры в дизайнере шаблонов;
переменные шрифтов позволяют задать шрифт и его размер, а также выбрать полужирное или курсивное начертание.

В приведенном выше примере переменная под названием bgcolor задает белый цвет (#fff). В коде далее есть следующий фрагмент: background: $bgcolor. В результате фон становится белым, и вы можете изменить его в разделе "Шрифты и цвета".

Примечание. Создавать переменные для других типов атрибутов CSS не нужно. Их можно включать в код CSS обычным образом (как атрибуты margin: и padding: в примере выше).

Подробнее о CSS…