Eswink Eswink
  • 首页
  • 网站公告
  • 红蓝对抗
    • 攻防对抗
    • 渗透分析
  • 资源分享
    • 代码发布
    • 其他分享
  • 本站专题
    • 视频集锦
    • WordPress
    • 工程实践
    • 奇闻趣事
    • 活动线报
  • 问答
  • 绿标域名
  • 关于本站
    • 友情链接
  • 注册
    登录
现在登录。
  • 首页
  • 网站公告
  • 红蓝对抗
    • 攻防对抗
    • 渗透分析
  • 资源分享
    • 代码发布
    • 其他分享
  • 本站专题
    • 视频集锦
    • WordPress
    • 工程实践
    • 奇闻趣事
    • 活动线报
  • 问答
  • 绿标域名
  • 关于本站
    • 友情链接
首页 代码发布 一天一个WordPress小技巧:如何给自己的网站添加公告弹窗

一天一个WordPress小技巧:如何给自己的网站添加公告弹窗

小伍同学 2020-12-30 1:05:49 本文共998个字,预计阅读时间需要3分钟
1 星2 星3 星4 星5 星 (本文还未被点评)
Loading...

死亡的生命已经朽腐。我对于这朽腐有大欢喜,因为我借此知道它还非空虚。

——鲁迅

WordPress作为一个开放式的博客Application,给了开发者们很大的便利。国内的许多开发爱好者们也为WordPress的主题开发做出了很大的贡献。

例如众所周知的:nicetheme 闪电博(Wbolt)

对于我个人而言,他们开发的高质量主题是非常符合我的胃口的,同时也给了用户自由发挥写代码的空间。

今天就分享本站所使用的公告弹窗代码!

0x00 事前准备

必备插件

Elfsight Popup Plugin (Version 1.1.0)下载链接在文章的最下方

可视化的弹窗插件,自由度高,免费并且体积小,非常适合博客的使用。

一天一个WordPress小技巧:如何给自己的网站添加公告弹窗图片

点击 Create widget 即可创建弹窗公告,并且提供短代码,可以在文章或者页面上添加,也可以在小工具中添加弹窗,非常的方便!

一天一个WordPress小技巧:如何给自己的网站添加公告弹窗图片1

明确目的

用户在第一次访问网站时弹窗窗口,并且可以关闭,第二次进入不再弹窗

如何实现

设置用户cookies,通过判断目标cookies是否存在来确定用户是否是第一次访问网站

一天一个WordPress小技巧:如何给自己的网站添加公告弹窗图片2

0x01 开始操作

一天一个WordPress小技巧:如何给自己的网站添加公告弹窗图片3

Cookies

在WordPress模板的functions.php文件中添加以下代码:

function set_newuser_cookie() {
    if (!isset($_COOKIE['sitename_newvisitor'])) {
        setcookie('sitename_newvisitor', 1, time()+1209600, COOKIEPATH, COOKIE_DOMAIN, false);
    }
}
add_action( 'init', 'set_newuser_cookie');
// 上面一行代码也可以改成下面一行代码
// add_action('after_setup_theme', 'set_newuser_cookie');

setcookie后的参数可以自定义,这里为了方便就设置为1;

Display Pop-up

找到模板的header.php文件,在<body></body>之间添加以下代码:

<?php 
if (isset($_COOKIE['sitename_newvisitor'])!=1) {
echo do_shortcode( '[elfsight_popup id="##"]' );
}
?>
//将##换成你的弹窗ID

弹窗ID:

一天一个WordPress小技巧:如何给自己的网站添加公告弹窗图片4

0x02 查看效果 问题解决

打开浏览器的无恒浏览,访问网站是否弹窗:

一天一个WordPress小技巧:如何给自己的网站添加公告弹窗图片5
一天一个WordPress小技巧:如何给自己的网站添加公告弹窗图片6
Elfsight Popup Plugin 提取码:081y

#WordPress#代码#弹窗
2
小伍同学
一个即将入土的程序猿
赞赏
小伍同学
评论 (0)
返回
    发表评论
猜你喜欢
  • 巧妙应用Docker运行HuggingFace
  • 如何利用GO中的泛型实现客户端分页API
  • 通用网盘下载链接检测_Serverless云函数应用
  • SpringCloud分布式组件之玩转Nacos
  • 页面优化:使用JS脚本实现页面链接预加载
小伍同学
一个即将入土的程序猿
130
文章
60
评论
169
获赞
小伍同学
02 4月, 2022
前端学习之在游戏中提高CSS技巧
Copyright © 2020-2022 Eswink. Designed by nicetheme. 川公网安备 51012202000979号 | 蜀ICP备20002650号-6
当前线路为: 国内线路
本站已安全运行:
本站由酷盾安全提供高防CDN国际线路安全防护服务
友链: Eswink 信息笔记 网站目录 站长新动力 脚本挂机引流赚钱 勇康博客网 龙笑天下 HTTP代理 QYV企业商务咨询 镇北府博客 吾爱漏洞 祭夜の咖啡馆 杭州论坛 龙鳞收录网 KIENG博客 Hackyh‘Blog
在线客服
小伍同学
我们将会在24小时内回复您,如果有急事请联系QQ或者微信
12:01
您好,有任何疑问请与我们联系!
公众号

选择聊天工具: