WordPress 7B2/B2主题完美适应接入未认证微信公众号订阅号使用微信扫码登录教程

具体可以点击本站首页登陆来体验！
本教程，支持未认证的订阅号实现关注公众号一键登录网站！当然，已认证的公众号也可以用的～

用户关注后回复“登录”二字即可获取验证码，输入验证码后登录。

那么这么做的好处有什么呢？

本站认为至少有三点好处：

1、不用认证公众号可实现微信登陆

2、提升公众号粉丝量，尤其是做通过网站引流到公众号的站长

3、方便用户登录，现在不使用微信的人特别少

一、配置公众号及插件教程

第一步：下载插件
插件完全免费：https://github.com/erphp/erphp-weixin-scan

下载之后上传到你的网站，并且启用！

第二步：配置插件及公众号
首先，你需要在公众号里进行一些配置。在公众号的开发-基本配置中，配置IP白名单（服务器IP），并且开启服务器配置。

服务器地址（插件设置页面有）、令牌（自行设置，确保两边填写一致）在启用插件后的插件设置里有，消息加解密方式选明文。

确保公众号服务启用并且配置成功。如果你已经填写了所有信息但公众号配置仍然不成功，可能是因为你的域名被微信拦截了。
下载之后上传到你的网站，并且启用！

第二步：配置插件及公众号
首先，你需要在公众号里进行一些配置。在公众号的开发-基本配置中，配置IP白名单（服务器IP），并且开启服务器配置。

服务器地址（插件设置页面有）、令牌（自行设置，确保两边填写一致）在启用插件后的插件设置里有，消息加解密方式选明文。

确保公众号服务启用并且配置成功。如果你已经填写了所有信息但公众号配置仍然不成功，可能是因为你的域名被微信拦截了。

记得一定要启用服务器配置！血泪史教训

# 后台插件设置样式

第三步：新建页面

[/erphp_weixin_scan/]
使用的时候去掉里面的" / "

如图：

发布页面之后，打开无痕窗口，打开链接就能看到，如下图，这时候你是可以获取验证码正常登录了的

以上就是微信订阅号登录的插件的使用方法了，大家可以快去试试看！

二、整合适配至7B2/B2主题登录教程

第一步：把下面的代码加在这个地方

B2主题设置 → 常规设置 → 综合设置 - 底部HTML标签[content_hide]

<!-- 微信订阅号登录 --//开始-->
<script>
    function wxlogin(){
        var wx = document.getElementById("wxlogin")
        var wx1 = document.getElementById("wxlogin1")
        if(wx.style.display == "none"){
            wx.style.display = "block"
            wx1.style.display = "none"
            
        }else{
            wx.style.display = "none"
            wx1.style.display = "block"
        }
    }
    </script>
<!-- 微信订阅号登录 --//结束-->

效果：

第二步：修改文件

b2/Modules/Templates/VueTemplates.php

查找代码：

<div class="login-box-in" v-show="!(invitation != 0 && (loginType == 2 && !invitationPass))">

替换成以下代码：

<div id="wxlogin1" class="login-box-in" v-show="!(invitation != 0 && (loginType == 2 && !invitationPass))">

效果：
把下面的代码加入到218行左右，代码里面的公众号照片要求400*400大小，不然显示不正常

         <div id="wxlogin" class="entry-content" style ="display:none;margin-top:10px;">
		<style>
        .erphp-weixin-scan{margin:0 auto;position:relative;max-width: 300px;}
        .erphp-weixin-scan .ews-title{text-align:center;font-size:18px;}
        .erphp-weixin-scan img{max-width: 100%;height: auto;}
        .erphp-weixin-scan .ews-box{text-align: center;}
        .erphp-weixin-scan .ews-box .ews-input{border:1px solid #eee;border-radius:3px;padding:6px 12px;width:150px;height: 35px;box-sizing: border-box;}
        .erphp-weixin-scan .ews-box .ews-button{background: #07C160;border:none;padding:7px 12px;color:#fff;border-radius: 3px;font-size:14px;cursor: pointer;height: 35px;box-sizing: border-box;}
        .erphp-weixin-scan .ews-tips{text-align:center;font-size:13px;color:#999;margin-top:10px;}
        </style>
        <div class="erphp-weixin-scan">
            <div class="ews-title">微信扫一扫关注</div>
            <img src="https://9ee-net.oss-cn-guangzhou.aliyuncs.com/2025/09/20250903091956869318.jpg" title="微信登陆插图" alt="微信登陆插图">
            <div class="ews-box">
                <input type="text" id="ews_code" class="ews-input" placeholder="验证码">
                <button type="button" class="ews-button">验证登录</button>
            </div>
            <div class="ews-tips">
            如已关注，请回复“登录”二字获取验证码
            </div>
        </div>
	</div>

效果：

然后往下，在244行左右，插入如下代码：

                                <a class="button222" onclick = "wxlogin()" style="cursor:pointer;  color: rgb(123, 179, 46);background: rgba(0, 132, 255, 0.05);font-size: 12px;border-radius: 3px;border: 0;display: flex;align-items: center; height: 30px;line-height: 30px; padding: 0 10px;">
                                <i class="b2font b2-weixin b2-weixin" style = "font-size: 14px; margin-right: 4px;"></i><span>微信</span></a>

[/content_hide]

上面的这些代码加好了就保存一下，差不多完成了。

第四步：打开主题里面的Cookie模式就大功告成了！

开启保存....完成！我们来看看效果：