自动检测 
默认情况下，FastComments 会根据颜色圈中的"与黑色的距离"自动检测您的网站是否具有深色背景。
我们的产品会尽最大努力做到这一点，但是颜色轮中有几乎无限的颜色，可能存在应用程序在不适当时选择使用深色模式的情况，反之亦然。本文档介绍如何对此进行更精细的控制。
技术细节
我们通过从评论小部件向上遍历页面中的元素来检测深色模式，在小部件初始加载时查找深色背景。
要在此步骤后切换深色模式，您必须调用小部件以更新其配置。这在手动配置部分中有介绍。
手动配置
开发者 - 强制关闭深色模式
可以通过在小部件配置中将 hasDarkBackground 传递为 false 来强制关闭深色模式。这适用于 VanillaJS、Angular、React、Vue 和 React Native 库。
每个库在 GitHub 上都有一个 examples 文件夹，其中包含如何使用深色模式的示例。
强制开启深色模式
我们可以通过将 hasDarkBackground 设置为 true 来强制深色模式始终开启。
我们也可以通过这里的小部件自定义界面来完成此操作。
在 Base Theme 下，只需选择 Force Dark Mode。
VanillaJS 小部件 - 更新深色模式
更新深色模式最简单的方法是遍历页面上小部件的所有实例并更新其配置：
VanillaJS - Dark Mode Toggle
Copy 
1
2 let isDarkMode = somehowDetermineIfDarkModeEnabled();
3 for (const instanceWrapped of window.fcUIInstances) {
4 if (instanceWrapped.targetElement) {
5 const config = instanceWrapped.config;
6 config.hasDarkBackground = isDarkMode;
7 instanceWrapped.instance.update(config)
8 }
9 }
10
WordPress Networker 主题的深色模式支持
对于 WordPress Networker 主题，我们需要向 WordPress 安装添加自定义代码，以自动检测深色模式并更新评论小部件。
代码必须插入到您网站的页脚中。有很多插件可以做到这一点，所以我们不在这里列出。但是，这里是要添加的代码：
Networker Theme Dark Mode Support Script
Copy
1
2(function () {
3 let isDarkMode = false;
4
5 function setIsDarkMode(newValue) {
6 isDarkMode = newValue;
7 for (const instance of window.fcUIInstances) {
8 if (instance.targetElement) {
9 const config = instance.config;
10 config.hasDarkBackground = isDarkMode;
11 instance.instance.update(config)
12 }
13 }
14 }
15
16 function getDarkModeSetting() {
17 return document.body.attributes['data-scheme'].value === 'dark';
18 }
19 let initialValue = getDarkModeSetting();
20 if (isDarkMode !== initialValue) {
21 setIsDarkMode(initialValue);
22 }
23 const observer = new MutationObserver(function (mutations) {
24 mutations.forEach(function (mutation) {
25 if (mutation.type === "attributes") {
26 const newValue = getDarkModeSetting();
27 if (isDarkMode !== newValue) {
28 setIsDarkMode(newValue);
29 }
30 return false;
31 }
32 });
33 });
34
35 observer.observe(document.body, {
36 attributes: true
37 });
38})();
39