已建站十年的老牌绿色软件站
不忘初心,坚持每日更新不易!

代码实现WordPress文章隐藏内容输入公众号验证码可见

纯代码WordPress文章隐藏内容输入微信公众号验证码可见的教程,WordPress网站如何开启公众号涨粉验证码查看隐藏内容功能,很简单,一串代码即可搞定,该文章内容代码只适合传统编辑器,如果使用的是古腾堡编辑的同学,需要自己手动添加代码来隐藏内容,比较的麻烦!

一、添加代码到function.php 中保存,由于网站编辑问题,将下面代码中所有的 “” 改成 “[“!

// 文章隐藏内容输入微信公众号验证码可见
function secret($atts, $content=null){
extract(shortcode_atts(array('wxgzh'=>null,'keyword'=>null,'key'=>null,'gzh_img'=>null), $atts));
if(isset($_POST['secret_key']) && $_POST['secret_key']==$key){
return '<div class="secret-password">'.$content.'</div>';
}
else {
return '
<div class="post_hide_box">
<img class="erweima" align="right" src="'.$gzh_img.'" width="160" height="160" alt="公众号二维码加载失败~~~"><div class="post-secret"><i class="fa fa-exclamation-circle"></i>抱歉!为防机器采集,此处内容已被隐藏,请输入验证码查看内容</div>
<form action="'.get_permalink().'" method="post">
<span>验证码:</span><input id="pwbox" type="password" size="20" name="secret_key">
<a class="a2" href="javascript:;"><input type="submit" value="提交" name="Submit"></a>
</form>
<div class="details">请关注“<span>'.$wxgzh.'</span>”官方公众号,回复关键字“<span>'.$keyword.'</span>”,获取验证码。<br/>
<span>【注】</span>手机扫描二维码快速关注“<span>'.$wxgzh.'</span>”官方公众号。
</div>
</div>';
}
}
add_shortcode('ghide', 'secret');

//文章编辑器添加按钮
function wpsites_add_gzh_quicktags() {
if (wp_script_is('quicktags')){
?>
<script type="text/javascript">
QTags.addButton( 'ghide', ' 隐藏内容', '\n【ghide wxgzh="亿破姐" keyword="关键字" key="888" gzh_img="https://www.ypojie.com/wp-content/uploads/2020/05/WX.jpg"]亿破姐需要隐藏的内容【/ghide]', "" );
</script>
<?php
}
}
add_action( 'admin_print_footer_scripts', 'wpsites_add_gzh_quicktags' );

2. 添加 CSS 样式代码

CSS需要添加到你当前主题文件的CSS样式文件里面,一般默认都是在 style.css 里面添加

.post_hide_box, .secret-password{
background: none repeat scroll 0 0 #fcffff;
border: 1px dashed #24b4f0;
color: #123456;
padding: 10px;
border-radius: 9px;
margin: 18px 0px;
overflow:hidden;
clear:both;
}
.post_hide_box .post-secret{
font-size: 18px;
line-height:20px; 
color:#f0503c; 
margin:5px;
}
.post_hide_box form{ margin:15px 5px;}
.post_hide_box form span{ font-size:18px; font-weight:bold;}
.post_hide_box .erweima{ margin: 15px;}
.post_hide_box input[type=password]{
color: #00a0f0;
padding: 5px;
background-color: #fff;
border: 1px solid #24b4f0;
border-radius: 5px;
font-size: 12px;
margin: 0px 5px;
-moz-transition: border .25s linear,color .25s linear,background-color .25s linear; 
-webkit-transition: border .25s linear,color .25s linear,background-color .25s linear; -o-transition: border .25s linear,color .25s linear,background-color .25s linear; 
transition: border .25s linear,color .25s linear,background-color .25s linear;}
.post_hide_box input[type=submit] { 
background: #24b4f0; 
border: none; 
padding: 5px;
width: 88px; 
color: #fff; 
border-radius: 5px; 
font-size: 16px;
font-weight:bold;
}
.details{
color:#123456;
font-size: 16px;
line-height: 30px;
margin: 5px;
padding: 3px;
}
.post_hide_box .details span{color:#e74c3c;}

在编辑文章的时候,切换到文本模式,会出现一个”隐藏内容“按钮,将双引号里的内容替换成自己的公众号信息即可!

由于网站编辑问题,将下面代码中所有的 “” 改成 “[“!

【ghide wxgzh="亿破姐" keyword="关键字" key="888" gzh_img="https://www.ypojie.com/wp-content/uploads/2020/05/WX.jpg"]亿破姐需要隐藏的内容【/ghide]

三、最后给大家暂时一下这个效果预览图

wxgzh

赞(1110)

这些信息可能会帮助到你: 下载帮助 | 报毒说明 | 进站必看 | 关于我们

版权声明:本文采用知识共享 署名4.0国际许可协议 [BY-NC-SA] 进行授权
文章名称:《代码实现WordPress文章隐藏内容输入公众号验证码可见》
文章链接:https://www.ypojie.com/10543.html
免责声明:根据《计算机软件保护条例》第十七条规定“为了学习和研究软件内含的设计思想和原理,通过安装、显示、传输或者存储软件等方式使用软件的,可以不经软件著作权人许可,不向其支付报酬。”您需知晓本站所有内容资源均来源于网络,仅供用户交流学习与研究使用,版权归属原版权方所有,版权争议与本站无关,用户本人下载后不能用作商业或非法用途,需在24个小时之内从您的电脑中彻底删除上述内容,否则后果均由用户承担责任;如果您访问和下载此文件,表示您同意只将此文件用于参考、学习而非其他用途,否则一切后果请您自行承担,如果您喜欢该程序,请支持正版软件,购买注册,得到更好的正版服务。
本站是非经营性个人站点,所有软件信息均来自网络,所有资源仅供学习参考研究目的,并不贩卖软件,不存在任何商业目的及用途,网站会员捐赠是您喜欢本站而产生的赞助支持行为,仅为维持服务器的开支与维护,全凭自愿无任何强求。