Как редактировать CSS в WordPress

🗓️ Обновлено: 27.08.2021
💬Комментариев: 0
👁️Просмотров: 226
web

Как добавить свои стили в WordPress или редактировать существующие? Очень просто! Есть несколько способов, как это сделать.

Первый способ (неправильный!)

Самый частый вариант, как люди редактируют стили в шаблоне, это когда они просто переходят в админке в раздел Внешний вид -> Редактор тем и там находят файл style.css, куда и вставляют свой css код.

Как не нужно редактировать CSS код в WordPress
Как не нужно редактировать CSS код в WordPress

Нажимаете кнопку «Обновить файл» и вот вы и добавили свой css код в WordPress. Но почему так нельзя делать? Потому что при следующем обновлении темы (а обновлять шаблоны нужно!) все изменения, которые вы внесли, пропадут.

Что же делать? Вы можете создать дочернюю тему и там редактировать файл css стили. Как это сделать мы расписали в этой статье.

Также не стоит редактировать файл style.css родительской темы через файловый менеджер на хостинге или через FTP. Причина все та же — после обновления шаблона ваш код будет удален.

Второй способ

Этот вариант более правильный. WordPress дает возможность редактировать css в встроенном специальном редакторе. Как это сделать?

  1. Выберете в админ панели вкладку «Внешний вид -> Настроить»;
  2. Далее в левом меню найдите вкладку «Дополнительные стили» (обычно в самом низу);
  3. Вставьте нужный вам css код и не забудьте нажать на кнопку «Опубликовать» вверху.

ВАЖНО! Данные стили будут сохраняться только для текущей вашей темы. То есть, если вы решите поменять шаблон, то ваш CSS код перестанет работать.

Но, повторимся, самым правильным по нашему мнению способом редактированию css кода в WordPress является создание дочерней темы и добавление/изменение стилей уже в ней.

Статья была полезной?
👍
Да - 0
👎
Нет - 1
💬 Комментарии:

CSS Головоломки в Telegram
Подписывайся и не пропускай:
Актуальные новости
Интересные задачки
Полезные подборки
Вступай в клуб
🧑‍💻Присоединяйся к сообществу!
Patreon
Наш рейтинг
🏆Лучший хостинг для сайта
9/10
8/10
8/10
4
8/10
Где учиться
🧑‍🎓Рекомендуемые курсы
Javascript-разработчик
Введение в программирование
SEO-специалист
Проверка знаний
🤔Хорошо ли вы знаете CSS?
Есть два блочных элемента, которые идут друг за другом в html. Какой будет оступ (margin) между ними, если задать им такие стили:

.top {
  height: 30px;
  background-color: blue;
  margin-bottom: 10px;
}
.bottom {
  height: 30px;
  background-color: red;
  margin-top: 20px;
}
    
10px
20px
30px
Very Peri
🤔Цвет 2022 года
Институт цвета Pantone объявил цвет 2022 года. Это сиреневый оттенок под названием 17-3938 Very Peri.
#6667ab