创建您自己的元素小部件。无需代码。
Master Addons 的认识 Widget Builder 是您的自定义代码和 Elementor 编辑器之间的强大桥梁。将独特的设计、AI 生成的界面或交互式 CodePen 片段转换为功能齐全、可重复使用的 Elementor 小部件。
小部件生成器的优势
创建真正唯一的小部件
根据项目的确切需求构建小部件 - 预制库无法提供的东西。
将人工智能和密码笔设计变为现实
AI工具的自定义UI或来自CodePen的实时原型直接集成到您的站点中,作为可编辑的Elementor小部件。
完全的创意控制
您拥有整个堆栈:结构 (HTML)、样式 (CSS) 和交互性 (JS),以及添加外部库的能力。
重复使用并节省时间
1次构建一个小部件,保存到你的库中,然后以一致的、可编辑的设置在任何项目中重用它。
专为电力用户打造
Elementor 的话,可以使用小部件生成器,熟悉的基于选项卡的界面让小部件创建变得可视化、直观。
跨任何网站的自定义小部件
1次构建一个小部件,并轻松导出/导入它,以便在完全不同的WordPress网站上使用,从而节省大量时间
创建并命名您的小部件
Elementor 时,首先要建立新组件的身份,给它一个明确的标题,并在一个类别中进行组织,以便每次使用 Elementor 时都能实现无缝访问。
- 为您的小部件分配一个独特且具有描述性的标题。
- 对它进行分类,以便将来在编辑器面板中轻松访问。
- 为您的可重复使用元素奠定基本基础。


设计编辑体验
Construct 您的用户将与之交互的界面。通过添加诸如切换和颜色选择器之类的控件, 您无需编写任何代码即可在视觉上构建小部件的设置面板。
- 从左侧面板添加控件(文本、颜色、选择)。
- 每个控件都成为 Elementor 中的一个可编辑选项。
- 直观地设计整个面向用户的设置面板。
将控件映射到您的代码
Widget 动态的地方,构建器会为每个控件生成智能短代码,您将其放置在模板中,以便在设置和输出之间创建实时链接。
- 用{{color}}这样的自动生成的短代码。
- 将它们粘贴到您的 HTML、CSS 或 JS 代码中。
- 在编辑器输入和前端显示之间创建直接链接。


随时随地保存和使用
保存后,您的自定义小部件即可运行。它出现在 Elementor 编辑器中,可拖动到任何页面中并使用您构建的实时设置进行自定义。
- 保存以立即将其添加到 Elementor 面板。
- 将小部件拖放到任何页面上。
- 调整实时设置并立即查看设计渲染。
你实际上可以建造什么?
从人工智能到网站
AI设计工具生成复杂的定价卡或推荐滑块,复制代码,插入Widget Builder,现在它是一个可管理的Elementor小部件,具有可编辑的文本和颜色。
生产密码笔
CodePen上找到一个令人惊叹的动画按钮或一个独特的图库?不要只是嵌入它 - 将其转换为一个可以控制所有参数的本机小部件。
构建您自己的 UI 套件
使用您品牌独特的交互模式创建一套自定义按钮、标头或信息卡,并在所有客户端站点上重复使用它们。
可用选项
文本
添加基本文本输入。
仅输入数值。
适用于较长的文本条目。
丰富的视觉文本编辑器。
直接输入代码片段。
存储隐藏的背景数据。
切换打开/关闭选项。
打开高级设置弹出窗口。
从下拉选项中进行选择。
从视觉上选择任何颜色。
选择字体系列。
控制所有文本样式。
选择日期/时间。
输入或选择链接。
上传或选择媒体。
一起选择多个图像。
从图标库中进行选择。
使用滑块调整值。
设置填充、边距等。
视觉上应用阴影效果。
设置元素背景属性。
从图像选项中选择。
创建重复的内容组。
将内容组织到选项卡中。
在您的小部件中添加颜色选项。