返回顶部
热门问答 更多热门问答
技术文章 更多技术文章

H5动态自定义模板

[复制链接]
商乾 显示全部楼层 发表于 2016-6-14 10:01:46 |阅读模式 打印 上一主题 下一主题

登录网站,浏览更多精彩内容

您需要 登录 才可以下载或查看,没有账号?加入我们

x
实现功能
自定义设计自己的模板,场景可以随时更换。
实现步骤

H5自定义模板就是客户可以自己创建一个所想要的具有动态效果的微网站模板,当我们创建好自己的动态模板之后原来使用的静态模板中的分类就没有了,具体操作如下:
在[微网站]中点击[H5动态自定义模板]会在电脑上面出现如下界面:

[H5自定义模板]l里面的模板是在[创建动态模板]里面创建好的模板,点击[创建动态模板]会出现如下界面:
系统模板:就是系统里面自带的固定模板,可以单击系统模板中的任意一个模板复制到右边的空白处作为新模板的背景,如图:

互动模板:系统里面已经创建好的互动模板和我的模板的添加步骤一样,如图:

我的模板;就是已经创建好的动态模板作为新创建的动态模板的首页,添加步骤和前面的系统模板的添加步骤一样的,如下图:

点击[是]就可以将左边的页面中的【系统模板】【互动模板】【我的模板】复制到空白页面当中,列如我将系统模板中的的一个模板添加到右边的空白页面中点击【是】之后就可以在新创建的模板中看到所要复制的模板页面:
如图就已经将左边的【系统模板】添加到新建的模板背景中了也可以单击右边页面的背景,图片,输入框,视频,按钮,音乐,图集,电话,特效,联系人,文本,将这些内容添加到空白页面中:
(1)添加背景:单击背景出现如下图:
如图:单击上图中的小三角形就可以选择选择【图集样式】,单击【选择图片】就可以上传一张模板的封面图片,最后点击【确定】就可以了,列如我选择上传一张【图片库】中的图片:

如图点击【选择图片】之后点击【图片库】选择图片,当图片被选中后点击【确定】图片就在新创建的模板中的背景中了,也可以将【我的图片】中的图片上传上去,如图:

如图,在【图片库中】选择好的图片就已经添加到背景中了,但是需要注意的是新创建的模板背景没有完全覆盖掉原来复制的【系统模板】中的所有组建,会覆盖掉原来【系统模板】中的背景但是图片没有覆盖还保留在上面。
(2)添加【图片】:单击图片从【我的图片】和【图片库】中选择图片之后选择图片之后点击确定就可以了,添加图片的数量是没有限制限制的如图我从我的图片中添加一张图片:


可以对图片进行编辑,复制,裁剪,删除等操作,也可以改变图片的样式,动画,给图片添加链接,如下图:

给图片添加链接:单击图片如图:

在【网站地址】中的网址可以从功能库中选择系统中的分类也可以添加一个外链网址,在【网站页面】中可以选择一个创建好的页面这样我们在手机端出发图片时 就可以跳转到我们设置的链接的页面和网站的页面。
(3)添加输入框单击输入框,如下图:

在【输入框名称】中可以输入姓名,手机,邮箱,文本当中的任何一个,如果需要设置必填那么就选择必填,如图:

如图可以对输入框进行编辑,复制,删除等操作也可以改变输入框的样式和动画。
(4)添加视频:单击视频,如图点击确定就可以添加视频了:

(5)添加按钮:单击按钮,如图:

如图可以对按钮进行编辑,复制,删除等操作也可以改变按钮的样式和动画
(6)添加音乐:单击音乐选择好音乐点击确定就可以了,如下图:
(7)添加图集:单击图集之后选择图片之后点击确定和上面添加背景的步骤一样
(8)添加电话:单击电话如下图

如图,在【按钮名称中可以输入】一键拨号,热线电话,拨打电话,一键拨号中的一个,在【手机/电话】中输入一个电话号码最后点击确定就可以了:

如图可以对电话进行编辑,复制,删除等操作也可以改变电话的样式和动画
(8)添加特效,单击特效如下图:

如图:可以单击【涂抹】【指纹】【数钱】【环境】当中的任意一个作为特效,列如我选择的是涂抹的特效单击之后如下图设置好之后点击保存就可以了:

(9)添加联系人:单击联系人如下图会出现姓名,手机,邮箱和提交输入框:

(10)添加文本:单击文本会出现如下页面:

如图:在【点击此处进行编辑】文本框中输入想要的文字,可以对文本框进行编辑,复制,删除等操作也可以改变文本框的样式和动画效果也可以给文本框添加链接。
以上十个内容都添加好之后点击保存会出现如下页面输入【网页名称】【分享描述】上传好图片之后点击【确定】就可以了:

动态模板添加好之后在【h5自定义模板】中可以看到我创建的模板,单击我创建好的模板可以设置为【首页模板】如图:

如图选择好所创建的动态模板之后点击【确定】就可以在手机端回复【关键字】之后点击网站封面图片看到这个动态模板:


实现效果
H5动态自定义模板如果添加了互动页面,粉丝发送的信息在哪里查看

点击进入“我的模板”,把鼠标放在模板上面会显示数据详情,在数据详情里;

注意事项
要在模板里修改编辑添加互动页面才会有数据详情的显示,如果没有做编辑是这样的页面

中国领先的数字技术资源交流中心!
您需要登录后才可以回帖 登录 | 加入我们

本版积分规则

商乾全球电商人、电商交流学习与电商实战技术分享、电商爬虫、生活交流专业网站
  • 官方手机版

  • 微信公众号

  • 商务合作