wordpress 所搭建网站,如何让网站变成灰色

一般在全国哀悼日或者某些纪念日的时候,身为站长我们会让自己的网站全部网页变成灰色,以表示我们对逝者的悼念。那么今天就说说,通过几行简单的代码,来实现这个功能。

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 文件最底部即可。

当然现在很多主题已经自带一键变灰功能,那么可以放弃修改其他内容,直接一键实现变灰,有个别 wordpress 主题,则需要把代码添加到 functions_xxx.php 名称的文件中。

function name_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', 'name_global_greyscale');

通过以上内容我们已经明白wordpress 所搭建网站变成灰色如何实现,使用过程中如遇到问题,欢迎记录下你的问题,我们一起探讨。

声明:本站为个人非盈利网站多数图片来自于正版授权,少部分转载自网络,原创内容版权归本站所有,转载内容归原作者所有。如有内容、图片、信息侵犯到您的合法权益,请联系我(i@olean.net)做删除处理。
教程

Windows系统计算机如何查看已连接的无线网络密码

2022-11-25 6:00:44

教程

iSlide - 写好年终PPT,助力升职加薪

2023-5-30 8:00:50

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