Getting Started Top Previous Next

Getting Started
Top Previous Next


WYSIWYG Web Builder is a Web site building tool that helps you design and build full-featured Web sites without the need to learn HTML.

When you preview or publish a page, Web Builder automatically generates the HTML code your browser needs to display pages.



How is WYSIWYG Web Builder different from a regular HTML editor?

The idea behind this application is to hide HTML from the user. Web Builder is not an HTML editor, but an HTML generator. You don't even have to know there is HTML involved. Just drag & drop images, text and other objects on your page and your page is ready to be published!



WYSIWYG Web Builder does not edit the HTML directly, but it uses its own file format (.wbs) to store the information of the website. You can even store your complete website into one single file!

By not using HTML internally, Web Builder can do much more than just generate standard HTML objects: it supports shapes, drawings, navigation bars, rss feeds, blogs, photo galleries, ready to use javascripts and much more advanced objects.



Tip:

To export your pages to HTML you must use the built-in publish tool.




If you like you can insert existing HTML to your page using the HTML tools (Page HTML and the HTML object. You can also insert custom attributes or other code to almost any object.



FrontPage, Dreamweaver etc use a document (word processor) method for layout, where you can not pick up objects and drag it where you want it to go on the web page. In WYSIWYG Web Builder you can drag and drop the objects anywhere you want. Giving you full control over the layout. You can even put objects on top (or below) other objects!



Traditional HTML editors use Dynamic Page Layout, which means that the first object on the page will also determine the position of the second object. Resizing or moving the first object will affect the complete layout of the page. You can't overlap objects when using Dynamic Page Layout.



WYSIWYG Web Builder generates Fixed Page Layout. All objects have a fixed position which is not affected by other objects. This also allows you to overlap objects and give you much more control over the layout of the page.





Tip:

For step by step instructions to the basic features of WYSIWYG Web Builder please visit the online tutorials: http://www.wysiwygwebbuilder.com/getting_started.html




Here are a few simple steps to get you started:



Start WYSIWYG Web Builder

When WYSIWYG Web Builder is started, an empty page is displayed.

On the left side you see all the available tools which you can use to build your web site. This part is called the Toolbox.

On the right side there is the so called Site Manager, which can be used to Add, Remove or Edit pages. By default one page is already added; this is the index page usually the first page (also called Home page) of a web site.

The center of the screen is the workspace, where you can drag and drop objects from the toolbox.



Tip:

Every time you insert a new page to your website it will be added to the Site Manager. To edit previously created pages you can double click the page name to open it in the editor.






Set Page Properties

The first thing you probably want to do is set some general page options. Select View->Page Properties from the menu to show the Page Properties window. Here you can specify things like page title, background image/color, text colors and the page dimensions. Click OK to make the changes active.




Adding text to the page

Select Insert->Text from the menu and draw a box to indicate the position of the text. Then double click the box to start editing the text. Type some text and (press Enter to go to the next line).

The box automatically changes its size to fit the text. Next you can change the text attributes by highlighting the text you want to modify with the mouse and then choose the new attributes from the Format Toolbar (see Format Tools for more details). Click anywhere in the page to stop editing.

Although WYSIWYG Web Builder will display all fonts installed on your computer by default we recommend that you only use web safe fonts, so your web pages will look the same on all computers.
Read more about web safe fonts.




Adding an image to the page

Select Insert->Image from the menu and draw a box to indicate the position of the image.

The size of the box doesn’t matter; Web Builder automatically adjusts the box to fit the image after you place it.

The Image File Open dialog appears so you can locate the image you want to place in the image box.

Select the image you want to add and click Open to add it to the page. To resize the image drag the borders of the image object.


Tip:

You can also copy/paste images directly from another application (PhotoShop, PaintShopPro, IE, FireFox etc)!





Adding other objects to the page

There are lots of other objects you can place on the page. Check out Insert Menu for a description of the other objects.



Tip:

Another way to add objects to your page is by simply dragging them out of the toolbox onto the workspace.




Selecting multiple objects
Method A
1) Select an item

2) Hold download the SHIFT key on your keyboard

3) Select another item

Now you have selected multiple items. Repeat these steps if you want to select more items.



Method B

Drag a rectangle around the items you want to select. When you release the mouse button, the items within the rectangle will be selected.



