我有一个即将到来的项目，涉及创建一个 WordPress 主题，该主题将能够通过细微的样式更改来重用。
例如，我应该能够使用 ACF 十六进制颜色选择器选择主题的主要颜色和次要颜色，然后将其反射(reflect)在前端以更新网站的外观。
我目前使用 SASS/Gulp 在本地进行样式更改。
我考虑过使用 Javascript 来识别 body 标记上设置的数据属性，该属性将使用 CMS 中设置的字段进行填充 - 但我无法想象这对页面速度等会有很大帮助，因为它会是这样更改页面加载时元素的颜色...
任何想法将不胜感激，我愿意接受所有建议!
提前致谢:)
最佳答案
使用 SCSS 变量并不容易，因为它们会在编译时被替换为实际值。在编译之前，您必须使用 PHP 生成 SCSS 样式表。
您可以在 <style> 中定义 CSS 自定义属性。使用 PHP 打印的标签。
<?php $primaryColor = 'red'; ?>
<?php $secondaryColor = 'blue'; ?>
<style>
--primary-color: <?php echo $primaryColor; ?>;
--secondary-color: <?php echo $secondaryColor; ?>;
</style>
然后您可以在其他 CSS 中使用自定义属性。
.container {
background-color: var(--primary-color);
color: var(--secondary-color);
}
了解有关自定义 CSS 属性的更多信息:https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties
关于javascript - 是否可以使用 Wordpress CMS 更改 SCSS 变量？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/59898505/