网页设计软件 WYSIWYG Web Builder v21.2.3

软件简介

WYSIWYG Web Builder是一款面向Windows平台的可视化网页设计与网站制作软件，软件名称中的“WYSIWYG”代表“What You See Is What You Get”，即“所见即所得”。用户无需手动编写大量HTML、CSS和JavaScript代码，就可以通过拖放、属性设置和可视化布局等方式设计网页，并将项目直接发布为网站文件。

目前WYSIWYG Web Builder已经发展到WYSIWYG Web Builder 21系列，2026年版本重点强化了响应式网页设计、AI网站生成、导航组件、动画效果、CMS、电商、表单、发布以及现代JavaScript输出等功能。官方资料显示，WYSIWYG Web Builder 21包含超过125项新功能和改进。

截至2026年10月，官方当前版本已经更新至WYSIWYG Web Builder 21.2.3，该版本于2026年10月1日发布。软件同时提供64位和面向旧电脑的32位版本。

WYSIWYG Web Builder适用于企业网站、个人博客、产品展示网站、作品集、活动网站、门户页面、响应式网站以及中小型商业网站的设计与制作。软件内置大量网页组件、布局工具、模板和扩展，可以帮助用户从页面设计一直完成到网站发布。

主要功能

1. 可视化网页设计

WYSIWYG Web Builder采用所见即所得的网页设计模式，用户可以直接在工作区中放置文本、图片、按钮、菜单、表单、容器、布局网格等元素。

通过属性面板即可调整对象的位置、尺寸、颜色、字体、边距、背景、边框以及其他网页样式，不需要深入掌握HTML和CSS即可完成基础网页设计。

2. 拖放式网页编辑

软件提供丰富的网页对象和组件，用户可以通过拖放方式快速构建页面。

这种方式尤其适合希望快速完成网页原型和网站页面设计的用户。

3. 响应式网页设计

WYSIWYG Web Builder提供完整的响应式网页设计能力，可以针对桌面电脑、平板电脑和手机设置不同的页面布局。

新版加入了Easy Breakpoints功能，可以针对单独对象设置响应式属性，而不必为整个页面增加复杂的断点配置。支持调整对象的：

• 显示与隐藏
• 字体大小
• Margin
• Padding
• 对齐方式
• Flex项目排列
• Grid项目布局

对于移动端网页设计，可以降低响应式布局的维护难度。

4. Mobile View移动预览

WYSIWYG Web Builder 21加入了Mobile View功能，可以快速在工作区中切换到移动设备视图。

用户可以设置移动端页面宽度，在设计过程中直接查看网页在较小屏幕上的布局效果，而不需要反复修改页面宽度再恢复原始设置。

5. Flex Grid与Layout Grid

软件支持多种现代网页布局方式，包括Layout Grid、Flex Grid以及Flex Container。

通过网格和Flex布局，可以更加灵活地控制网页元素的位置、间距、尺寸和响应式行为。

对于企业官网、产品页面、Landing Page以及复杂响应式网站，可以减少传统绝对定位带来的布局维护问题。

6. AI网站生成

WYSIWYG Web Builder 21加入了AI辅助网站创建功能，可以根据自然语言描述生成网站结构。

用户可以描述网站需要的：

• 页面结构
• 网站类型
• 内容
• 配色
• 组件
• 页面布局
• 设计风格

同时支持通过参考图片辅助生成网页，可以将草图、线框图或者设计参考图作为视觉方向。AI功能可以结合OpenAI、Google Gemini以及Ollama等AI服务使用。

7. 图片转网站

软件支持Image-to-Website工作流程，可以使用图片作为网站设计参考。

对于已经拥有网页草图、UI设计图、线框图或者视觉参考稿的用户，可以利用AI功能辅助建立对应的网页结构。

8. 导航菜单设计

WYSIWYG Web Builder提供多种导航组件，包括：

• Dropdown Menu
• Layer Menu
• Overlay Menu
• Inline Menu
• CSS Menu
• Navigation Bar
• Responsive Menu

新版增加了导航菜单中的图片支持，可以将自定义图片与图标结合使用。

下拉菜单还增加了丰富的箭头样式选择，可以进一步调整菜单视觉效果。

9. 移动端导航

CSS Menu新增响应式Accordion模式，可以在桌面端显示为横向导航，在移动端自动切换成垂直展开式菜单。

Navigation Bar也增加了Responsive Button模式，可以根据设置的断点自动调整桌面端和移动端的显示方式。

10. 动画效果

软件内置丰富的动画和交互效果，可以用于标题、按钮、图片、菜单以及其他页面元素。

Animated Headline支持单字符和完整单词动画，并增加了多种文字动画效果，例如：

