那么我们本日要谈论的是在我们首页添加我们的客服以及微信"大众号,方便用户可以快速加入到我们的群组中去,我们把这个功能放在首页右上角去,有的朋友可能会问,之前这里不是分类菜单?嗯嗯,是的,由于考虑到这里的分类和下方的分类重复了,以是决定这里放置一个客服和群组的信息。
整体效果如下

这里涉及的代码不是很多,不过由于菜单这里我们上一节是固定写好的,不是很方便我们调节,那么我本日把他放到数据库里面去,数据库的SQL语句如下

SET NAMES utf8;

muiphp开发方案快速打造一个的淘宝客平台在首页添加客服和Q群以及微信群菜单 Python

SET FOREIGN_KEY_CHECKS = 0;

-- ----------------------------

-- Table structure for `yeehot_tbk_group`

-- ----------------------------

DROP TABLE IF EXISTS `yeehot_tbk_group`;

CREATE TABLE `yeehot_tbk_group` (

`id` int(10) unsigned NOT NULL AUTO_INCREMENT,

`title` varchar(255) NOT NULL,

`img` varchar(255) NOT NULL,

PRIMARY KEY (`id`)

) ENGINE=InnoDB AUTO_INCREMENT=6 DEFAULT CHARSET=utf8;

-- ----------------------------

-- Records of `yeehot_tbk_group`

-- ----------------------------

BEGIN;

INSERT INTO `yeehot_tbk_group` VALUES ('1', '官方客服:414993367', 'img/qrcode_yeehot.jpg'), ('2', '官方网站:一点热', 'img/qrcode_yeehot.jpg'), ('3', '微信公众年夜众号:科技', 'img/qrcode_yeehot.jpg'), ('4', '淘宝客1群:XXXXX', ''), ('5', '淘宝客2群:xxxx', '');

COMMIT;

SET FOREIGN_KEY_CHECKS = 1;

负责阅读的可能会创造里面有一个图片的属性,没错,这个是我测试的时候以为可能有人认为用二维码呈现会会更好,这个就看个人喜好了,由于文章不能揭橥带二维码的,以是就不在这里展示了。
不过还真的是霸占太多的屏幕了,这里实现的代码我就不写出来了。

有了数据库数据后,我们就可以添加我们的弹出按钮了。

我们配置弹出按钮的CSS

<style type=\"大众text/css\"大众>

#topPopover{

position:fixed;

top:15px;

right:6px;

}

#topPopover.mui-popover-arrow{

left:auto;

right:6px;

}

.mui-popover{

height:250px;

}</style>

然后,在body里面添加我们的弹出的层,同时也把数据读取出来

<!--右上角弹出菜单-->

<div id=\"大众topPopover\公众 class=\"大众mui-popover\"大众>

<div class=\公众mui-popover-arrow\"大众></div>

<div class=\"大众mui-scroll-wrapper\公众>

<div class=\"大众mui-scroll\"大众>

<ul class=\公众mui-table-view\"大众>

<?php

$res1 = mysql_query(\"大众select from yeehot_tbk_group order by id limit 10\"大众);

while ($row1 = mysql_fetch_array($res1)) {

echo\"大众 <li class='3a7af4cfb4c8ecb5 mui-table-view-cell' >\公众;

echo $row1['title'];

echo\"大众 </li>\"大众;

}

?>

</ul>

</div>

</div>

</div>

末了,我们在右上角按钮点击触发这个弹出窗口

<header class=\"大众mui-bar mui-bar-nav\"大众>

<label class=\"大众mui-btn mui-btn-royal mui-btn-link mui-btn-info\公众>一点热</label>

<div class=\"大众mui-title\"大众>

<input type=\"大众search\公众 class=\"大众mui-input-clear\"大众 placeholder=\公众查询商品\"大众>

</div>

<a id=\公众menu\公众 class=\公众mui-action-menu mui-icon mui-icon-personadd mui-pull-right\"大众 href=\"大众#topPopover\公众></a>

</header>

这样,我们就实现了我们的客服展示的功能了,我也把最新的功能放上网站供大家测试了,测试地址

http://yeehot.com/DaoGou/index.php

那么本日讲到这里,欢迎连续关注我的头条号:一点热,如果有什么问题,欢迎留言咨询,我看到之后会第一韶光回答大家的。
也欢迎收藏与转发,如果须要转载到其他网站,请与我联系,yeehot.com,如果有什么见地或者想法欢迎不才方留言