微信小程序,小程序的一种,英文名Wechat Mini Program,是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用。
全面开放申请后,主体类型为企业、政府、媒体、其他组织或个人的开发者,均可申请注册小程序。微信小程序、微信订阅号、微信服务号、微信企业号是并行的体系。
微信小程序是一种不用下载就能使用的应用,也是一项创新,经过将近两年的发展,已经构造了新的微信小程序开发环境和开发者生态。微信小程序也是这么多年来中国IT行业里一个真正能够影响到普通程序员的创新成果,已经有超过150万的开发者加入到了微信小程序的开发,与我们一起共同发力推动微信小程序的发展,微信小程序应用数量超过了一百万,覆盖200多个细分的行业,日活用户达到两个亿,微信小程序还在许多城市实现了支持地铁、公交服务。微信小程序发展带来更多的就业机会,2017年小程序带动就业104万人,社会效应不断提升。
首页页面
首页页面包括标题栏、轮播图、功能区和展示卡片,其文字内容、图片和图标等可以在如下代码中对应位置修改,方便简单。
<import src="../../template/item-template.wxml"/> <view class="container"> <view class="section section_gap swiper_box"> <template is="index_index_scroll_tmpl" data="{{...index_index_scroll_tmpl}}"/> </view> <view class="text"> <view class="line_y"></view> <text>服务范围</text> </view> <view class="section index-nav"> <template is="index_index_navs_tmpl" data="{{...index_index_navs_tmpl}}"/> </view> <view class="text"> <view class="line_y"></view> <text>特别推荐</text> </view> <view class="nr11"> <image src="/image/a1.jpg"></image> </view> <view class="nr11"> <image src="/image/a3.jpg"></image> </view> </view>
产品展示页面
所有产品展示页面包括头部标题栏、中间部分的图文卡片列表,其中的文字、图片和图标内容等可以在以下代码对应处简单方便地修改。
<view class="container"> <image src="/image/V7702.jpg"></image> </view> <view class="container"> <image src="/image/F9.jpg"></image> </view> <view class="container"> <image src="/image/K77.jpg"></image> </view> <view class="container"> <image src="/image/L77.jpg"></image> </view> <view class="container"> <image src="/image/LS79.jpg"></image> </view> <view class="container"> <image src="/image/T77.jpg"></image> </view> <view class="container"> <image src="/image/T7701.jpg"></image> </view> <view class="container"> <image src="/image/V77.jpg"></image> </view> <view class="container"> <image src="/image/V177.jpg"></image> </view> <view class="container"> <image src="/image/V551.jpg"></image> </view> <view class="container"> <image src="/image/V7701.jpg"></image> </view> <view class="container"> <image src="/image/V7703.jpg"></image> </view> <view class="container"> <text class="daodi">到底了</text> </view>
服务电话页面
服务电话页面包括头部标题栏、中间部分的开锁服务、上门安装、销售、配置钥匙和门店电话等可展开菜单栏,其中的文字、图片和图标内容等可以在以下代码对应处简单方便地修改。
<view class="index"> <view class="head"> <view class="title">服务内容</view> <view class="desc">全国统一服务电话:4000000000</view> </view> <view class="body"> <view class="widgets"> <block wx:for-items="{{list}}" wx:key="item.id"> <view class="widgets__item"> <view id="{{item.id}}" class="widgets__info {{item.open ? 'widgets__info_show' : ''}}" bindtap="widgetsToggle"> <text class="widgets__info-name">{{item.name}}</text> <image class="widgets__info-img" src="/image/arrowright.png" mode="aspectFill" /> </view> <view class="widgets__list {{item.open ? 'widgets__list_show' : ''}}"> <block wx:for-items="{{item.pages}}" wx:for-item="page" wx:key="item.id"> <navigator url="component-pages/{{page}}/{{page}}" class="widget"> <text class="widget__name">{{page}}</text> <image class="widget__arrow" src="/image/arrowright.png" mode="aspectFill" /> <view class="widget__line {{index == 0 ? 'widget__line_first' : ''}}"></view> </navigator> </block> </view> </view> </block> </view> </view> </view>
关于我们页面
关于我们页面包括头部标题栏、图片展示、文字展示以及下方的“点击拨打客服电话”,其中的文字、图片和图标内容等可以在以下代码对应处简单方便地修改。点击“点击拨打客服电话”可以调起跳转手机的拨号界面。
<view class="gy1"> <image src="/image/gy1.jpg"></image> </view> <view class="text"> <view class="line_y"></view> <text>关于企业</text> </view> <view class="text2"> <text>
xxx公司是最大的锁业服务企业之一,一直以技术服务引领着锁业发展
核心技术在于防盗安全系统及便民的“锁事”服务。
公司地址:XXXXXXXXXXXXXXXXXXXXX
全国统一服务电话:400-0000-000
</text> </view> <view class="gy"> <image src="/image/gy.jpg"></image> </view> <button type="default" bindtap="calling">点击拨打客服电话</button>
导入说明:下载源码后,解压,然后打开微信开发者工具,点击导入,导入包含app.json文件的这层文件夹。