Elementor Pro 教程:轻松实现表单附件上传功能,无需额外插件

elementor pro附件上传

步骤一:添加Elementor Form小部件

点击页面,用elementor 新建页面或者直接elementor编辑页面,创建编辑模板都可以。

elementor创建新页面

添加Form小部件

Elementor Pro 教程:轻松实现表单附件上传功能,无需额外插件 – elementor form小部件
添加form部件

在Form小部件内容部分添加新项目,选择file upload。

Elementor Pro 教程:轻松实现表单附件上传功能,无需额外插件 – elementor form新增file upload

Label:写一点注意事项提升用户体验,比如:仅支持PNG、PDF、JPG、JPEG文件,单个文件最大2MB,最多一次性上传5个附件等等。

Elementor Pro 教程:轻松实现表单附件上传功能,无需额外插件 – elementor 设置label

Required:自己根据需要看要不要硬性上传。

Send files:选择email with attachment

Elementor Pro 教程:轻松实现表单附件上传功能,无需额外插件 – elementor form send files设置email with attachment

Max file:限制上传得最大附件,1-20MB可选,最大20MB。

Elementor Pro 教程:轻松实现表单附件上传功能,无需额外插件 – elementor form附件上传最大20mb

Allowed File Types:填写允许上传得文件类型,PNG,JPG,PDF等等。

Elementor Pro 教程:轻松实现表单附件上传功能,无需额外插件 – elementor form选择允许上传得文件类型

Multi Files打开,允许上传多张图片或文件,下面自定义数量。

Required Mark:打开,然后根据需求打开项目得required mark。

Elementor Pro 教程:轻松实现表单附件上传功能,无需额外插件 – elementor form自定义上传附件数量

下面得直接按照默认保存就可以了,点击右上角发布页面。这样就实现表单附件上传功能了。

步骤二:测试功能

打开chrome得访客模式并输入目标页面。

Elementor Pro 教程:轻松实现表单附件上传功能,无需额外插件 – elementor 测试打开chrome得访客模式输入网址

按照步骤填写邮箱,添加附件,发送。

Elementor Pro 教程:轻松实现表单附件上传功能,无需额外插件 – elementor form发送测试

发送成功同时邮箱也同时收到邮件,打开查看一下。

Elementor Pro 教程:轻松实现表单附件上传功能,无需额外插件 – elementor form 发送成功同时邮箱也收到邮件

附带得图片也成功收到。

Elementor Pro 教程:轻松实现表单附件上传功能,无需额外插件 – elementor form附件图片也收到了

利用Elementor Pro制作美观的选项卡

本文对你有帮助吗?

发表评论

您的邮箱地址不会被公开。 必填项已用 * 标注

滚动至顶部