实现亮剑在线聊天插件穿透Theme Box素材发布资源下载插件里面使用在线客服加载的实现方法

admin · 发表于 2023-7-28 22:20:32

马上注册，免费下载更多dz插件网资源。

您需要登录才可以下载或查看，没有账号？立即注册

×

实现亮剑在线聊天插件穿透Theme Box素材发布资源下载插件里面使用在线客服加载的实现方法：

最终效果：http://market.dz-x.net

实现亮剑在线聊天插件穿透Theme Box素材发布资源下载插件里面使用在线客服加载的实现方法实现,亮剑,在线,在线聊天,聊天

Theme Box的素材发布资源下载插件比较封闭，要实现让亮剑在线聊天插件穿透在这个插件里面实现客服效果：

编辑：
/source/plugin/one_market/template/default/common/footer.php

也就是在 </body> 之前，
其上行添加：

<script src="source/plugin/aljhtx/static/js/jquery-2.2.3.min.js" type="text/javascript" type="text/javascript" charset="utf-8"></script>
<script>var jQuery=jQuery.noConflict();</script>
<script src="source/plugin/aljhtx/static/js/layer/layer.js?20181220" type="text/javascript" type="text/javascript" charset="utf-8"></script>
<style>
body .layui-layim-min {
border: 1px solid #D9D9D9;
}
.aljol-layui-layer-shade {
position: fixed;
_position: absolute;
pointer-events: auto;
-webkit-overflow-scrolling: touch;
margin: 0;
padding: 0;
top:auto;
left:auto;
bottom:0;
right:0;
background-color: #fff;
-webkit-background-clip: content;
border-radius: 2px;
box-shadow: 1px 1px 50px rgba(0,0,0,.3);
z-index: 5;
}
.layui-box, .layui-box * {
box-sizing: content-box;
}
.layui-layer-page .layui-layer-content {
position: relative;
overflow: auto;
}
.layui-layim-min .layui-layer-content {
margin: 0 5px;
padding: 5px 10px;
white-space: nowrap;
}
.layim-chat-list li, .layui-layim-min .layui-layer-content {
position: relative;
margin: 5px;
padding: 5px 30px 5px 5px;
line-height: 40px;
cursor: pointer;
border-radius: 3px;
}
.layim-chat-list li img, .layui-layim-min .layui-layer-content img {
width: 40px;
height: 40px;
border-radius: 100%;
}
.layim-chat-list li *, .layui-layim-min .layui-layer-content * {
display: inline-block;
*display: inline;
*zoom: 1;
vertical-align: top;
font-size: 14px;
}
.layui-layim-close .layui-layer-content span {
width: auto;
max-width: 120px;
}
.layim-chat-list li span, .layui-layim-min .layui-layer-content span {
width: 100px;
padding-left: 10px;
font-size: 16px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.layui-layer-setwin {
position: absolute;
right: 15px;
*right: 0;
top: 15px;
font-size: 0;
line-height: initial;
}
.ajlol-order-numbers {
display: inline-block;
text-align: center;
position: absolute;
bottom: 17px;
background-color: #f23030;
height: 17px;
padding-left: 5px;
padding-right: 5px;
line-height: 17px;
font-style: normal;
border-radius: 15px;
right: 7px;
font-size: 9px;
color: #fff;
font-family: PingFangSC-Regular,Helvetica,"Droid Sans",Arial,sans-serif;
border:1px solid #fff
}
</style>
<div class="aljol-layui-layer-shade layui-layer-page layui-box layui-layim-min layui-layim-close" id="layui-layer5" type="page" times="5" showtime="0" contype="string">
<div id="layui-layim-close" class="layui-layer-content">
<img src="avatar.php?uid=$_G['uid']&size=small" />
<span>在线聊天</span>
<div class="aljol-newscount">
</div>
</div>
<span class="layui-layer-setwin">
</span>
</div>
<script>
function open_aljol() {
layer.open({
type: 2
,offset: 'rb'
,title: '在线聊天'
,area: ['414px', '80%']
,content: 'plugin.php?id=aljol' //iframe的url
,shade: 0 //不显示遮罩
});
}
OL = {
voice_aljol: function() {
var audio = document.createElement("audio");
audio.src = 'source/plugin/aljol/static/img/aljol.mp3';
audio.play();
},
newsMes_aljol:function () {
var url='plugin.php?id=aljol&act=newsnum&ajax=1';
jQuery.post(url,function(res){
if(res!=null && res!='') {
if(res.newscount>0){
jQuery('.aljol-newscount').html('<i class="ajlol-order-numbers">'+res.newscount+'</i>');
}else{
jQuery('.aljol-newscount').html('');
}
if(res.newscnum>0){
OL.voice_aljol();
}
}
},'json');
},
init:function () {
setInterval(function(){
OL.newsMes_aljol();
},5000)
}
};
OL.init();
</script>

复制代码

手机端添加：
编辑：/source/plugin/one_market/template/touch/default/common/footer.php
也就是在 </body> 之前，
其上行

游客，如果您要查看本帖隐藏内容请回复

然后保存后，再次刷新插件页面，即可正常加载亮剑在线聊天客服插件了~

最终效果演示：http://market.dz-x.net

由此衍生：任何插件的页面都可以加载亮剑这个在线聊天客服插件，如需实现，联系右侧QQ客服协助~

该教程所涉及的插件：
[Theme Box]素材发布资源下载 OSS存储+用户组打折+下载限速 (one_market)[更新支持DZ X3.5]
https://www.dz-x.net/t/5197/1/1.html
(出处: DZ插件网)

【亮剑】在线聊天 (aljol)
https://www.dz-x.net/t/1930/1/1.html
(出处: DZ插件网)

同类教程的更多扩展功能的应用案例：
在Theme Box的素材发布资源下载插件导航里面加上多国语言切换导航按钮并实现多种展现效果的方式
https://www.dz-x.net/t/60430/1/1.html
(出处: DZ插件网)

©DZ插件网所发布的一切资源仅限用于学习和研究目的；不得将上述内容用于商业或者非法用途，否则，一切后果请用户自负。
本站内容为站长个人技术研究记录或网络，不提供用户交互功能，所有内容版权归原作者所有。您必须在下载后的24个小时之内，从您的电脑中彻底删除上述内容。如果您喜欢该程序，请支持正版软件，得到更好的正版服务。
您在本站任何的赞助购买、下载、查阅、回复等行为等均表示接受并同意签订《DZ插件网免责声明协议》。
如有侵权请邮件与我们联系处理: discuzaddons@vip.qq.com 并出示相关证明以便删除。敬请谅解！

manman · 发表于 2023-8-25 00:44:40

哈哈哈哈
哈哈哈哈哈哈哈哈哈哈哈哈

陈奈亚亚亚 · 发表于 2023-8-25 20:17:31

感谢分享

哈哈哈哈哈 · 发表于 2024-1-3 11:45:22

亮剑在线聊天插件穿透Theme Box素材发布资源下

wendao · 发表于 2024-2-5 10:56:46

太感谢了，有这样好的老师指导，我也是一下看看好不好用！

${:7_164:}$	${:7_165:}$	${:7_166:}$	${:7_167:}$	${:7_168:}$	${:7_169:}$	${:7_170:}$	${:7_171:}$
${:7_172:}$	${:7_173:}$	${:7_174:}$	${:7_175:}$	${:7_176:}$	${:7_177:}$	${:7_178:}$	${:7_179:}$
${:7_180:}$	${:7_181:}$	${:7_182:}$	${:7_183:}$	${:7_184:}$	${:7_185:}$	${:7_186:}$	${:7_187:}$
${:7_188:}$	${:7_189:}$	${:7_190:}$	${:7_191:}$	${:7_192:}$	${:7_193:}$	${:7_194:}$	${:7_195:}$
${:7_196:}$	${:7_197:}$	${:7_198:}$	${:7_199:}$	${:7_200:}$	${:7_201:}$	${:7_202:}$	${:7_203:}$

实现亮剑在线聊天插件穿透Theme Box素材发布资源下载插件里面使用在线客服加载的实现方法

马上注册，免费下载更多dz插件网资源。

相关帖子

电梯直达
评论5

回复

More猜你喜欢

最佳新人

站长推荐 1/1

More猜你喜欢

关于我们

服务支持

discuzaddons@vip.qq.com

实现亮剑在线聊天插件穿透Theme Box素材发布资源下载插件里面使用在线客服加载的实现方法

马上注册，免费下载更多dz插件网资源。

相关帖子

电梯直达 评论5

回复

More猜你喜欢

最佳新人

站长推荐 1/1

More猜你喜欢

关于我们

服务支持

discuzaddons@vip.qq.com

电梯直达
评论5