尺有所短,寸有所长
物有所不足,智有所不明

WordPress建站教程支付类插件-ErphpDown

一、起因

DUX 主题 2.0 版本之后新增了 erphpdown 登录时使用dux弹出登录框的功能,然而会员中心一直是老样式,并未集成 Erphpdown 的前端功能。同时,虽然 Erphpdown 插件作者提供了一个前端会员中心的页面(page-erphpdown-user.php),这个页面比较粗糙,而且同一个网站使用两个不同的用户中心,对访问者来说似乎也不太友好。于是自己决定将 DUX主题用户中心与 Erphpdown 集成起来,方便博客用户使用,下面是集成前后的前端样式,我将相关功能合并到了不同的选项卡,避免前端臃肿。

集成后前端显示大概就是如上图样子,有喜欢的继续看下面(当然,样式的话自己调整也是可以的)。温馨提示:主题修改前请做好备份!备份!!备份!!!
此次集成 Erphpdown 主要用了插件的短代码功能,插件新增短代码的相关的代码在 includes 文件夹下的 shortcode.php 文件中,主要是以下内容(已经存在,不需要添加,只是看一下):
add_shortcode( 'ice_purchased_goods','purchased_goods_lists');//已购商品
add_shortcode( 'ice_purchased_tuiguang','purchased_tuiguang_lists');//我的推广
add_shortcode( 'ice_purchased_tuiguangxiazai','purchased_tuiguangxiazai_lists');//推广下载
add_shortcode( 'ice_purchased_tuiguangvip','purchased_tuiguangvip_lists');//推广vip
add_shortcode( 'ice_order_tracking','order_tracking_lists');//订单查询
add_shortcode( 'ice_my_property', 'my_property' );//我的资产
add_shortcode( 'ice_recharge_money','recharge_money');//充值
add_shortcode( 'ice_cash_application','cash_application');//取现申请
add_shortcode( 'ice_cash_application_lists','cash_application_lists');//取现列表
add_shortcode( 'vip_tracking_lists','vip_tracking_lists');//VIP订单查询
add_shortcode( 'ice_vip_member_service','vip_member_service');//VIP会员服务
此次主题修改比较繁琐,需要动几个位置,简单说下配置的过程

user.php 文件修改

位于主题根目录下的 pages/user.php 文件是 DUX 主题的会员中心页面模板,我们只需要在该文件中大概 24 行代码处修改如下代码即可:
<li class="usermenu-posts"><a href="#posts/all">我的文章</a></li>
<li class="usermenu-comments"><a href="#comments">我的评论</a></li>
<li class="usermenu-zichan"><a href="#zichan">我的资产</a></li>
<li class="usermenu-tuiguang"><a href="#tuiguang">我的推广</a></li>
<li class="usermenu-huiyuan"><a href="#huiyuan">成为会员</a></li>
<li class="usermenu-info"><a href="#info">修改资料</a></li>
<li class="usermenu-password"><a href="#password">修改密码</a></li>

插入完成并保存上传后应该可以在会员中心显示出对应的选项卡。然后继续修改本文件,在 160行代码处,最后一个 script 标签结束位置插入如下代码:

           公众号:空名先生(fansGoogle)
此处内容已经被作者无情的隐藏,请输入验证码查看内容
验证码:
请关注“空名先生”官方公众号,回复关键字“ErphpDown”,获取验证码。 【注】手机扫描二维码快速关注“空名先生”官方公众号。
文件 js/user.js 主要是控制会员中心的一些动作的,在文件大概 204 行代码处应该可以找到 ‘post-new’: function() 这样一句代码。在该代码之前插入如下一段代码:

/** 集成Erphpdown 开始 */
'tuiguang': function(){
menuactive('tuiguang')
_main.html(
$('#temp-tuiguang').render()
)
},
'zichan': function(){
menuactive('zichan')
_main.html(
$('#temp-zichan').render()
)
},
'huiyuan': function(){
menuactive('huiyuan')
_main.html(
$('#temp-huiyuan').render()
)
},
/** 集成Erphpdown 结束 */
如此我们即能对程序的运行有个简单的了解。用户点击会员中心选项卡触发上面这段 JS 代码,代码激活“我要推广”菜单,并通过 render() 渲染生成上一步在 script 标签中的页面信息以显示出来。做到这一步基本上前端可以获取相关数据了,但是不太美观,下面我们对其进行简单美化。

user.css 文件修改

控制 DUX 主题会员中心显示样式的代码在 css/user.css 文件中,由于插件会不断更新,主题也会不断更新,为了避免日后调整修改较大,这里尽量没有修改插件下相关核心文件的样式类。当然,这也不可避免地造成了样式代码的臃肿。“鱼与熊掌不可兼得”,如果你希望能更精简代码,可自行调整代码以进一步优化。这里仅给出我完全修改完后 PC 端显示样式的代码(懒,不想再调整移动端的样式了)。代码如下:
           公众号:空名先生(fansGoogle)
此处内容已经被作者无情的隐藏,请输入验证码查看内容
验证码:
请关注“空名先生”官方公众号,回复关键字“ErphpDown”,获取验证码。 【注】手机扫描二维码快速关注“空名先生”官方公众号。
方法大概就是这样了,有问题可在文章下方反馈。

二、可能遇到的问题

1.用户中心页面乱

当你按上面做完后,可能发现充值布局混乱一直在下方显示,很不美观,利用审核元素的方法,发现脚本加入的时候混乱了,暂时不知道原因,但是能解决:
找到erphpdown/includs/shortcode.php,找到如下代码,注释掉即可

2.集成码支付跳转失败

充值集成了码支付,但是点击跳转的时候没有反应;还是上面的文件,本来想输出日志验证调试下,没想到直接没事了,去掉log就不行了。还是在这个文件中
赞(0) 打赏
转载请注明出处:芝麻粒儿博客芝麻粒儿 » WordPress建站教程支付类插件-ErphpDown
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

 

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