Note:

Sometimes the group of items you wish to select is on top of another item (like a shape or layer). In this case if you don't want to select the underlying object, hold down the CTRL key before you click and start dragging.




Creating (hyper)links
Hyperlinks are text or images that can be clicked to bring the user to another web file such as a web page or image. They are the essence of the World Wide Web as they link pages within sites and web sites to other web sites. To create a hyperlink in Web Builder, read this section about links.


Saving your web site
To save your web site (including all pages it contains) Select File->Save Web Site for the menu and enter a name for the project.

Web Builder uses the extension .wbs (Web Builder Site) to save the project files, to save your page as HTML you must Publish your pages.



Note:

When you save your project then it will also create a sub folder with the same name as the project. This folder will contain all assets (images, movies. scripts etc) used by the project. So if you move or copy your project to another computer then you must also include this folder.





Preview a page in your browser

Select File->Preview (F5) to preview the current page in your browser.

Depending on the preview scope (Tools->Options->Misc), you can either preview a single page or the entire web site.

It's also possible to change the browser that is used for previewing. Go to File->Preview in Browser->Edit Browser List to add/edit the list of browsers that can be used to preview the pages you are working on.



Tip:

Holding down the SHIFT key while previewing will 'invert' the current preview scope.





Publishing a page
The final phase of creating a web site is publishing your pages, so that other people can view it on the Internet.

Select File->Publish to publish your page(s) to a local folder or a remote FTP server.

For more details check out: Publish.




What's Next?

This help file has a description of most of Web Builder's features.

Select one of the items for more information:

File Menu

Edit Menu

View Menu

Page Menu

Insert Menu

Format Menu

Table Menu

Layout Menu

Tools Menu



Advanced features:

Forms

Tables



Or go directly to the description of one of the available objects: Toolbox.



Tip:

For Frequently Asked Questions or other support please visit: http://www.wysiwygwebbuilder.com/support.html.








Getting Started
Top Previous Next


WYSIWYG Web Builder is a Web site building tool that helps you design and build full-featured Web sites without the need to learn HTML.

When you preview or publish a page, Web Builder automatically generates the HTML code your browser needs to display pages.



How is WYSIWYG Web Builder different from a regular HTML editor?

The idea behind this application is to hide HTML from the user. Web Builder is not an HTML editor, but an HTML generator. You don't even have to know there is HTML involved. Just drag & drop images, text and other objects on your page and your page is ready to be published!



WYSIWYG Web Builder does not edit the HTML directly, but it uses its own file format (.wbs) to store the information of the website. You can even store your complete website into one single file!

By not using HTML internally, Web Builder can do much more than just generate standard HTML objects: it supports shapes, drawings, navigation bars, rss feeds, blogs, photo galleries, ready to use javascripts and much more advanced objects.



Tip:

To export your pages to HTML you must use the built-in publish tool.




