1. 首页
  2. css

CSSCompass编译和WordPress主题

如果你是一个WordPress主题生成器和一个Sass/Compass用户,首先,你太棒了!其次,关于编译位置,有一个小问题可能会突然出现,所以让我们现在就解决它。
关于CSS和WordPress主题有两件非常重要的事情:
1. 绝对必须有一个样式表\”主题文件夹中的文件。
2. 该文件必须以注释块开头,如这是:
/*Theme Name: Twenty TenTheme URI: http://wordpress.org/Description: The 2010 default theme for WordPress.Author: wordpressdotorgAuthor URI: http://wordpress.org/Version: 1.0Tags: black, blue, white, two-columns, fixed-width, custom-header, custom-background, threaded-comments, sticky-post, translation-ready, microformats, rtl-language-support, editor-style, custom-menu (optional)License:License URI:General comments (optional).*/
如果文件不在那里或注释块丢失,WordPress甚至无法识别主题。
如果您使用的是Sass/Compass,并且您的主题有一个非常简单的样式表,也许它都在一个文件中,您只有这样一个目录:
/wp content/themes/your-themeconfig.rbindex.phpstyle.样式.css
您的配置.rb文件(用于指南针)是超标准的,如下所示:
没关系。你都准备好了。你所需要做的就是确保你使用\”!\”在最上面的评论里样式.scss因此,即使在编译/压缩发生时,注释仍然存在:
/*!Theme Name: Your Themeetc…*/问题是,我们中的许多人没有那么简单的设置。我喜欢和我的Sass一起工作,而不是把所有的东西都塞进一个文件。我更喜欢在我的主题有css和scss文件夹。例如:
/wp content/themes/your theme/csssite sub-section.css/scssu网格.scss文件_normalize.scssu排版.scsssite子站点-第.scssconfig.rbindex节.phpstyle.scssstyle.css
问题是没有允许这些编译路径的Compass配置。不会发生,显然地。(这是一种简化WordPress主题目录的方法。想象一下加载了更多的文件。)<样式.scss成功编译后,样式.scss进入样式表,自动移动样式.css从根本上说文件夹。 新建配置.rb: 显然你输入的任何代码配置.rb运行每一次编译,因此为了完成#3,我们可以编写Ruby代码,在某些事件发生时执行。在我们的例子中,当保存样式表(Compass编译完成)时,我们检查该文件是否命名为\"样式表如果是的话,把它移到一个目录上去。puts语句只是为了让您可以在命令行中查看它的工作情况,如果您愿意的话。 require \"fileutils\"on_stylesheet_saved do |file|if File.exists?(file) && File.basename(file) == \"style.css\"puts \"Moving: #{file}\"FileUtils.mv(file, File.dirname(file) + \"/../\" + File.basename(file))endend 感谢Christopher Eppstein向我展示了它的工作原理。

CSSCompass编译和WordPress主题 为WP2原创文章,链接:https://www.wp2.cn/css/csscompass%e7%bc%96%e8%af%91%e5%92%8cwordpress%e4%b8%bb%e9%a2%98/