Применить свои стили (CSS) в ЖЖ (на примере заголовка поста)
Давным-давно, кажется, сразу после создания, у меня был журнал в мрачных тонах, с большим количеством черного. Сейчас я даже не знаю: остались ли у меня скриншоты с тех пор? Кажется, прошло несколько лет перед тем, как я поменял его на готовый дизайн "Light clouds". И все мне в нем нравилось (и нравится), кроме нескольких мелочей. А самая раздражающая из этих мелочей - то, что заголовки постов выводятся полностью большими буквами! Мне кажется, что это легкий перегиб! И вот когда вчера я написал очередной пост, а из-за больших букв заголовок (в очередной раз) коварно растянулся на 2 строки, я решил, что "хватит это терпеть"!
Вот заголовок, который стал последней каплей:
По сути, решение проблемы сводится к ответу на три вопроса: где писать, что писать и как писать? Отвечу на них последовательно.
Что писать?
Писать надо будет CSS-стили. Подробнее про них можно почитать, для начала, в Википедии. Если CSS-разметка вам совсем в новинку, пишите - постараюсь помочь!
Где писать?
Переходим в Настройки, выбираем ссылку Изменить внешний вид журнала, в правой части окна выбираем ссылку Настройте свой стиль:
и дальше в меню слева Custom CSS:
Если вам нужно только поменять CSS-стили, можно сразу пройти по последней ссылке.
Как писать?
Перед нами пустое окно, в которое можно прописать свои CSS-стили. Нам необходимо изменить стиль заголовка. Для того, чтобы понять, какой именно стиль нужно "перекрыть", я кликаю правой кнопкой по заголовку и выбираю вариант Просмотреть код элемента (в других браузерах название будет незначительно отличаться):
В открывшейся части экрана нахожу элемент, для которого прописан "text-transform: uppercase":
Итак, все понятно: в CSS необходимо будет для элемента H2.page-header2 задать значение "text-transform: none;". Для этого в окне Custom CSS делаем следующую запись:
H2.page-header2 {
text-transform: none; !important
}
Слово "!important" обозначает, что эта запись имеет приоритет перед всеми остальными.
Сохраняем запись при помощи кнопки Сохранить изменения:
Переходим на главную страницу журнала и смотрим на заголовок:
Задача решена!
Вот заголовок, который стал последней каплей:
По сути, решение проблемы сводится к ответу на три вопроса: где писать, что писать и как писать? Отвечу на них последовательно.
Что писать?
Писать надо будет CSS-стили. Подробнее про них можно почитать, для начала, в Википедии. Если CSS-разметка вам совсем в новинку, пишите - постараюсь помочь!
Где писать?
Переходим в Настройки, выбираем ссылку Изменить внешний вид журнала, в правой части окна выбираем ссылку Настройте свой стиль:
и дальше в меню слева Custom CSS:
Если вам нужно только поменять CSS-стили, можно сразу пройти по последней ссылке.
Как писать?
Перед нами пустое окно, в которое можно прописать свои CSS-стили. Нам необходимо изменить стиль заголовка. Для того, чтобы понять, какой именно стиль нужно "перекрыть", я кликаю правой кнопкой по заголовку и выбираю вариант Просмотреть код элемента (в других браузерах название будет незначительно отличаться):
В открывшейся части экрана нахожу элемент, для которого прописан "text-transform: uppercase":
Итак, все понятно: в CSS необходимо будет для элемента H2.page-header2 задать значение "text-transform: none;". Для этого в окне Custom CSS делаем следующую запись:
H2.page-header2 {
text-transform: none; !important
}
Слово "!important" обозначает, что эта запись имеет приоритет перед всеми остальными.
Сохраняем запись при помощи кнопки Сохранить изменения:
Переходим на главную страницу журнала и смотрим на заголовок:
Задача решена!