知更鸟begin主题顶部添加问候语和显示时间

avatar
avatar
自然
550
文章
472
评论
2019年6月19日14:53:13 2

学习的路是永远不对走到尽头的,我们永远在路上。对于建站的摸索自然也在不断探寻,不断改进。今天给大家分享一下自然现在在用的顶部问候语和显示时间效果。

知更鸟begin主题顶部添加问候语和显示时间

顶部添加问候语和显示时间

修改的方式非常简单,只需要打开主题路径 inc/user/user-profile.php文件将下面的代码插入指定位置(如图)即可,这篇文章时根据最新版本(2019年61更新)的知更鸟begin主题写的,和老版本可能会有一定的差别。

知更鸟begin主题顶部添加问候语和显示时间

大概是在user-profile.php文件的第106行代码下面,途中的红框空了一行是自然加上去的,实际并不存在。

我们显示问候语和时间是使用javascript实现的效果,代码如下。

 <script type = "text/javascript" > today = new Date();
var day;
var date;
var hello;
hour = new Date().getHours();
if (hour < 6) {
    hello = ' 凌晨好! ';
} else if (hour < 9) {
    hello = ' 早上好!';
} else if (hour < 12) {
    hello = ' 上午好!';
} else if (hour < 14) {
    hello = ' 中午好! ';
} else if (hour < 17) {
    hello = ' 下午好! ';
} else if (hour < 19) {
    hello = ' 傍晚好!';
} else if (hour < 22) {
    hello = ' 晚上好! ';
} else {
    hello = '夜深了! ';
}
function GetCookie(sName) {
    var arr = document.cookie.match(new RegExp("(^| )" + sName + "=([^;]*)(;|$)"));
    if (arr != null) {
        return unescape(arr[2])
    };
    return null;
}
var Guest_Name = decodeURIComponent(GetCookie('author'));
var webUrl = webUrl;
if (Guest_Name != "null") {
    hello = Guest_Name + ' , ' + hello + ' 欢迎回来。';
}
document.write(' ' + hello); < /script> 
  <script type="text/javascript ">var d, s = "";
									    var x = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六");
								    d = new Date();
								    s += d.getFullYear() + "年" + (d.getMonth() + 1) + "月" + d.getDate() + "日";
								        s += x[d.getDay()];
								        document.writeln(s);</script>

小结

在我们网站的顶部添加添加一个温馨的问候语并展示当前时间是相当有必要的,原先的问候语-登陆-注册的样式显得比较生硬,一直的都是一个效果,不利于用户体验。美化的顶部让然看起来更加舒服,不仅可以提醒方可注意当前时间,还可以提升用户友好度。

weinxin
自然博客
快来关注一下,一个linux运维爱好者的个人博客!
avatar
  • 本文由 发表于 2019年6月19日14:53:13
AlphaSSL 域名通配符型DV SSL证书
全网通流量卡/物联卡 SIM专用上网卡
WP-China-Yes自建wordpress中国区仓库源 Nginx

WP-China-Yes自建wordpress中国区仓库源

WordPress的CDN在19年被国内攻击后(存疑),一直屏蔽了大陆IP的访问,从大陆访问WP的服务都会返回429 Too Many Requests。虽然WP官方社区并不承认屏蔽了大陆地区的访问(...
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

评论:2   其中:访客  0   博主  0
    • avatar 心灵博客 4

      加上天气信息吧,有接口