叮咚,六一儿童节又快到了,不知道各位小伙伴们准备好如何用H5页面这种方式借势营销了嘛?本期我们使用的是 意派Epub360 H5编辑器,希望本期教程可以给你带来一些灵感和启发~

工具/原料

  • 联网的电脑一台
  • 意派epub360账号
  • 儿童节相关的图片、音频等素材

H5地址:www.epub360.com

方法/步骤

1、网上搜索 Epub360 ,进入官网注册登录,进入工作台,点击左侧创建第一个空白的H5作品

2、进入工作台,点击左上角的“+”,创建第一个作品

3、我们在第一页添加六一儿童节相关的图片素材,并排版好,在左侧资源面板可以找到对应的图层进行替换

4、我们在第二页添加背景、题目和选项图片按钮,接着添加“按钮组”组件和参数变量,绑定这四个选项,并设置每个选项的得分,在触发器上设置点击总分=总分+ 按钮组组件

5、我们复制第二页,修改题目和选项的图片,并调整好选项的得分,按照这个方法,我们复制出九个页面(一共十道题),调整好每个页面的内部

6、然后我们新建一个界面,设置六一儿童节的结果海报和不同分值的文案,添加截屏组件,关联需要参与截屏的元素,并赋值到一张空白的图片上,这个图片需要勾选“允许微信长按识别保存图片”

7、这样,我们整体的案例就做好,可以点击编辑器左上角预览和发布,进行查看和发布出去啦

END

注意事项

  • 如果需要跨页显示,则需要添加文本类型的全局变量
  • 请使用谷歌浏览器编辑制作
  • 最后的图片需要勾选支持微信识别长按保存

本期教程较为笼统介绍制作思路,适合中级epub360的同学

拓展阅读:《【测试题案例教程】根据得分获得不同结果》

如何制作六一儿童节答题测试H5页面?相关推荐

  1. 六一活动页面html,HTML5教程|如何制作六一儿童节答题测试H5页面?

    叮咚,六一儿童节又快到了,不知道各位小伙伴们准备好如何用H5页面这种方式借势营销了嘛?本期我们使用的是意派Epub360H5编辑器,希望本期教程可以给你带来一些灵感和启发~ 工具/原料 联网的电脑一台 ...

  2. 黑马h5学习代码_如何零基础制作酷炫实用的H5页面

    H5页面已经成为了当下移动端主要的宣传方式,一个好的H5页面有极高的营销价值,无论是企业还是个人都非常需要.制作一个炫酷的H5页面一定要会写代码吗,下面千锋网络营销小编就给大家分享如何零基础制作炫酷实 ...

  3. HTML5案例|如何可视化制作六一儿童节前端页面

    六一儿童节又快到了,不知道各位小伙伴们准备好如何借势营销了嘛? 在准备制作之前,可以看看意派Epub360H5平台上这些H5案例,希望可以给你带来一些灵感和启发~ 作品一 出品:欢庆六一|我和祖国一起 ...

  4. H5页面制作平台源码 微场景制作软件 含搭建部署教程

    分享一个H5页面制作平台源码,微场景制作软件,快速生成H5页面,含几百套模板和详细搭建教程,开发语言是PHP+MySQL,H5页面适合在微信朋友圈传播,传播能力较强. h5源码下载地址:春哥技术博客获 ...

  5. 如何使用Epub360制作炫酷的邀请函类型H5页面

    邀请函类型的H5页面作为一种活动报名.产品推广.婚礼庆典等场景通用的一种形式,发展到今天,玩法多种多样,今天我们以意派Epub360为例,来向大家介绍如何制作炫酷的邀请函H5页面 工具/原料 意派Ep ...

  6. 从零打造在线版H5页面生成器

    想必你一定使用过易企秀或其它微场景生成工具制作过炫酷的h5页面,除了感叹其神奇之处有没有想过其实现方式呢? 从设计者的角度来看待问题,会有不一样的收获,本文将从零开始,使用node技术来设计实现一款精 ...

  7. 微信h5页面不用服务器吗,你知道微信h5页面到底是个什么意思吗?

    HTML的英文全称为Hyper Text Markup Language,即超文本标记语言.HTML5是HTML的一个新版本.HTML 不是一种编程语言,而是一种标记语言 (markup langua ...

  8. Vue + element从零打造一个H5页面可视化编辑器——pl-drag-template

    pl-drag-template Github地址:https://github.com/livelyPeng/pl-drag-template 前言 想必你一定使用过易企秀或百度H5等微场景生成工具 ...

  9. 软件测试之H5页面测试总结(参考)

    参考:软件测试之H5页面测试总结https://mp.weixin.qq.com/s/D0_uPMbP4FeIoD_rVpV4Mg 前言 大家反馈资源失效的问题,小编已经收到了,资源还是给和谐,小编也 ...

  10. (实战)Vue + Koa从零打造一个H5页面可视化编辑器——Quark-h5

    作者:围的围 https://juejin.im/post/5dc81428e51d4523632ee793 前言 想必你一定使用过易企秀或百度H5等微场景生成工具制作过炫酷的h5页面,除了感叹其神奇 ...

最新文章

  1. SCCM2012系列之三,SCCM2012部署前的IIS准备
  2. MySQL 语句的执行顺序
  3. apache 定义日志格式 及日志记录
  4. PDA(Personal Digital Assistance)
  5. 基于Java的RDMA高性能通信库(二):Java Socket Over RDMA
  6. python 中 for使用小技巧
  7. 笨办法学 Python · 续 第四部分:进阶项目
  8. 搭建Hadoop平台(一)之配置用户名及hosts文件
  9. js校验规则--去空格、加空格
  10. atitit.web ui 结构建模工具总结
  11. Python降低XGBoost 过度拟合多种方法
  12. 商淘软件S2B2C供应链系统 支持多种电商模式
  13. 通俗地讲一下庞加莱猜想是怎么回事(from 鼓浪)
  14. 【GamePlay】Unity手机屏幕UI适配问题
  15. 平时你都用什么软件做笔记?
  16. 在VS Code中开启gdb的pretty-printer功能
  17. iOS-长按识别二维码/生成二维码/扫描二维码
  18. 无功控制器电容投切方案整理
  19. MSC/VLR/SSP
  20. 【Python】Python知识点小记

热门文章

  1. GPRS-PDP上下文的激活过程
  2. (单细胞-SingleCell)单细胞可变剪切流程(一)
  3. 数据科学技术与应用——第2章 多维数据结构与运算
  4. 官方rom提取原签名工具_从安卓官方版ROM中提取你喜欢的软件(单独安装包)
  5. 百度地图api 在3D地图中设置自定义样式
  6. Excel 多个条件同时重复时,自动标红
  7. 插上U盘提示“需要格式化”如何修复?u盘提示需要格式化,U盘打不开,且8G的U盘只报64M,为什么?
  8. 走进C++程序世界-------类的定义和使用(数据成员和方法成员,析构函数,构造函数,内联实现)
  9. 行星轨迹制作_用3ds max制作三维行星运动动画
  10. linux 光盘刻录命令,Linux命令刻录光盘