File: /www/wwwroot/www.sanjiangapp.com/template/sanjiang/livemall.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>{pboot:pagetitle}</title>
<meta name="keywords" content="{pboot:pagekeywords}">
<meta name="description" content="{pboot:pagedescription}">
<link rel="shortcut icon" href="{pboot:sitetplpath}/favicon.ico" type="image/x-icon">
<link rel="stylesheet" href="{pboot:sitetplpath}/static/css/index.css">
<link rel="stylesheet" href="{pboot:sitetplpath}/static/css/home.css">
<link rel="stylesheet" href="{pboot:sitetplpath}/static/css/sulttion.css">
<link rel="stylesheet" href="{pboot:sitetplpath}/static/css/public.css">
<style>
#communityGroup{
background:#fff;
}
.ym_nav_nav_right .ym_nav_nav_right_button2{
color: #7E31F5 !important;
}
.banner{
display: flex;
justify-content: space-between;
}
.banner-pic{
width: 354px;
height: 302px;
}
.banner-pic img{
width: 100%;
}
.banner-word-btn{
margin-top: 42px;
display: inline-block;
border-radius: 5px;
color: #879fff;
font-size: 14px;
cursor: pointer;
}
.free_btn{
background:none;
border:1px solid #fff;
color:#fff;
margin-left:8px;
}
.head{
/*padding-top: 75px;*/
/*background-position-y: 68px !important;*/
background-size: 100% 100%;
}
.groupDetail{
margin-top:30px;
display:flex;
justify-content: space-between;
}
.groupDetail>div{
width:50%;
height:455px;
text-align: center;
box-sizing: border-box;
padding-top:20px;
}
.groupDetail>div:last-child{
width:45%;
}
.groupDetail>div img{
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
}
.groupDetail .modeText{
text-align: left;
/* padding-top:60px; */
}
.modeText>div>div{
width: 256px;
height: 38px;
line-height:38px;
text-align: center;
color:#FFFFFF;
font-size:18px;
opacity: 1;
background: linear-gradient(#7a30f5 0%, #ae33f5 100%);
border-radius: 19px;
margin-top:35px;
}
.modeText>div>p{
font-size: 16px;
font-family: Microsoft YaHei, Microsoft YaHei-Regular;
font-weight: 400;
text-align: left;
color: #677086;
line-height: 24px;
margin-top:28px;
}
.sixCore{
height:674px;
width:1125px;
margin:0 auto;
box-sizing: border-box;
}
.sixCore_title{
height:156px;
position:relative;
margin-bottom:50px;
}
.sixCore_title h2{
font-size:35px;
line-height:75px;
width:100%;
text-align: center;
z-index:1;
position:absolute;
top:57px;
color: #242841;
}
.sixCore_title h3{
font-size: 37px;
line-height:37px;
color:#C4C6D4;
opacity: 0.5;
position:absolute;
width:100%;
text-align: center;
top:60px;
}
.sixCore_title .bar{
width:70px;
height:6px;
background:#FF6918;
border-radius: 3px 3px 0 0;
position:absolute;
right:526px;
top:132px;
}
.sixCore_top,.sixCore_bottom{
display: flex;
justify-content: space-between;
}
.sixCore_bottom{
margin-top:67px;
}
.core{
width:135px;
height:104px;
}
.core div{
color:#FFFEFE;
font-size: 16px;
text-align: center;
margin-top:78px;
}
.paragraph{
color:rgba(98,101,115,1);
line-height:24px;
margin-top:10px;
font-size:14px;
padding:0 43px;
box-sizing: border-box;
text-align: center;
}
.upShadow .paragraph{
color:rgba(98,101,115,1);
}
.upShadow{
transform: translateY(-40px);
box-shadow: 0 0 49px 0 rgba(147,147,147,0.2);
}
.apply{
height:510px;
width:1125px;
background:#fff;
margin:0 auto;
}
.applyTitle{
height:156px;
position:relative;
}
.applyTitle h2{
font-size:35px;
line-height:75px;
width:100%;
text-align: center;
z-index:1;
position:absolute;
top:57px;
color: #242841;
}
.applyTitle h3{
font-size: 37px;
line-height:37px;
color:#C4C6D4;
opacity: 0.2;
position:absolute;
width:100%;
text-align: center;
top:60px;
}
.applyTitle .bar{
width:70px;
height:6px;
background:#FF6918;
border-radius: 3px 3px 0 0;
position:absolute;
right:526px;
top:132px;
}
.applyPic{
margin-top:50px;
display: flex;
justify-content: space-between;
}
.applyPic .graphic{
width:264px;
height: 301px;
background:#fff;
border-radius: 10px;
text-align: center;
/* transition:all 1s; */
}
.applyPic .graphic:hover{
box-shadow: 0px 0px 20px #bab7be;
}
.graphic img{
width:108px;
height:112px;
margin-top:42px;
}
.graphic p{
margin:0 37px;
font-size:14px;
line-height:24px;
color:#677086;
text-align: center;
}
.graphic .titlep{
font-size:20px;
line-height:56px;
color:#242841;
text-align: center;
/* margin:36px 82px 0; */
}
.groupTest{
height:267px;
width:100%;
margin-top:45px;
margin-bottom: -1px;/*隐藏图片下1像素白边*/
/* position:relative; */
background:url('{pboot:sitetplpath}/static/images/bottom.png');
background-size:100% 100%;
}
.groupTest>p{
font-size:30px;
color:#fff;
padding-top:56px;
text-align: center;
}
.groupTest>div{
margin-top:32px;
text-align: center;
}
.groupTest>div>p{
display:inline-block;
font-size:15px;
color:#fff;
}
.groupTest>div>p img{
display:inline-block;
margin-right:10px;
}
.groupTest>div>p:first-child{
margin-right:80px;
}
.groupTestBtn{
color:#fff;
text-align: center;
line-height:50px;
font-size:14px;
cursor: pointer;
margin:50px auto 0;
user-select:none;
width: 160px;
height: 50px;
opacity: 1;
background: #fc692b;
border-radius: 4px;
font-weight: 700;
}
.showGroup{
height:830px;
width:1125px;
margin:0 auto;
}
.switer_group{
display: flex;
justify-content: space-between;
margin-top:30px;
}
.switer_item{
width:260px;
height:625px;
}
.switer_item img{
width:100%;
}
.switer_item p{
font-size:20px;
line-height:38px;
text-align: center;
color:#242841;
font-weight: 800;
margin-top: 30px;
}
.switer_item p:last-child{
font-size:13px;
line-height:24px;
text-align: center;
color:#677086;
margin-top:0;
font-weight: 400;
}
</style>
</head>
<body class="main">
<div id="communityGroup">
<div class="head" style="background: linear-gradient(180deg,#7a30f5 0%, #ae33f5 100%); background-color: #9232f5">
{include file=comm/head.html}
<div class="head-in">
<div class="banner">
<div class="banner-word">
<p class="banner-word-1st" style="color: #fefeff;font-size: 40px;font-weight: bold;margin-top: 50px;">三匠互联直播电商系统</p>
<p class="banner-word-2nd" style="font-weight: normal;font-size: 22px;letter-spacing: .4px">电商+直播一体化解决方案</p>
<p class="banner-word-2nd" style="font-weight: normal;font-size: 22px;letter-spacing: .4px">把握直播流量红利，助力商家流量快速变现</p>
<div class="banner-word-btn" style="color:#7E31F5;font-weight: 800;border: 1px solid #fff" onclick="wxclick()">立即咨询</div>
<div class="banner-word-btn free_btn" onclick="showClick()">获取解决方案</div>
</div>
<div class="banner-pic">
<img src="{pboot:sitetplpath}/static/picture/liveappbg.png" alt="三匠互联直播电商系统">
</div>
</div>
</div>
</div>
<div class="apply">
<div class="applyTitle">
<h2>三匠互联小程序直播电商优势</h2>
<h3>SANJIANGHULIAN</h3>
<div class="bar"></div>
</div>
<div class="applyPic">
<div class="graphic">
<img src="{pboot:sitetplpath}/static/picture/ydzb.png" alt="随时移动直播">
<p class="titlep">随时移动直播</p>
<p>官方小程序直播端，随时随地在线直播，提升用户直播体验</p>
</div>
<div class="graphic">
<img src="{pboot:sitetplpath}/static/picture/hdjlds.png" alt="互动交流抽奖">
<p class="titlep">互动交流抽奖</p>
<p>提供抽奖、点赞、聊天等在线互动</p>
</div>
<div class="graphic">
<img src="{pboot:sitetplpath}/static/picture/bkbzb.png" alt="边看边直播">
<p class="titlep">边看边直播</p>
<p>可在直播页面直接购买商品，边看边剁手模式</p>
</div>
<div class="graphic">
<img src="{pboot:sitetplpath}/static/picture/sjfx.png" alt="数据分析统计">
<p class="titlep">数据分析统计</p>
<p>多维度数据分析，定向收于用户信息提高营销转化率</p>
</div>
</div>
</div>
<div class="apply" style="height:660px;">
<div class="applyTitle">
<h2>三匠互联直播电商卖货新场景</h2>
<h3>SANJIANGHULIAN</h3>
<div class="bar"></div>
</div>
<div class="groupDetail">
<div>
<img class="modeImg" src="{pboot:sitetplpath}/static/picture/xcj.png" alt="小程序直播购物">
</div>
<div class="modeText">
<div>
<div>
小程序直播购物
</div>
<p>
系统可通过直播、视频回放两种购物模式，用户可自主选择观看直播或回放，增强互动性
</p>
</div>
<div>
<div>
直播互动
</div>
<p>
通过直播抽奖、优惠券发放、实物演示、在线答疑，增强顾客信任度，提升顾客购买转化率。
</p>
</div>
<div>
<div>
直播导购
</div>
<p>
直播推荐商品，引导观众边看边买。商品、订单、客户、资金商城后台统一管理，省时省心。
</p>
</div>
</div>
</div>
</div>
<div class="showGroup">
<div class="applyTitle">
<h2>三匠互联直播功能介绍</h2>
<h3>SANJIANGHULIAN</h3>
<div class="bar"></div>
</div>
<div class="switer_group">
<div class="switer_item">
<img src="{pboot:sitetplpath}/static/picture/djs.png" alt="直播倒计时">
<p>直播倒计时</p>
<p>主播发起直播预告<br>用户进入提示倒计时</p>
</div>
<div class="switer_item">
<img src="{pboot:sitetplpath}/static/picture/mylj.png" alt="美颜滤镜">
<p>美颜滤镜</p>
<p>调整美颜清晰度<br>让主播美美的上镜</p>
</div>
<div class="switer_item">
<img src="{pboot:sitetplpath}/static/picture/tjsp.png" alt="添加商品">
<p>添加商品</p>
<p>关联售卖商品<br>用户边看边剁手</p>
</div>
<div class="switer_item">
<img src="{pboot:sitetplpath}/static/picture/tjcj.png" alt="抽奖互动">
<p>抽奖互动</p>
<p>主播开启抽奖<br>增加直播间互动气氛</p>
</div>
</div>
</div>
<div class="sixCore">
<div class="sixCore_title">
<h2>三匠互联直播电商特色功能</h2>
<h3>SANJIANGHULIAN</h3>
<div class="bar"></div>
</div>
<div class="sixCore_top">
<div class="core" style="background:url('{pboot:sitetplpath}/static/images/glsp.png') no-repeat;">
<div>关联商品</div>
</div>
<div class="core" style="background:url('{pboot:sitetplpath}/static/images/zbfx.png') no-repeat;">
<div>直播分享</div>
</div>
<div class="core" style="background:url('{pboot:sitetplpath}/static/images/zbpl.png') no-repeat;">
<div>直播评论</div>
</div>
<div class="core" style="background:url('{pboot:sitetplpath}/static/images/zbmy.png') no-repeat;">
<div>直播美颜</div>
</div>
<div class="core" style="background:url('{pboot:sitetplpath}/static/images/jjsp.png') no-repeat;">
<div>讲解商品</div>
</div>
<div class="core" style="background:url('{pboot:sitetplpath}/static/images/zbmk.png') no-repeat;">
<div>录制讲解</div>
</div>
</div>
<div class=" sixCore_bottom">
<div class="core" style="background:url('{pboot:sitetplpath}/static/images/zbdm.png') no-repeat;">
<div>直播弹幕</div>
</div>
<div class="core" style="background:url('{pboot:sitetplpath}/static/images/zbjy.png') no-repeat;">
<div>直播禁言</div>
</div>
<div class="core" style="background:url('{pboot:sitetplpath}/static/images/zbds.png') no-repeat;">
<div>优惠活动</div>
</div>
<div class="core" style="background:url('{pboot:sitetplpath}/static/images/zblw.png') no-repeat;">
<div>直播抽奖</div>
</div>
<div class="core" style="background:url('{pboot:sitetplpath}/static/images/zbdd.png') no-repeat;">
<div>直播订单</div>
</div>
<div class="core" style="background:url('{pboot:sitetplpath}/static/images/zbfz.png') no-repeat;">
<div>直播翻转</div>
</div>
</div>
<div class="groupTestBtn" onclick="wxclick()">获取解决方案</div>
</div>
{include file=comm/foot.html}
</div>
<script>
</script>
</body>
</html>