WordPress. Cherry Framework 3.x不断恢复我的CSS更改

Ryan DeWitt June 22, 2015

Rating: 5.0/5. From 3 votes.

Please wait...

下面你可以看到导致CSS更改问题的原因列表(比如恢复对模板样式的更改).

更改在CherryFramework文件中执行，而不是在themeXXXXX中执行 child theme files.
Changes were performed in main-style.css file.
Changes performed in themeXXXXX/style.css 没有申报的文件 !important property.
Changes performed in Custom CSS 章节在更新CherryFramework之前没有保存，更新之后也没有放回去保存 update.

重要:所有CSS更改都应该在 child theme. 通常它被称为themeXXXXX. 请不要在CherryFramework文件夹中执行更改，因为所有更改将在CherryFramework之后丢失 update.

本教程展示了如何正确地对CSS进行更改.

WordPress. Cherry Framework一直在还原我的CSS更改

Let’s check structure of CSS files in child theme (themeXXXXX).

style.css – the main CSS file. 这是正确的主题功能所必需的，您也可以在这里添加自定义CSS样式.
style.less – the .less 文件与主题CSS样式.
main-style.css - CSS文件与主题样式. 它是自动生成的 from style.less file, that is why you
SHOULD NOT perform changes in main-style.css file.

下面您将看到如何正确地实现对CSS的更改.

如何定义自定义样式 style.css file?

让我们改变一下按钮的颜色. Inspect element using Firebug software. 我们可以看到按钮的样式是在main-styles中定义的.css file. DO NOT perform changes in main-styles.css 文件，因为它是从样式自动生成的.less 对该文件所做的所有更改都将丢失. 复制CSS样式声明.
Open style.css 文件(该文件位于 themeXXXXX folder). 粘贴CSS样式声明. 留下修改过的代码部分(在我们的例子中是 background property) and add !important 指令(在这种情况下，我们的样式将具有最高优先级). Save changes.
刷新页面并检查您的站点. 我们可以看到，由于中指定的覆盖，颜色发生了变化 style.css file.

如何定义自定义样式 style.less file?

中定义自定义样式 style.less 文件(在某些情况下，样式定义在 style.css 中定义的样式可以覆盖 style.less file). Inspect element using Firebug software. DO NOT perform changes in main-styles.css 文件，因为它是从样式自动生成的.less 对该文件所做的所有更改都将丢失. 复制CSS样式声明.
Open style.less 文件(该文件位于 themeXXXXX folder). 粘贴CSS样式声明. 留下修改过的代码部分(在我们的例子中是 background property) and add !important 代码(在这种情况下，我们的样式将具有最高优先级). Save changes.
刷新页面并检查您的站点. Now we can see that 我们在样式中指定的样式.less file 已编译为主样式.css file. 这意味着以前的文件被删除，取而代之的是新文件. That is why you SHOULD NOT perform changes in main-style.css file.

如何定义自定义样式 Cherry Options?

IMPORTANT: 一定要备份自定义代码(保存在存储设备上或在 cloud)，因为这个自定义代码可能不会保存在CherryFramework之后 update. 当CherryFramework更新时，您将需要放置这些代码. You may save code as .TXT文件保存到存储设备或 cloud.

您可以在下面定义自定义样式 Cherry Options->General tab.
Scroll to Custom CSS 部分(您可以在底部找到自定义CSS部分) General tab page). Inspect element using Firebug software. 复制CSS样式声明. In most cases !important 不应该指定为自定义CSS定义的自定义样式 tab have the highest priority. Save changes.
刷新页面并检查您的站点. 我们可以看到原来的样式被覆盖了. Once again, 一定要备份你在Cherry选项的自定义CSS部分指定的CSS样式. You may save them as .TXT文件保存到存储设备或 cloud.

Be sure to open General tab 在Cherry选项中，当CherryFramework update 被执行(之后需要这样的操作 update).