苏醒 苏醒
  • 首页
  • WP主题
  • WP插件
  • WP教程
  • 是日一记
  • 博客
    • 留言
    • 唠叨
    • 盆友圈
    • 栏目推荐

suxing

管理员
每天清晨有多少双眼睛睁开,有多少人的意识苏醒过来,便有多少个世界。
IP归属地: 广东
文章
214
评论
236
suxing
2021-12-14 13:16:58 广东

wordpress 如何让网站变成灰色

文章字数:868
阅读时间: 3 分钟
智能摘要 DeepSeek
本文介绍了在网站哀悼日或纪念日时,通过添加CSS代码实现网页变灰的方法。第一种方式是将代码添加到`style.css`文件中,使全站变灰;第二种方式是将代码添加到`functions.php`文件中,仅让首页变灰,内页保持原色。适用于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 文件最底部即可。

如果你使用的是 nicetheme 出品的 wordpress 主题,则需要把代码添加到 functions_xxx.php 名称的文件中,比如 cosy 主题,则添加到名称为 functions_cosy.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');
  • 博客
等 人表示很赞
3,508
0

评论

空空如也
suxing
suxing
2021-11-01 18:27:16 广东

推荐 解决wordpress图像后期处理失败,推荐的最大尺寸为2500像素的问题

智能摘要 DeepSeek 用户上传图片时出现“图像后期处理失败”错误,可能原因包括:PHP版本低于7.0、上传文件大小限制过小、未加载imagick模块、文 ...
  • 博客
5,150 0
suxing
suxing
2014-04-21 13:03:27 广东

推荐 互联网时代如何让“内容为王”

智能摘要 DeepSeek 2014中国内容营销盛典聚焦互联网时代内容营销趋势,探讨“内容为王”的新策略。联想、凤凰网、Cheil杰尔广告等机构与嘉宾强调跨界思维、整合平台、品牌内容匹配度的重要性。爱奇艺、金立、乐视网等企业分享多屏时代 ...
  • 博客
5,910 1
suxing
suxing
2018-11-20 15:31:11 广东

推荐 宝塔专业版到期后,切换到免费版的降级办法

智能摘要 DeepSeek 用户在宝塔面板更换服务器后,发现专业版已过期,因费用高昂且A服务器为临时服务器,选择降级至免费版。通过在宝塔论坛找到的脚本方法,成功降级,输入字母y后顺利完成更新。 前段时间有个小鸡鸡绑定了一个专业版的宝塔 ...
  • 博客
4,243 0
suxing
suxing
2022-10-11 10:11:44 广东

推荐 Taro小程序项目编译警告chunk common [mini-css-extract-plugin]

智能摘要 DeepSeek 编译警告提示不同文件中引入的CSS顺序不一致,导致冲突。可通过在`config/index.js`中添加`miniCssExtra ...
  • 博客
8,543 1
suxing
suxing
2014-09-28 2:56:41 广东

推荐 那段时光,永远忘不了

智能摘要 DeepSeek 这段文字描绘了一段充满轻松与自由的感受,没有压力和目标,仿佛在无拘无束的时光中,与他人共享快乐。图片中的浪漫场景与文字中的自由心境相映成趣,展现了对那段时光的怀念与珍惜。   有段时光,永远忘不了 ...
  • 博客
11,235 2

我用的 WordPress 主题

2021 年单栏 WordPress 主题

Copyright © 2012-2026 苏醒. All rights reserved. Designed by nicetheme.
  • 首页
  • 主题
  • 教程
  • 博客
  • 唠叨
  • 留言