If you like you can insert existing HTML to your page using the HTML tools (Page HTML and the HTML object. You can also insert custom attributes or other code to almost any object.



FrontPage, Dreamweaver etc use a document (word processor) method for layout, where you can not pick up objects and drag it where you want it to go on the web page. In WYSIWYG Web Builder you can drag and drop the objects anywhere you want. Giving you full control over the layout. You can even put objects on top (or below) other objects!



Traditional HTML editors use Dynamic Page Layout, which means that the first object on the page will also determine the position of the second object. Resizing or moving the first object will affect the complete layout of the page. You can't overlap objects when using Dynamic Page Layout.



WYSIWYG Web Builder generates Fixed Pa

結果 (中文) 1:

入门顶尖的上一页下一页 所见即所得的 Web 生成器是网站建设工具，帮助您设计和构建全功能的 Web 站点，而无需了解 HTML。预览或发布网页时，Web 生成器自动生成您的浏览器需要显示的页面的 HTML 代码。 所见即所得的 Web 生成器是如何不同于常规的 HTML 编辑器?此应用程序背后的想法是从用户隐藏 HTML。Web 生成器不是 HTML 编辑器，而 HTML 发电机。你甚至不需要知道那里是 HTML 参与。只是拖 & 下降图像、 文本和其他您的页面和您的页面上的对象是准备好发布! 所见即所得的 Web 生成器不编辑的 html 代码直接，但它使用自己的文件格式 (.wbs) 来存储信息的网站。你甚至可以成一个单一文件存储您完整的网站!通过内部不使用 HTML 中,，Web 生成器可以做更多只是生成标准的 HTML 对象: 它支持形状、 图纸、 导航栏、 rss、 博客、 相册、 准备好要使用 javascript 和先进得多的对象。 提示:若要将您的网页导出到 HTML 必须使用内置的发布工具。 如果你愿意，你可以将现有 HTML 插入到您的网页使用的 HTML 工具 (网页 HTML 和 HTML 对象。你还可以插入自定义属性或其他对几乎任何对象的代码。 FrontPage，Dreamweaver 等使用文档 (字处理器) 的方法来布局，在那里，你可以不拿起物体并拖动它在哪里你想它去在 web 页上。在所见即所得的 Web 生成器中你可以拖放和任何你需要的对象。给你充分控制布局。你甚至可以把对象上 (或以下) 的其他对象! 传统的 HTML 编辑器使用动态的页面布局，这意味着页面上的第一个对象也将确定第二个对象的位置。调整大小或移动的第一个对象会影响页面的完整布局。使用动态页面布局时，你不能重叠对象。 所见即所得的 Web 生成器生成固定页面布局。所有对象都有一个固定的位置，不受其他对象。这也允许你重叠对象并为您提供更多控制页面的布局。 提示:为基本功能的所见即所得的 Web 生成器的分步说明，请访问在线教程: http://www.wysiwygwebbuilder.com/getting_started.html 这里有几个简单步骤让你开始: 启动所见即所得的 Web 生成器所见即所得的 Web 生成器启动时，将显示一个空白的网页。在左边你看到所有可用的工具你可以使用来生成您的 web 站点。这部分叫做工具箱。在右侧还有所谓的站点管理器，可以用来添加、 删除或编辑页面。默认情况下已添加一页;这是通常的第一页 (也称为主页) 的 web 站点的索引页。屏幕的中心是工作区，在那里你可以拖放和对象从工具箱。 提示:每次你到你的网站，它将被添加到站点管理器中插入新的一页。若要编辑以前创建页面您可以双击该页面名称以在编辑器中打开它。 设置的页面属性你可能想要做的第一件事是设置一些常规页的选项。选择视图-> 页面属性，从菜单中显示页面属性窗口。在这里你可以指定诸如页面标题、 背景的图像颜色、 文本颜色和页面尺寸。单击确定使更改处于活动状态。 将文本添加到页选择插入-> 从菜单中的文本和画框，以指示文本的位置。然后双击此框以开始编辑文本。键入一些文本，(按 enter 键转到下一行)。框中会自动更改其大小以适合文本。接下来，您可以通过突出显示您想要使用鼠标进行修改，然后从格式工具栏上选取新属性的文本更改文本属性 (更多详情请参阅格式工具)。单击要停止编辑的页的任意位置。 虽然所见即所得的 Web 生成器将显示在默认情况下，我们建议您只使用 web 安全字体，字体，所以您的 web 页的外观都相同的所有计算机上您的计算机上安装的所有字体。阅读更多关于 web 安全字体。 向页中添加图像选择插入-> 从菜单中的图像和画一个框来显示图像的位置。框的大小并不重要;Web 生成器将自动调整框以调整图像之后你把它。所以你可以找到你想要放在图像框中的图像，就会出现图像文件打开对话框。选择您想要添加并单击打开以将其添加到页的图像。若要调整大小的图像拖动图像对象的边框。 提示:您还可以复制/粘贴图片，直接从另一个应用程序 (PhotoShop、 PaintShopPro、 IE、 FireFox 等)! 将其他对象添加到页有很多你可以放置在页面的其他对象。查阅插入菜单的其他对象的描述。 提示:另一种方式将对象添加到您的页面是通过简单地拖放方式从工具箱拖到工作区。 选择多个对象方法 A1) 选择一项2) 持有下载您键盘上的 SHIFT 键3) 选择另一个项目现在您已选择多个项目。如果你想要选择多个项，请重复上述步骤。 方法 B拖动您想要选择的项周围的矩形。当您释放鼠标按钮时，将选定矩形内的项目。 注意:有时你想选择的项目组是在另一个项目 (如形状或图层)。在这种情况下如果你不想要选择的基础对象，请按住 CTRL 键在单击和拖动操作开始之前。 创建 (超) 链接超链接的文本或图像，可以点击，使用户对另一个 web 文件如网页或图像。他们是万维网的本质，他们将在网站和 web 站点内的页面链接到其他 web 站点。要在 Web 生成器中创建超链接，请阅读本节有关的链接。 保存您的 web 站点若要保存您的 web 站点 (包括它所包含的所有页) 选择文件菜单-> 保存 Web 站点并输入项目的名称。Web 生成器使用扩展名.wbs (网站生成器) 来保存项目文件，以保存您的页面作为您必须发布的 HTML 页面。 注意:当您保存您的项目，那么它将也创建一个子文件夹与项目名称相同。此文件夹将包含项目使用的所有资产 (图像、 电影脚本等)。所以如果你移动，或将您的项目复制到另一台计算机然后你还必须包括此文件夹。 在您的浏览器中预览网页选择文件-> 预览 (F5) 来预览您的浏览器中的当前页面。根据预览范围 (工具-> 选项-> Misc)，您也可以预览单个网页或整个 web 站点。它也是可以改变的浏览器用于预览。转到文件-> 预览在浏览器中-> 编辑浏览器列表中，添加编辑可以用于预览的页面您正在使用的浏览器列表。 提示:预览时按住 SHIFT 键将 '反转' 当前预览范围。 发布网页创建一个 web 站点的最后阶段发布你的页面，以便其他人可以查看它在互联网上。选择文件-> 发布将网页发布到本地文件夹或远程 FTP 服务器。更多详细信息请查阅: 发布。 下一个是什么?此帮助文件有绝大多数的网站生成器功能的描述。选择一项的详细信息:文件菜单编辑菜单视图菜单页面菜单插入菜单格式菜单表格菜单版式菜单工具菜单 高级的功能:形式表 或直接转到一个可用对象的描述: 工具箱。 提示:常见问题或其他支持，请访问: http://www.wysiwygwebbuilder.com/support.html。 入门顶尖的上一页下一页 所见即所得的 Web 生成器是网站建设工具，帮助您设计和构建全功能的 Web 站点，而无需了解 HTML。预览或发布网页时，Web 生成器自动生成您的浏览器需要显示的页面的 HTML 代码。 所见即所得的 Web 生成器是如何不同于常规的 HTML 编辑器?此应用程序背后的想法是从用户隐藏 HTML。Web 生成器不是 HTML 编辑器，而 HTML 发电机。你甚至不需要知道那里是 HTML 参与。只是拖 & 下降图像、 文本和其他您的页面和您的页面上的对象是准备好发布! 所见即所得的 Web 生成器不编辑的 html 代码直接，但它使用自己的文件格式 (.wbs) 来存储信息的网站。你甚至可以成一个单一文件存储您完整的网站!通过内部不使用 HTML 中,，Web 生成器可以做更多只是生成标准的 HTML 对象: 它支持形状、 图纸、 导航栏、 rss、 博客、 相册、 准备好要使用 javascript 和先进得多的对象。 提示:若要将您的网页导出到 HTML 必须使用内置的发布工具。 如果你愿意，你可以将现有 HTML 插入到您的网页使用的 HTML 工具 (网页 HTML 和 HTML 对象。你还可以插入自定义属性或其他对几乎任何对象的代码。 FrontPage，Dreamweaver 等使用文档 (字处理器) 的方法来布局，在那里，你可以不拿起物体并拖动它在哪里你想它去在 web 页上。在所见即所得的 Web 生成器中你可以拖放和任何你需要的对象。给你充分控制布局。你甚至可以把对象上 (或以下) 的其他对象! 传统的 HTML 编辑器使用动态的页面布局，这意味着页面上的第一个对象也将确定第二个对象的位置。调整大小或移动的第一个对象会影响页面的完整布局。使用动态页面布局时，你不能重叠对象。 所见即所得的 Web 生成器生成固定 Pa

結果 (中文) 3:

开始
上下


WYSIWYG Web Builder是一个网站建设工具，帮助您设计和构建功能齐全的网站，无需学习HTML。

当你预览或发布一个网页，网页的HTML代码生成器自动生成你的浏览器需要显示的页面。



怎么网页生成工具不同于一般的HTML编辑器？

此应用程序背后的想法是隐藏HTML的用户。网站制作不是一个HTML编辑器，而是一个HTML生成器。你甚至不需要知道有HTML参与。只需拖动&滴图像，文本和其他对象在你的页面和你的页面可以发表！



网页生成工具不直接编辑HTML，但它使用自己的文件格式（。WBS）来存储网站的信息。您甚至可以将您的完整的网站存储为一个单独的文件！

不使用HTML内部，Web Builder可以不仅仅是生成标准的HTML对象：它支持图形，图纸，导航栏，RSS feeds，博客，相册，准备使用Javascript和更先进的对象。



提示：

出口您的网页的HTML必须使用内置的发布工具。




如果你喜欢你可以插入现有的HTML页面使用HTML网页和HTML工具（HTML对象。你也可以插入自定义的属性或其他代码几乎任何物体。



FrontPage，Dreamweaver等使用一个文档（文字处理）方法进行布局，在那里你不能拿起对象，拖动它，你想去的网页。在网页生成工具你可以拖放对象到任何你想去的地方。让你完全控制布局。你甚至可以把对象放在上面（或下面）其他对象！



传统HTML编辑器使用动态页面，也就是说，该页面上的第一个对象也将确定该第二对象的位置。调整大小或移动的第一个对象会影响页面的完整布局。你不能重叠对象使用动态页面的时候。



网页生成工具生成固定的页面布局。所有对象都有一个固定的位置，不受其他对象的影响。这也允许你重叠对象和给你更多的控制页面的布局。





提示：

为一步一步的指示，到网页生成工具的基本特征，请访问在线教程：http://www.wysiwygwebbuilder.com/getting_started.html




这里有一些简单的步骤让你开始：



启动网页生成工具

WYSIWYG Web Builder是开始时，显示空白页。在左侧，您可以看到所有可用的工具，您可以使用它来构建您的网站。这部分叫做工具箱。在右边有一段所谓的站点管理器，可以用来添加、删除或编辑页面。默认情况下一个页面已经添加；这是索引页通常是一个网站的第一页（也称为主页）。屏幕的中心是工作区，在这里你可以从工具箱拖动和拖放对象，每一次你插入一个新的页面到你的网站，它会被添加到网站管理员。要编辑先前创建的页面，您可以双击该页的名称，以打开它在编辑器中的。从菜单中选择“视图”页属性显示“页面属性”窗口。在这里您可以指定页面标题，背景图像/颜色，文本颜色和页面尺寸。请单击“确定”以使更改活动。请将文本添加到页面中，选择“插入”从菜单中选择“插入”文本，然后画一个框来指示文本的位置。然后双击框开始编辑文本。输入一些文本，然后（按回车进入下一行）。自动更改其大小以适应文本。下一步，你可以通过突出显示的文本来更改文本属性，然后选择“格式”工具栏中的新属性（查看更多细节的格式工具）。点击页面中的任何地方停止编辑。虽然网页生成工具将显示您的计算机上安装的默认情况下，我们建议您只使用网页安全字体的所有字体，这样你的网页会在所有的计算机一样。
阅读更多关于网页安全字体。




添加图像到网页

选择插入>图片来自菜单和绘制一个框显示了图像的位置。大小的方块没有关系；网页生成器自动调整框以适合您所处的图像。“”“图像文件”打开对话框，您可以找到您要放置在图像框中的图像。调整图像拖动图像对象的边框的大小。


提示：

也可以复制/粘贴图像直接从另一个应用程序（PS图象处理软件，paintshoppro，IE，Firefox等）！在页面中添加其他的对象，有很多其他的对象可以放置在页面上。检查插入菜单中的其他对象的描述：-，-，-，另一种方式来添加对象到您的页面是通过简单地将它们从工具箱中的工作区。2）在你的键盘上的移动键上下载，选择另一个项目，现在你已经选择了多个项目。如果你想选择更多的项目，重复这些步骤。在你要选择的项目中，你可以拖动一个长方形的矩形。当您释放鼠标按钮时，矩形内的项目将被选中。Note注：：