wordpress简单一步实现网站全局变灰教程(悼念模式)

一般在全国哀悼日或者某些纪念日的时候，身为站长的我们都会让自己的网站的全部网页变成灰色（黑白色），以表示我们对逝者的悼念。那么今天就说说，通过几行简单的代码，来实现wordpress网站首页或全局变灰教程这个功能。因为本站使用的是子比主题，所以简单一步实现，如您的主题也有自定义CSS样式也可用同样的代码实现网站首页或全局变灰（黑白色）。

网站全局变灰代码如下：

html{
    -webkit-filter: grayscale(100%);
            filter: grayscale(100%);
}

如果需要仅首页变灰，那就用以下代码：

html body.home{
    -webkit-filter: grayscale(100%);
            filter: grayscale(100%);
}

除上述方法，还有wordpress 如何让网站变成灰色代码实现如下：

第一种：添加代码到style.css文件

在 wordpress 主题的目录中找到 style.css 文件，把下面的代码添加到最底部即可。

html {
    -webkit-filter: grayscale(1);
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    -webkit-filter: gray;
    filter: gray;
    filter: progid: DXImageTransform.Microsoft.BasicImage(grayscale=1);
}

第二种：仅让首页变灰
我们可以留意到如京东、淘宝等一些 APP、网页，会让首页变灰，内页仍保留颜色。
在 WordPress 里我们如何实现这样的效果呢？
把下面的代码，添加到 functions.php 文件最底部即可。
如果你使用的是zibll出品的 wordpress 主题，则需要把代码添加到 functions_xxx.php 名称的文件中，比如子比主题，则添加到名称为 functions.php 文件中。

function nicetheme_global_greyscale() {
    if ( is_home() ){
        echo '<style type="text/css">html{-webkit-filter:grayscale(1);-webkit-filter:grayscale(100%);filter:grayscale(100%);-webkit-filter:gray;filter:gray;filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}</style>';
    }
}
add_action('wp_head', 'nicetheme_global_greyscale');

END!