Categories

Новые шаблоны

WordPress. Cherry Framework 3.x постоянно перезаписывает мои CSS изменения

Ryan DeWitt Июнь 22, 2015
Rating: 5.0. From 3 votes.
Please wait...

Ниже приведен список причин, из-за которых могут возникнуть проблемы с CSS изменениями (например, откат изменений в стилях шаблона).

  1. Изменения, выполненные в файлах CherryFramework, а не в файлах дочерней темы themeXXXXX.

  2. Изменения, выполненные в файле main-style.css.

  3. Изменения, выполненные в файле themeXXXXX/style.css без использования свойства !important.

  4. Изменения, выполненные в секции Пользовательский CSS код (Custom CSS), не были сохранены перед обновлением CherryFramework и не были возвращены обратно вручную и сохранены после обновления.

ВАЖНО: Все CSS изменения необходимо выполнять в файлах дочерней темы. Обычно, ее название — themeXXXXX. НЕ редактируйте файлы из папки CherryFramework, так как все изменения будут утрачены после обновления CherryFramework.

Этот туториал покажет, как правильно редактировать CSS файлы.

WordPress. Cherry Framework постоянно перезаписывает мои CSS изменения

Давайте рассмотрим структуру CSS файлов дочерней темы (themeXXXXX).

  1. style.css – это главный CSS файл, необходимый для корректного функционирования темы. В этот файл вы можете добавлять пользовательские CSS стили.

  2. style.less – .less файл, содержащий CSS стили темы.

  3. main-style.css – CSS файл, содержащий стили темы. Он автоматически генерируется из файла style.less. Поэтому НЕЛЬЗЯ редактировать файл main-style.css.

    WordPress. Cherry Framework keeps reverting my CSS changes-1

Ниже мы продемонстрируем, как правильно выполнять изменения в CSS файлах.

Как задавать пользовательские стили в файле style.css?

  1. Давайте изменим цвет кнопки. Проинспектируйте элемент с помощью расширения Firebug. Мы можем видеть, что стили данной кнопки задаются в файле main-styles.css. НЕ редактируйте CSS код в файле main-styles.css, потому что он автоматически генерируется из файла style.less и все изменения, выполненные в этом файле, будут утеряны. Скопируйте CSS правило (определения стиля) в буфер обмена.

    WordPress. Cherry Framework keeps reverting my CSS changes-2

  2. Откройте файл style.css (который находится в папке темы themeXXXXX ). Вставьте скопированное CSS правило. Оставьте отредактированную часть кода (в нашем случае, это атрибут background) и добавьте свойство !important (чтобы правило имело самый высокий приоритет). Сохраните изменения.

    WordPress. Cherry Framework keeps reverting my CSS changes-3

  3. Обновите страницу сайта. Мы можем видеть, что цвет кнопки изменился в соответствии со стилем, указанным в файле style.css.

    WordPress. Cherry Framework keeps reverting my CSS changes-4

Как задавать пользовательские стили в файле style.less ?

  1. Пользовательские стили можно добавлять в файл style.less (иногда стили, заданные в файле style.css, могут быть перезаписаны стилями, заданными в файле style.less). Проинспектируйте элемент с помощью расширения Firebug. НЕ редактируйте CSS код в файле main-styles.css, потому что он автоматически генерируется из файла style.less и все изменения, выполненные в этом файле, будут утеряны. Скопируйте CSS правило (определения стиля) в буфер обмена.

  2. Откройте файл style.less (который находится в папке темы themeXXXXX ). Вставьте скопированное CSS правило. Оставьте отредактированную часть кода (в нашем случае, это атрибут background) и добавьте свойство !important (чтобы правило имело самый высокий приоритет). Сохраните изменения.

    WordPress. Cherry Framework keeps reverting my CSS changes-5

  3. Обновите страницу сайта. Теперь мы можем видеть, что стиль, который мы добавили в файл style.less, был дублирован в файл main-style.css. Это означает, что предыдущий файл был удален и вместо него был срегенерирован новый файл. Вот поэтому НЕЛЬЗЯ редактировать файл main-style.css.

    WordPress. Cherry Framework keeps reverting my CSS changes-6

Как задавать пользовательские стили в Cherry Options?

ВАЖНО: Обязательно делайте резервную копию пользовательского кода (сохраните на внешнем носителе или в файлообменнике), потому что этот код может быть утерян после обновления CherryFramework. Вам необходимо будет добавить этот код обратно после обновления CherryFramework. Код можно сохранить в текстовом файле на внешнем носителе или в файлообменнике.

  1. Вы можете добавлять пользовательские стили в Опциях Cherry -> Основные (Cherry Options->General).

    WordPress. Cherry Framework keeps reverting my CSS changes-7

  2. Прокрутите до секции Пользовательский CSS код (Custom CSS), которая находится во вкладке Основные (General) в конце страницы. Проинспектируйте элемент с помощью расширения Firebug. Скопируйте CSS правило в буфер обмена. В большинстве случаев нет необходимости в использовании свойства !important, так как пользовательские стили, заданные в секции Custom CSS уже имеют самый высокий приоритет. Сохраните изменения.

    WordPress. Cherry Framework keeps reverting my CSS changes-8

  3. Обновите страницу сайта. Мы можем видеть, что оригинальные стили были перезаписаны. Еще раз убедитесь, что вы сделали резервную копию CSS стилей, добавленных в секцию Custom CSS в Опциях Cherry. Вы можете сохранить их в текстовом файле на внешнем носителе или в файлообменнике.

    Убедитесь, что вы нажали кнопку Сохранить (Save) во вкладке Основные (General) в Опциях Cherry после обновления CherryFramework (это действие необходимо выполнять после обновления).

    WordPress. Cherry Framework keeps reverting my CSS changes-9

Вы также можете воспользоваться детальным видео туториалом:

WordPress. Cherry Framework постоянно перезаписывает мои CSS изменения

Тема Wordpress
Эта запись была размещена в WordPress туториалы и помечена как changes, Cherry, css, edit, framework, how, lost, reverted. Добавьте в закладки постоянную ссылку.

Submit a ticket

Если вы не смогли найти подходящее решение проблемы, пожалуйста воспользуйтесь следующей ссылкой, чтобы отправить запрос команде технической поддержки.
Отправить запросВы получите ответ в течение 24 часов

Чат
We help you to choose the right product.