WordPress整站变灰功能实现方法

  • A+
所属分类：博客日记

我们的博客网站平时都是比较生动活泼的，颜色也比较鲜艳的，但是在一些特别悲伤的日子，或者是国难日期间，如果我们的博客网站还是那么的鲜艳就有点不好意思了，所以我们需要这样的一个功能：就是一键实现整站变灰的功能。

WordPress整站变灰功能实现方法

1、经过学习，发现其实这个功能还是挺简单的，只需要在我们主题的functions.php添加如下代码即可实现整站变灰：

  1. //网站整体变灰
  2. function hui_head_css() {
  3.     $styles = "";
  4.         $styles .= "html{overflow-y:scroll;filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter: grayscale(100%);}";
  5.     if ($styles) {
  6.         echo "<style>" . $styles . "</style>";
  7.     }
  8. }
  9. add_action("wp_head", "hui_head_css");

2、如果我们所使用的主题有主题选项设置，我们也可以根据相应的格式添加一个整站变灰的选项，如默认为关闭，选择打开后，整站就变灰了，挺方便的。

如知更鸟的HotNews主题，我们只需要在theme_options.php里面的首页设置中，放入以下代码：

  1. array(  "name" => "网站整体变灰",
  2.     "desc" => "说明：在特别的日子里，一键设置网站整体变灰，支持IE、Chrome，基本上覆盖了大部分用户。",
  3.     "id" => $shortname."_site_gray",
  4.     "type" => "checkbox",
  5.     "std" => "false",
  6.     "section" => '<div class="part"></div>'),

然后把刚才添加到functions.php文件中的函数加一个判断语句，即可在后台实现一键让整站变灰，具体代码如下：

  1. //网站整体变灰
  2. function hui_head_css() {
  3.     $styles = "";
  4.     if (get_option('swt_site_gray') == 'true') {
  5.         $styles .= "html{overflow-y:scroll;filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter: grayscale(100%);}";
  6.     }
  7.     if ($styles) {
  8.         echo "<style>" . $styles . "</style>";
  9.     }
  10. }
  11. add_action("wp_head", "hui_head_css");