当你浏览众多网站的时候,或许你会发现,有的网站点击“登陆”按钮后,并非跳转到单独的页面,而是在本页面弹出一个登录窗口,输入 账户、密码后即可完成登陆,你是不是非常喜欢这样的登陆方式呢?我个人非常喜欢,本打算自己折腾一个,可是从出手开始就困难重重,没办法,利用强大的百度,找到了 露兜 于是按照步骤一步步操作后,终于实现了弹窗登陆,但是界面不怎么喜欢,稍微修改下,马上就在我当前主题上上线了!

下面来说一下是如何实现的

首先,你需要下载lightbox文件,点击下载 15kb

下载完毕后,解压将得到一个文件夹“lightbox" ,将其复制到当前你所以使用的主题目录下。接着用文本编辑器打开 lightbox 目录下的 login.php,将下图标注的内容改动下:

1、对你的主题做一些更改

修改主题中的footer.php,将 </body> 替换成:

<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/lightbox/lightbox.css" type="text/css" /> <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/lightbox/prototype.js"></script> <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/lightbox/lightbox.js"></script> </body>

编辑主题目录下的functions.php(没有就新建一个),在“ ?>”上方添加如下代码:

// 说明:获取当前网页的完整URL function curPageURL(){ $pageURL = 'http'; if ($_SERVER["HTTPS"] == "on"){$pageURL .= "s";} $pageURL .= "://"; if ($_SERVER["SERVER_PORT"] != "80"){$pageURL .= $_SERVER["SERVER_NAME"] . ":" . $_SERVER["SERVER_PORT"] . $_SERVER["REQUEST_URI"];} else{$pageURL .= $_SERVER["SERVER_NAME"] . $_SERVER["REQUEST_URI"];} return $pageURL;} ?>

2、在你的主题文件中添加登录链接 如果你想在主题前台显示登陆连接,可以在合适位置添加以下代码,我是将链接放在网页的页脚:

<?php if ( !$user_ID ) { ?> <a href="<?php echo get_option('siteurl'); ?>/wp-content/themes/<?php echo get_option('template'); ?>/lightbox/login.php?redirect=<?php echo curPageURL(); ?>" class="lbOn">登录</a> <?php } else { ?> <?php wp_loginout( $_SERVER["REQUEST_URI"]); ?> | <a href="wp-admin/">管理</a> <?php } ?>

并且,实现了未登录显示“登陆”链接,登陆后显示“管理、登出”示例:

 3、效果演示:

 

标签: WordPress

已有 49 条评论

  1. 没有开启注册功能博客,这个可能用不上.

    1. Tokin Tokin

      自己用的,可以不用跳转网页登录了

  2. 主题自带的说

    1. Tokin Tokin

      什么主题,如此强大

      1. 知更鸟 :grin:

  3. 对个人博客没啥意义

    1. Tokin Tokin

      本来我是不打算折腾这个的,这个是给朋友折腾的,顺手也给自己折腾上了,反正也不怎么麻烦,嘿嘿

  4. 记得鸟哥的主题的那个小巧些
    ps:你这个似乎没有关闭弹窗的按钮,需要刷新页面才能返回

    1. Tokin Tokin

      我这个还是有关闭的,就是如果顶部logo如果加载不出来,“关闭”就会向上缩,导致看不到。。。。

  5. 还是很不错的,就是你的微博连接貌似挂了

    1. Tokin Tokin

      我的微博链接修改了,忘记在后台里改了

  6. 知更鸟自带,我不用折腾了 :mrgreen:

    1. Tokin Tokin

      我去修改下样式去

  7. wwk wwk

    的确,对个人博客用处不大。。 如果是互动性博客就好了

    1. Tokin Tokin

      我是自慰用的,哈哈

    2. wwk wwk

      你胃口真大 :roll:

  8. 比较喜欢原来的跳转

    1. Tokin Tokin

      都差不多啦。朋友让我给他折腾,我百度了下代码,我顺手给自己折腾上了,哈哈

  9. 基本上个人博客基本上不在首页基本上不放置登陆框呢@!

    1. Tokin Tokin

      你的好多“基本上”我楞是没怎么读懂这句子…

  10. 貌似博主主机速度还可以,冒昧地问一下是哪家的呢!

    1. Tokin Tokin

      和朋友一起租的VPS,洛杉矶的机房,官方是,你可以去看看www.hardbirch.com

  11. 小人家又在折腾高级功能呢

    1. Tokin Tokin

      什么功能,透露一下呗
      有没有发现我的相关文章推荐很不错,免插件的哦

      1. 我是说你在整高级功能呢,我可没这能耐。这个相关文章很像无觅的唉~~

        1. Tokin Tokin

          嘿嘿,仿无觅的效果很棒的说呢,折腾了一天,问题就出在怎么解决抓文章第一张图上面了,总是抓不到,而且总有点错位,没想到双子座也是追求完美的人,不过总算折腾成功了,幸福啊~

          1. 我用的主题自带相关文章,我都给关了,嫌这玩意儿太过花哨

            1. Tokin Tokin

              文章多起来的话,还是带上吧,兴许能增加点流量,给陈年旧章一个展现的机会

              1. 嗯,那等文章多一些的时候再加上吧。不知道百度联盟的代码可不可以放到别的域名中使用。

        2. Tokin Tokin

          貌似挂了,也不给收入

  12. 貌似是帮我折腾的……
    既然有方法了回头我试试!
    估计后面有10来天无法正常上网了

    1. Tokin Tokin

      不要用貌似,就是给你折腾的,我又改了下,你看看我的效果。
      对了,下周我怎么把钱给你呢…

  13. 登陆框放侧边栏的路过

    1. Tokin Tokin

      本来我也打算放侧边栏的,不过感觉有点占位置,所以就没放

  14. 这个应该适合多人博客上,比较好玩。

    1. Tokin Tokin

      找几个朋友一起写博客不错,就是没人一起…

  15. 这个功能还是蛮不错的,毕竟花费了博主的一番心血啊

  16. 本页说出登录框,唉,你做好了,放一个登录按钮出来,我点了看看效果。 :mrgreen:

    1. Tokin Tokin

      效果如何,实在不行我给撤掉。。。。还是有点不舍得

      1. 从截图看,还不错,留着吧

  17. 对了,你的这个主题和我以前的一次主题好像啊,只是颜色不同啊

    1. Tokin Tokin

      宽度神的的我也有加,功能我都增强了,很多细节

  18. 收藏了,现在实验站上测试一把

    1. Tokin Tokin

      要改的地方还是有的,文章发布后我又改了一下,效果比这个好多了,不过后来因为css和我主题部分功能有点冲突,所以我干脆就去掉了…

  19. [...] 文章出处:实用又好用,WordPress弹出登陆窗口登陆 [...]

  20. doubi doubi

    作者,我想问一下能否分享一下你的这个评论框?

    1. Tokin Tokin

      评论框?CSS你不会参考么

  21. 就是为啥要放个介个呢??redirect=, 木有懂~

    1. Tokin Tokin

      可能当初我懒得去多进入一个页面吧,现在觉得这东西确实对于一个博客来说,用处一丁点都没有

添加新评论