• Flip Horizontal
• Zoom In Left
• Zoom In Top
• Zoom In Right
• Zoom In Bottom
• Rainbow
• Swoop
• Hinge

同时支持设置动画Delay，可以控制动画循环之间的间隔。

11. 图片和媒体

WYSIWYG Web Builder支持丰富的图片和多媒体内容，可以创建：

• 图片展示
• 图片画廊
• Lightbox
• 图片轮播
• Slideshow
• 视频播放器
• 音频播放器
• YouTube视频
• Vimeo视频
• TikTok内容
• MP4视频

此外还提供图片滤镜、形状、Rollover动画等网页媒体功能。

12. 表单设计

软件提供可视化表单创建工具，可以制作：

• 联系表单
• 注册表单
• 登录表单
• 文件上传
• 数据提交
• 邮件发送
• 自动回复
• 数据验证
• 条件判断
• 数据计算

表单可以根据网站需求进行自定义，并支持不同的数据处理方式。

13. CMS内容管理

WYSIWYG Web Builder提供CMS相关功能，可以用于创建具有动态内容的网站。

新版增加了内容定时发布功能，可以为文章或页面设置开始和结束日期及时间，使内容能够按照预定时间自动发布或取消发布。

14. 电商功能

软件提供第三方电子商务解决方案集成能力，可以配合不同的在线支付和电商服务构建商业网站。

适用于产品展示、在线销售、数字产品以及小型电子商务项目。

15. 卡片与组件设计

WYSIWYG Web Builder支持Card Container和卡片式网页设计。

新版增加Card Tools工具栏，可以更加方便地管理卡片本身以及卡片中的独立项目。

卡片布局适合用于：

• 产品展示
• 服务介绍
• 新闻列表
• 价格方案
• 团队成员
• 作品展示

16. Style Manager样式管理

Style Manager可以集中管理网页中的样式。

新版增加了Apply to all breakpoints选项，可以将当前样式的属性应用到所有响应式断点。

同时Link Styles支持Custom CSS，可以分别针对链接的Default、Active、Visited和Hover状态设置自定义CSS。

17. CSS与JavaScript支持

WYSIWYG Web Builder虽然以可视化设计为主，但同样允许开发人员加入自定义CSS、JavaScript以及其他网页代码。

新版导航组件进一步减少了对jQuery的依赖，生成的相关脚本采用原生JavaScript，有助于生成更加现代化的网页代码。

18. jQuery 4支持

WYSIWYG Web Builder 21加入了对jQuery 4的支持。

由于jQuery 4属于较新的主要版本，软件目前提供了相应支持，但官方说明该功能并没有默认启用，方便用户逐步迁移和测试现有项目。

19. 网站发布

软件内置Publish功能，可以将设计完成的网站上传到服务器。

支持设置不同的发布位置，并可以针对指定文件类型进行发布。例如可以只发布：

• 图片
• 视频
• ZIP文件
• HTML文件
• 其他指定文件

新版增加了Publish only specific files功能，可以通过文件类型过滤器选择需要发布的内容。

20. 模板和预制区块

WYSIWYG Web Builder提供大量预制Blocks和网站模板，可以减少从零开始制作网页的时间。

WYSIWYG Web Builder 21还增加了25个以上的新模板，这些模板同时用于展示新版的响应式设计和其他功能。

21. 多语言支持

软件支持语言模块，可以根据需要安装不同语言界面。

新版还会在启动时检查语言模块与当前软件版本是否匹配，如果版本不一致，可以提示用户更新对应语言模块。

更新内容

WYSIWYG Web Builder 21.2.3

目前最新的21系列版本为WYSIWYG Web Builder 21.2.3，于2026年10月1日发布。该版本主要针对稳定性、布局、导航以及购物车等问题进行了修复和优化。

主要更新包括：

• 修复从剪贴板粘贴设备无关位图（CF_DIB）时可能发生的崩溃问题。
• 修复Layout Grid固定列Padding应为0的问题。
• 修复Card Items使用Copy Style时的问题。
• 修复Navigation Bar在按钮尺寸采用响应式设置时输出错误主题颜色的问题。
• 优化Shopping Cart输出。
• 移除购物车PLN前面的z前缀。

下载地址

官网 http://www.wysiwygwebbuilder.com

官方下载
http://www.wysiwygwebbuilder.com/webbuilder20.zip
http://www.wysiwygwebbuilder.com/webbuilder20x64.zip
用户指南 http://downloads.wysiwygwebbuilder.com/wb20userguide.zip
以及免费的额外插件 http://www.wysiwygwebbuilder.com/free_extras.html

网盘下载（官方版 / 汉化版 / Patch / 便携版）

链接: https://pan.baidu.com/s/1I_TiqMCrouHQy3aEavo4iA?pwd=rhbq 提取码: rhbq