专注于
网络资源搜集分享
首页 » WordPress » 纯代码实现WordPress设置密码访问【唯爱美化】
2017-05-09

纯代码实现WordPress设置密码访问【唯爱美化】

文章作者:唯爱网络
手机扫码查看

提示:本文最后更新于2017年5月9日,已超过半年没有更新,涉及的内容可能已经失效!美化所需附件提取密码回复后可见抱歉,隐藏内容 回复 后刷新可见 教程开始 1.首先载入美化的css 以本站dux为例,可以直接在后台>自定义代码添加c...

纯代码实现WordPress设置密码访问【唯爱美化】

提示:本文最后更新于2017年5月9日,已超过半年没有更新,涉及的内容可能已经失效!

美化所需附件提取密码回复后可见抱歉,隐藏内容 回复 后刷新可见

内容隐藏,请输入提取密码:

教程开始

1.首先载入美化的css

以本站dux为例,可以直接在后台>自定义代码添加css,其他模板可以自行添加模板文件里的style.css或是其他文件里,代码如下
提示框代码:

 /**tishikuang**/
#sc_notice{color:#7da33c;background:#ecf2d6 url(../img/sc_notice.png) -1px -1px no-repeat;border:1px solid #aac66d;overflow:hidden;margin:10px 0;padding:15px 15px 15px 35px}
#sc_warn{color:#ad9948;background:#fff4b9 url(../img/sc_warn.png) -1px -1px no-repeat;border:1px solid #eac946;overflow:hidden;margin:10px 0;padding:15px 15px 15px 35px}
#sc_error{color:#c66;background:#ffecea url(../img/sc_error.png) -1px -1px no-repeat;border:1px solid #ebb1b1;overflow:hidden;margin:10px 0;padding:15px 15px 15px 35px}
#sc_tips{color:#777;background:#eaeaea url(../img/sc_tips.png) -1px -1px no-repeat;border:1px solid #ccc;overflow:hidden;margin:10px 0;padding:15px 15px 15px 35px}
#sc_blue{color:#4d99d2;background:#dbe7f8 url(../img/sc_blue.png) -1px -1px no-repeat;border:1px solid #4d99d2;overflow:hidden;margin:10px 0;padding:15px 15px 15px 35px}.sc_act{margin:10px 0;padding:10px 15px;background:#FFF;border:1px solid #e3e3e3;border-left:3px solid #3dabce}.sc_act:hover{background:#fcfcfc}
.tm-btn,
.button,
input[type="submit"]{color: #fff; background: #fd6639;color : #fff; background-image: none; background-color: #fd6639; color : #fff;padding: 0 25px; font-weight: bold; cursor: pointer; border: none; height: 36px; line-height: 36px; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; -o-border-radius: 2px; border-radius: 2px; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; -o-transition: all 0.2s ease-in-out 0s; -ms-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; display: inline-block; margin: 5px;}
.tm-btn.small,
.button.small,
input[type="submit"].small{padding: 5px 10px; height: auto; line-height: 1.8;color: #fff;}

.tm-btn.green,
.button.green,
input[type="submit"].green{background: #7cc576;color : #fff;}

以上提供的是本站的一套美化方案,如果你有更好的,可以自己修改,上面的css也不仅仅有单单一个功能,可用于其他

2.打开主题目录的functions.php文件添加以下代码
 //部分内容输入密码可见
function e_secret($atts, $content=null){
extract(shortcode_atts(array('key'=>null), $atts));
if(isset($_POST['e_secret_key']) && $_POST['e_secret_key']==$key){
return '<div class="e-secret" id="sc_notice"><strong><span style="color: #ff6600;">隐藏内容:</span></strong><br> '.$content.'</div>';
}
else{
return '<div id="sc_warn"><form class="e-secret" action="'.get_permalink().'" method="post" name="e-secret">
<strong><span style="color: #ff6600;">此部分内容加密,请输入密码查看</span></strong><br><label>密码:</label><input type="password" name="e_secret_key" class="euc-y-i" maxlength="60">
<input type="submit" class="tm-bin green small" value="提取"><div class="euc-clear"></div> </form></div>';
}
}
add_shortcode('secret','e_secret');
3.文章编辑时引用
【secret key="密码"】隐藏内容【/secret】
将所有【 】换成[ ]

文章如无特别注明均为原创! 作者:唯爱网络, 转载或复制请以 超链接形式 并注明出处 唯爱资源网
原文地址《纯代码实现WordPress设置密码访问【唯爱美化】》发布于2017-05-09

分享到:
0 打赏

评论 22

9 + 6 =
  1. #1

    测试

    admin1年前 (2017-05-09)回复
  2. #2

    测试测试测试

    测试1年前 (2017-06-06)回复
  3. #3

    测试测试测试测试测试测试测试测试测试

    测试测试测试1年前 (2017-07-24)回复
  4. #4

    测试测试测试测试测试测试测试

    未开1年前 (2017-07-25)回复
  5. #5

    ok。。。好

    啦啦啦啦11个月前 (08-12)回复
  6. #6

    赞赞赞赞赞

    qqaa652d0b3610个月前 (09-28)回复
  7. #7

    测试测试

    测试8个月前 (11-13)回复
  8. #8

    测试

    你册灰姑娘7个月前 (01-03)回复
  9. #9

    十字路过

    十字6个月前 (02-01)回复
  10. #10
    qq_avatar

    喜欢 看看

    IIS 74个月前 (03-16)回复
  11. #11

    的看你那你想几点号店

    4个月前 (04-05)回复
  12. #12

    测试测试测试

    帅气滴补丁3个月前 (04-08)回复
  13. #13
    qq_avatar

    过来看看

    Fool_Y. Z.J.3个月前 (04-20)回复
  14. #14

    过来看看的看你那你想几点号店

    狮子3个月前 (04-28)回复
  15. #15
    qq_avatar

    测试

    Z J M2个月前 (05-11)回复
  16. #16
    qq_avatar

    测试

    ζ●╪謎夨﹑|2个月前 (05-16)回复
  17. #17
    qq_avatar

    来看看

    583555842个月前 (06-03)回复
  18. #18
    qq_avatar

    有什么东西在隐藏

    583558842个月前 (06-03)回复
  19. #19
    qq_avatar

    测试测试

    念你成疾1个月前 (06-09)回复
  20. #20
    qq_avatar

    试测试测试测试测试测试测试

    xihaha3周前 (06-30)回复
  21. #21
    qq_avatar

    测试下

    优雅♂情兽2周前 (07-05)回复
  22. #22
    qq_avatar

    厕所英雄

    小白机器人6天前回复
切换注册

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

Q Q 登 录
微 博 登 录
切换登录

注册