大家好,我是飞小优,今天给大家介绍一款免费弹窗工具插件,主要的使用场景包括:营销活动、营销报告下载、优惠活动等,这些常见的使用场景都可以使用,其他的可以自己慢慢体验。当然,该工具的目的主要是将网站流量进一步做转化。

如何安装
登录仪表盘-插件搜索popup maker ,由于已经安装了,所以步骤略,装好之后就直接开启。

Popup maker界面构成介绍
打开插件入口,我先介绍几个比较重要的菜单。

All popups 所有弹窗,也就是后续新建之后的弹窗列表
Create popup 新建弹窗
Popup theme 弹窗主题,这是预设模式,里面包含8种,这也是需要核心介绍的。

以默认风为例介绍

Overlay 图层覆盖,2个操作组件,颜色配置和透明度设置,确定右侧背景图的颜色及整体透明度。

Container 容器,也就是弹窗布局大小,可以自定义配置,一般可以默认设置

Title 标题,可以选择字体及大小与阴影,可以默认配置

Content 内容 同样可以自定义配置,控制文字背景颜色及字重和大小,右侧部分是预览效果。

Close 最后一个是关闭设置,这里有一个重点是 支持iconfont,需要填写css类,当然这个已经集成了FontAwesome 因此可以使用图标文字,输入fas fa-camera 就会显示x 。![]()
好了,基本的构成就是这样,接下来主要介绍如何应用到网页中。
Popup maker如何应用到网页
假设一个场景,现在新推出一个报告需要应用到首页,促进更多用户进行查看点击。
新建Popup弹窗
点击create popup,新建一个弹窗,按照demo填好信息


定义一个css类,方便后期调用,这会直接输出弹出效果,确定好后发布即可。
如何输出到页面中
例如,我想将这个新的活动在导航栏菜单中输出,则需要添加导航菜单,然后填写css类,如

最后前端就会出现你要的弹窗效果了


