SWsoft SiteBuilder 3.1 for Windows

Transcription

1 SWsoft, Inc. SWsoft SiteBuilder 3.1 for Windows User's Guide (c)

2 ISBN: N/A SWsoft, Inc Sunrise Valley Drive Suite 325 Herndon VA USA Phone: +1 (703) Fax: +1 (703) Copyright by SWsoft, Inc. All rights reserved Distribution of this work or derivative of this work in any form is prohibited unless prior written permission is obtained from the copyright holder. Solaris is a registered trademark of Sun Microsystems, Inc. X Window System is a registered trademark of X Consortium, Inc. Intel, Pentium, and Celeron are registered trademarks of Intel Corporation. MS Windows, Windows 2003 Server, Windows XP, Windows 2000, Windows NT are registered trademarks of Microsoft Corporation. IBM DB2 is a registered trademark of International Business Machines Corp. SSH and Secure Shell are trademarks of SSH Communications Security, Inc. MegaRAID is a registered trademark of American Megatrends, Inc. PowerEdge is a trademark of Dell Computer Corporation. Request Tracker is a trademark of Best Practical Solutions, LLC ActiveSite Compiller v4 is a trademark of Intorel, Inc. XML-RPC Library under MIT License

3 3 Contents Preface 4 About This Guide...4 Who Should Read This Guide...5 Organization of This Guide...5 Documentation Conventions...5 Typographical Conventions...5 Feedback...6 About SiteBuilder 7 Main Steps to Create Web Site...8 Getting Started with SiteBuilder...9 Logging Into SiteBuilder...9 Introducing SiteBuilder Wizard Interface...9 Starting to Work with SiteBuilder...10 Getting Help...11 Creating Web Site 12 Selecting Type of Web Site...13 Creating Web Site Design...14 Creating and Editing Web Site Structure...17 Creating and Editing Web Site Content...19 Editing Textual Information on Web Pages...21 Working with Tables...32 Configuring Tag Properties...46 Using SiteBuilder Modules...47 Publishing Web Site 94 After Publishing 98

4 4 C HAPTER 1 Preface In This Chapter About This Guide... 4 Who Should Read This Guide... 5 Organization of This Guide... 5 Documentation Conventions... 5 Typographical Conventions... 5 Feedback... 6 About This Guide This guide provides detailed instructions regarding operations that can be performed in the SiteBuilder Wizard, a program that enables its users to create and publish web sites in the Internet. Most topics of this guide are devoted to a particular task and the ways to perform it. It describes five main steps of aweb site creation, such as: 1 Creating web site design (see page 14) 2 Creating and editing web site structure (see page 17) 3 Creating and editing web site content (see page 19) 4 Publishing a web site on the Internet (see page 94) Additionally, the guide describes the procedure of editing a web site after it has been created and published in the Internet. Thus providing you with instructions on web site update and maintenance.

5 Preface 5 Who Should Read This Guide SWsoft SiteBuilder 3.1 for Windows User's Guide provides detailed information regarding SiteBuilder Wizard functionality. The target audience of this guide is regular users of SiteBuilder as well as guests, who are working with SiteBuilder in the guest mode, creating trial sites without publishing them in the Internet. SiteBuilder users and guests do not need any special technical knowledge in order to use the SiteBuilder Wizard. The process of a site creation and its further publishing in the Internet is quick and easy one. Organization of This Guide Chapter 2, About SiteBuilder, describes the SiteBuilder interface elements, users, and first steps with the SiteBuilder Wizard. Chapter 3, Creating Web Site, provides an outline of the way sites are created and edited and gives the detailed instructions on creating a site using the SiteBuilder Wizard. Chapter 4, Publishing Web site, contains instructions on how to publish your site. Chapter 5, After Publishing, provides information about editing and updating a site created in SiteBuilder Wizard, after it was published. Documentation Conventions Before you start using this guide, it is important to understand the documentation conventions used in it. Typographical Conventions The following kinds of formatting in the text identify special information. Formatting convention Type of Information Example Special Bold Items you must select, such as menu options, command buttons, or items in a list. Titles of chapters, sections, and subsections. Go to the System tab. Read the Basic Administration chapter.

6 Preface 6 Italics Monospace Preformatted Preformatted Bold Used to emphasize the importance of a point, to introduce a term or to designate a command line placeholder, which is to be replaced with a real name or value. The names of commands, files, and directories. On-screen computer output in your command-line sessions; source code in XML, C++, or other programming languages. What you type, contrasted with on-screen computer output. The system supports the so called wildcard character search. The license file is located in the directory. # ls al /files total # cd /root/rpms/php CAPITALS Names of keys on the keyboard. SHIFT, CTRL, ALT KEY+KEY Key combinations for which the user must press and hold down one key and then press another. CTRL+P, ALT+F4 Feedback If you spot a typo in this guide, or if you have thought of a way to make this guide better, we would love to hear from you! If you have a suggestion for improving the documentation (or any other relevant comments), try to be as specific as possible when formulating it. If you have found an error, please include the chapter/section/subsection name and some of the surrounding text so that we could find it easily. Please submit a report by to userdocs@swsoft.com.

7 7 C HAPTER 2 About SiteBuilder SiteBuilder provides unique capabilities for you to create, publish, and maintain your sites without any knowledge of HTML or other programming languages. The SiteBuilder site content management solution allows wide groups of users to create their sites with minimum efforts. The SiteBuilder main benefits are the following: Easy-to-use web interface implemented as a five-step point-and-click wizard allows you to build and publish your sites following a simple straightforward scenario. More than 500 high-quality templates with color variants offer rich opportunities for you to make your sites attractive and effective. Powerful 'What You See Is What You Get' Editor (WYSIWYG Editor) allows to see the entire page context while editing the contents. All changes on web pages can be tried and viewed before they are submitted, in the live context. Ten SiteBuilder modules add more functionality to your site pages, such as counters, blogs, forums, guest books, and many others. Also, you can create specialized service pages, such as e- shops and image galleries. In This Chapter Main Steps to Create Web Site... 8 Getting Started with SiteBuilder... 9 Getting Help... 11

8 About SiteBuilder 8 Main Steps to Create Web Site As a rule, the process of creating a site includes three main stages: planning, implementation, and site updating or maintenance. Planning: The first and most essential stage in any project is planning. Before starting with SiteBuilder, think about the purpose of your site and its target audience. After this, decide where your site will be stored, or, in Internet terminology, hosted. This stage is beyond the scope of this document. We assume that if you have access to SiteBuilder, you have all resources required for site hosting. Then, you create a detailed structure of your future site and prepare its contents, including text information and graphics. The planning stage is extremely important because it eventually determines the usefulness of your site. Implementation: The next stage is the implementation of your site. The five-step SiteBuilder Wizard takes you through the entire procedure of creating your site, from initial design to publishing and maintenance. The following are the main steps required to create a site using SiteBuilder: 1 To create a site for the first time, open the SiteBuilder Wizard. You can start working with the Wizard without user authorization (no login/password needed). 2 Complete the first four Wizard steps (select the design, create the site structure, add site contents, add site modules and provide extra information for search engines). 3 Open the Publish tab. At this stepyou will see detailed instructions on how to access your new site so that you can edit it. Your site created using the SiteBuilder Wizard is saved as a trial site in a temporary storage directory on the SiteBuilder server. On the Publish tab, you will see an automatically generated site identifier. Using this link to the trial site, which might look like you can later return to your site, edit and publish it (about editing your site, see the Creating and Editing Web Site Content (see page 19) chapter). 4 After you purchase hosting services from your provider, you will be provided with a domain name. Tell the SiteBuilder administrator the domain name where your site will be hosted. The SiteBuilder administrator will enter your domain name in the publish properties for your site in the SiteBuilder administrator panel. After publication, your site will be available on the Internet. 5 Enter the link to your trial site in the address bar of the browser window. Your site will open in the browser window. Click Edit at the top of the site to launch the SiteBuilder Wizard. Now you can edit the content of your site. After editing, click Publish web site. The updated content of your site will be transferred to the server where your site is hosted. After publication, your site will be available on the Internet. Maintenance: When you complete the above steps, your site becomes available for visitors. It is critical to keep your site content fresh because this is a good way to show your attitude to customers and services. Therefore, always be sure that your site is updated on a regular basis. In SiteBuilder it is easy to keep your site content up-to-date. All you need to do is to log into the SiteBuilder using the site identifier and your password, edit the content, and click Publish. SiteBuilder will automatically transfer the updated content to your hosting location. For detailed instructions on what you should do on every step of creating your site, see the following chapters.

9 About SiteBuilder 9 Getting Started with SiteBuilder This section describes your first steps with the SiteBuilder Wizard. Logging Into SiteBuilder To log into the SiteBuilder Wizard for the first time and start creating your site 1 Open your Internet browser. 2 Enter the URL that your SiteBuilder administrator has given to you, into the address bar of your browser. The SiteBuilder Wizard opens on the first Overview page. You can also access the SiteBuilder Wizard from the site of your hosting provider. Introducing SiteBuilder Wizard Interface Every SiteBuilder Wizard window consists of the following elements: 1 The Logotype image is located in the top frame of the SiteBuilder Wizard. The default logotype is a SiteBuilder image linked to the SWsoft official site. This image can be customized by a SiteBuilder administrator. 2 The Top help string provides short instructions about the operations you can do on this page. 3 The Tabs in the top frame area switch between five Wizard steps. The tabs that are available for you at the current stage of creating a site are shown as active. For example, you cannot open the Edit tab until you have created a structure of web pages on the Pages tab. 4 The Work area displays the interface options available for the tab selected in the top frame. 5 The Feedback button enables you to submit your opinion or suggestions on SiteBuilder usability and functionality. 6 The Support button located in the top right corner of the screen opens SiteBuilder Online Server Support screen on the SWsoft official site. Here you can request the help of our professional technical support team upon filling in the form. 7 The Command bar at the bottom of the window displays the result of your last command. 8 The Previous button enables you to get to the previous step of the Wizard (you can also return to another step by selecting the corresponding tab in the top frame area). 9 The Next button switches you to the next step of creating your site (you can also click the next tab in the top frame area).

10 About SiteBuilder 10 Starting to Work with SiteBuilder The first page of the SiteBuilder Wizard contains short description of each step in the application. This SiteBuilder Wizard steps are: Start allows you to choose the type of site you want to create. Design allows you to choose your site layout, color scheme, button style, a flash movie for the first page, and so on. Pages allows you to create and edit your site structure. Edit allows you to create and edit your site content. Publish allows you to publish your site to a server. To start creating your site Click Start in the main work area. OR Click Start in the bottom right corner of the page. To change the Wizard interface language, select the language you need from the Interface language list. Figure 1: Starting to Work with SiteBuilder

11 About SiteBuilder 11 Getting Help The SiteBuilder help system has been created to assist you in solving problems you might encounter when creating your site. Finding answers on your own takes less time and is definitely more satisfying than any other way. To find the information you need, you can do the following: Use on-screen context-sensitive help. Itis the easiest and quickest way to get instant help with your immediate tasks. Using context-sensitive help will not interrupt your work flow. The Top help string contains short instructions on the operations that are available on the current page. The Command bar at the bottom of the screen displays the result of the last command you have performed on the SiteBuilder page. Read user documentation. To open the PDF version of the User's Guide, download the files from the official SWsoft site at ( Use FAQ. For the fastest way to solve your problems with SiteBuilder, check out the SiteBuilder FAQ page ( ( that provides instant access to solutions for a variety of questions. Select the SiteBuilder category and view the list of FAQs related to SiteBuilder. Go to online forum. If you failed to solve your problem using the ready-to-use FAQs, join our online forum at ( Here, all users can post questions, exchange ideas, and troubleshoot common problems. However, this forum is an informal one. Contact technical support. If you have any problems or questions that are not covered in the documents or online services, please contact SWsoft Technical Support (mailto:support@swsoft.com).

12 12 C HAPTER 3 Creating Web Site This chapter describes the steps of creating a fully featured site, starting from asite design to gathering site statistics. In This Chapter Selecting Type of Web Site Creating Web Site Design Creating and Editing Web Site Structure Creating and Editing Web Site Content... 19

13 Creating Web Site 13 Selecting Type of Web Site On the Start page, you can select to create one of the following types of site: Photogallery. You can create photogallery and place some images there. Blog. You can create your online journal, so-called blog. Standard site. You can create your custom site. A custom Site Family, if it is available. Select the type of site you want to create and click Next in the bottom right corner of the page. Figure 2: Selecting Type of Web Site

14 Creating Web Site 14 Creating Web Site Design After you have selected the type of site you want to create and clicked Next, you go to the Design screen. On the Design screen, you can select a template for your site and design for the following elements: Color scheme Header Buttons Logo Site Info: Company name Copyright Selecting templates Figure 3: Creating Web Site Design To select a template for your site 1 Select the template category. To view the templates of a certain category, select the category from the Category list. To view templates of all categories, select All categories. 2 Select the template from the category.

15 Creating Web Site 15 The Preview window, displaying larger size of the web page you have selected, is on the left side of work area. Click the Preview window to preview the web page in its full size. Selecting color scheme In the Color schemes area you can select color scheme for your templates. To select color scheme, click the template of the color you prefer. Selecting header To select an available header 1 Click the arrow beside header displayed in the Header area. The list of available headers is displayed. 2 Click the header you want to select. You can upload new header not present in the list of available headers, to be displayed at the top of each of your web page. To upload a new header 1 Click Browse... in the Header area. 2 In the Browse... window, find and select the header file you want to upload. 3 Click Open in the Browse... window. 4 Click Upload in the Header area. New header is uploaded and displayed on the Design screen. Selecting buttons Select the style of the buttons that will be located on your site in the Buttons area. To select button style, click the preferable style. Uploading your logo You can upload your own logo that will be displayed on your site. To upload your logo 1 Click Browse... in the Logo area. 2 Find the logo image you want to upload from your computer. 3 Click Open in the Browse... window. 4 Click Upload in the Logo area. New logo is displayed on the Design screen. Entering site information

16 Creating Web Site 16 Enter your company name in the Company name field in the Site Info section. Enter the copyright information in the Copyright field in the Site Info section. Click Next to go to the Pages screen.

17 Creating Web Site 17 Creating and Editing Web Site Structure A site consists of several pages linked together in an organized way to present information in an ordered way. Using SiteBuilder, you can arrange the pages in the two levels of hierarchy - toplevel pages and second-level pages. Therefore, before this stage you must clearly understand how you intend to structure your site. Note: The maximum number of top-level and second-level pages you can create using SiteBuilder is 60 (6 top-level pages and 10 second-level pages). This is the limit of the SiteBuilder application. In addition, the total number of pages you can add is also limited by the business plan defined either by the SiteBuilder administrator or a reseller. In the figure below, the maximum number of pages allowed by the business plan is 10 (see this message in the navigation pane on the Pages tab). If you want to add more pages than allowed by your plan, please contact the SiteBuilder administrator or reseller. To facilitate working with SiteBuilder, HTML pages are grouped as pre-defined sets of pages, which are different for various types of sites (business, personal, or other). Depending on the purpose and functionality of your future site, you can use a ready-to-use page set and modify it to adjust the structure of your site to your needs. There are six types of sites available in the current version of SiteBuilder: Blog Business Personal Basic PhotoGallery Service Company Special pages are pages not included in the selected type of site, but which can also be added to your site structure. Besides editing the structure of your site, you can adjust two additional parameters of web pages composing your site: Interface language. This option enables you to select the language of your site pages content and modules interface. The language of the SiteBuilder application remains the same as you specified on the Overview page. Standards and formats. This option enables you to set a certain format of displaying numbers, currencies, dates, and times.

18 Creating Web Site 18 To add pages to your site Figure 4: Creating and Editing Web Site Structure 1 Select a web page set from the Types of sites available list. A set of pages for the selected type appears in the Standard pages box. 2 Choose the pages you want to add to your site by selecting the corresponding check boxes. 3 Select additional modules from the Special Pages box. This type of modules are called page modules, since they are presented as separate web pages and can not be inserted in the site content. 4 Click to add the selected pages to your site structure. Edit your site structure using the buttons next to the Your site structure box. To edit a page title, select the page in the Your site structure box and click Rename. To delete a page, select it in the Your site structure box and click To move a page up or down at the same level, select it in the Your site structure box and click Up or Down respectively. To move a page from the second level to the top level, select it in the Your site structure box and click Left. To move a page from the top level to the second level in the structure, select it in the Your site structure box and click Right. Click Next to go to Edit page.

19 Creating Web Site 19 Creating and Editing Web Site Content The SiteBuilder application is empowered with a user-friendly WYSIWYG (What You See Is What You Get) content editor, which enables you to see the content on the display screen exactly as it appears on the Internet. The SiteBuilder editor is organized in such a way that the information you type on pages and the design of pages are independent. Therefore, you can completely change the design for a page after you have typed a text on this page. You will not have to retype the information. Figure 5: Creating and Editing Web Site Content The interface of the SiteBuilder editor is familiar to users who have had a previous experience with the Microsoft Office application bundle. The editor main window consists of the following parts: The Editor toolbar provides access to commands used to edit textual information. Figure 6: Editor Toolbar The Modules toolbar contains modules icons used to insert modules into HTML pages.

20 Creating Web Site 20 Figure 7: Modules Toolbar In the current version of SiteBuilder for Windows the following modules are available: Area Map Feedback RSS Reader Script Voting If you want to hide the list of available modules while editing site content, click beside the Available modules box. To open the Available modules box, click once again. These modules are block modules. You can insert block modules in the web pages, containing text. The Site map enables you to see the links to the different pages of your site. To open the Site Map box click located in the left part of the screen. To navigate to different pages of your site, click the corresponding links in Site map. In the Work area, you can add and edit the contents of your site. The Tag Properties button enables you to view and edit the HTML structure of the part of text where your mouse cursor is on. If the default size of the editor window is too small, click Full Screen, in the upper right part of the Pages screen, to enlarge the editor window to the full screen. In the Full Screen mode only editing web page is displayed without displaying shortcuts to other steps of SiteBuilder Wizard.

21 Creating Web Site 21 To return to the smaller SiteBuilder screen, click Normal View. Click Next to go to the Publish page. Editing Textual Information on Web Pages This subsection describes the ways to work with textual information on your web pages. You will learn how to format characters and paragraphs, cut, copy, paste text, insert images and links. Text content is required to be added to the Page module. This module is an ordinary empty web page. To insert the Page module 1 Click the Pages tab. 2 Select Page in the Special Pages dialog box. 3 Click to add the Page module to your site structure. 4 Click Next. 5 On the Edit tab, select the Page. After this you can add content on this web page.

22 Creating Web Site 22 Formatting Characters Using Editor toolbar, you can change the following parameters: Font Size Style Color Font Settings Special Symbols To apply formatting to a text Figure 8: Formatting Characters Toolbar 1 On the Edit page, select the web page where you want to edit the text. 2 Select the portion of the text you want to change (even one character will suffice). 3 Apply the necessary formatting options. Select a font from the Font list. Select the font size from the Size list. Select the style from the Paragraph Style list. Click Foreground color to choose the font color. Click Background color to choose the background color. Click Bold, Italic, Underline, Strikethrough to make the text bold, italic, underlined, or strikethrough respectively. Click Subscript or Superscript to make the text subscript or superscript respectively. Сlick Insert symbol to insert special symbols into the text, such as copyright character, letters of other alphabets, and other signs. Note: Use styles to apply a particular format to the selected text. This ensures that similar pieces of text are formatted in the same way, thus maintaining consistency throughout your site.

23 Creating Web Site 23 Formatting Paragraphs Paragraph indentation and alignment are the main parameters that define the position of a paragraph on a page. Indentation determines the distance of the paragraph from the left margin of the page. Alignment determines the orientation of paragraph edges. Using the SiteBuilder Editor toolbar, you can do the following: Increase or decrease the indentation of a paragraph. Make a paragraph left-aligned, center-aligned, right-aligned, or justified. In case of justified alignment, the text is spread evenly between the left and right margins of the page. Visually separate the logical parts of textual information using horizontal rules. To apply formatting to a paragraph 1 Select the text which you want to format. 2 Apply the following formatting commands. To align the text, click Justify Left, Justify Center, Justify Right, or Full Justify on the toolbar. To change the indentation of the selected text, click Increase Indent or Decrease Indent on the toolbar. To insert a horizontal rule, place a cursor in any place on the page and click Horizontal Ruler to insert the rule. To start a new paragraph click New Paragraph before the beginning of the new paragraph.

24 Creating Web Site 24 General Commands Using the SiteBuilder Editor toolbar, you can do the following: Cut, copy, and paste text from the clipboard. Undo the last action you have made or redo the last undone action. Search and replace text. Check spelling. Select the entire text of a page. To cut, copy or paste text, select the needed piece of the text and click Cut, Copy, or Paste respectively. To undo the last action, click action, click Redo. Undo. If you later decide that you do not want to undo the last To find the particular part of text in web page content 1 To search text, click Find and the Find and Replace dialog opens. 2 On the Find tab enter the text you want to find on the current web page in the Find field. 3 Indicate the area of the search, by selecting either one of the following radio buttons: Entire text. Entire text on the web page will be searched for indicated word or phrase. Selection only. Only selected part of the text will be searched for indicated word or phrase. 4 Indicate the direction of the search, by selecting either one of the following radio buttons: Up. The search is done in the upper part of the text, starting from the cursor position. Down. The searched is done in the lower part of the text, starting from the cursor position. 5 Select the method of the search, by selecting either one of the following command options: Match case. Match whole words only. 6 Click OK to start the search. 7 Click Find Next to look for the next mention of the word or phrase on the current web page.

25 Creating Web Site 25 Figure 9: Searching Text To find and then replace a word or phrase on the current web page 1 Click Find in the editor toolbar. 2 Click the Replace tab. 3 Enter the text you want to replace in the Find field. 4 Enter the replacement text in the Replace with field. 5 Click Replace to replace the text in the part of the text matching entry in the Find field. OR Click Replace All to replace the text, entered in the Find field, on the whole web page. To check spelling on the page 1 Click Spellchecker. Figure 10: Replacing Text

26 Creating Web Site 26 2 In the Not in dictionary field, a possible spelling mistake is shown. 3 If you are sure that the word found by the Check Spelling editor is not misspelled, click Ignore to ignore this part of the text OR Click Ignore All to ignore all parts of the text, containing this word. 4 If you want to replace the misspelled word with the word in the Suggestions field, click Change. OR Click Change All to change this word in all body of the text. Figure 11: Spell Checking

27 Creating Web Site 27 Inserting Images Using the SiteBuilder Editor toolbar, you can insert any images into web pages. To insert a picture 1 Place the mouse cursor on the place in your site, where you want to insert a picture. 2 Click Image Manager. The Image Manager dialog box opens. 3 Click Browse and select an image to upload. Note: 1. Maximum file size allowed 200KB. 2. File extensions allowed *.gif, *.jpg, *.jpeg, *.png, *.bmp 4 Click Open in the Browse dialog box. 5 If you want to overwrite if file with such name as image you are uploading exists, select the Over write if file with such name exists? option. 6 Click Upload. In the left dialog box the name of uploaded image is displayed. In the right dialog box you can preview the image by selecting its name in the left dialog box. 7 Click Insert. Figure 12: Inserting Images

28 Creating Web Site 28 Inserting Links Using the SiteBuilder editor, you can insert both internal and external links. Internal links point to other places of your site, taking the reader to related pages. External links pointing to other sites are often used to improve your site popularity and increase your site visitor traffic (the socalled link exchange). To insert a link 1 Select a text which you want to set as hyperlink. 2 Click Hyperlink Manager. The Hyperlink Manager dialog box opens. Figure 13: Inserting Links 3 In the URL field enter the web address which you want the link to point to OR From the Existing Anchor list select the anchor inserted in the current document. For detailed information regarding anchor see Inserting Anchor later in the guide (see page 30). Note: All the above mentioned fields must be filled out. Otherwise, a hyperlink will not be inserted. 4 To specify the text of the link fill in the Link text field. 5 Select the type of the link in the Type list. 6 Select the target for the link in the Target list. 7 Select the tooltip in the Tooltip field. 8 Tooltip is a text that will appear when the mouse cursor is placed over the hyperlink. 9 Enter the name of any predefined style in the CSS class field.

29 Creating Web Site Click OK. To edit an existing hyperlink 1 Select a hyperlink in the text. 2 Right-click the hyperlink to open the context menu. 3 Click Set Link Properties. 4 Change the hyperlink properties. 5 Click OK to save changes. To remove a hyperlink from the text 1 Select a hyperlink in the text. 2 Right-click the hyperlink to open the context menu. 3 Click Remove Link.

30 Creating Web Site 30 Inserting Anchor in Web Page The anchor function is very helpful if you have a very long web page. With this function you will provide the visitors of this page with the easy way to jump from one part of the page to another, i.e. the anchor is used for hyper links which lead to the same page or a particular place in another page. The anchor defines the destination, where a hyperlink must lead to. Then you can create a hyperlink that will point to that anchor. To insert an anchor 1 Place the cursor where you want to lead the link to. 2 Click Hyperlink Manager. 3 Click the Anchor tab. Figure 14: Inserting Anchors 4 Enter a unique name for the anchor. 5 Click OK. 6 Select some text or an image to create a hyperlink that will lead to the anchor. 7 Click Hyperlink Manager again. 8 Click the Hyperlink tab. 9 In the URL field, type # followed by the anchor name. OR From the Existing anchor menu you can select other anchor, if any were previously created in the text. 10 Change the Type to other. 11 Click OK.

31 Creating Web Site 31 Inserting Link link opens your default application and prompts your site visitor to send to the provided address. When creating link you can also specify the default subject for the message. To insert an link 1 Select a text which you want to set as an link. 2 Click Hyperlink Manager. 3 Click the tab. Figure 15: Inserting Links 4 Enter an address in the Address field. 5 In the Link text field, enter a text which will appear as the link. 6 In the Subject field, enter a text that will be the default subject of the message. 7 Select a CSS class from the CSS class list. CSS (Cascading Style Sheets) is a stylesheet language used to describe the presentation of a document written in a markup language. Its most common application is to style web pages written in HTML and XHTML. 8 Click OK.

32 Creating Web Site 32 Working with Tables This section describes how to work with tables. You will know how to insert tables, add and delete rows, columns and cells, merge and split cells, and drag tables to another location in your site content. Inserting Table Tables are used to organize textual and numerical information in a convenient and clear way. They represent even large amounts of textual information in an easy-to-read format. Tables consist of grids formed by rows and columns. On web pages, tables are often used as a formatting tool to maintain the size and proportion of page borders in all browsers and output formats. Borders can be made invisible and information in a table appears as formatted in a desired way. For example, this can be useful when organizing the text in several columns, like in a newspaper. You can insert the table in the site content, using the Insert Table dialog box. To insert a table 1 Place the cursor on the place in the site content, where you want to insert a table. 2 Click to open the Insert Table dialog box. 3 Select number of columns and rows in the table, using you mouse cursor, in the area above the Cancel button. Or you can customize the table you want to insert in the Table Wizard. To customize a table 1 Place the cursor where you want to insert a table. 2 Click Insert Table. The Insert Table dialog box appears. 3 Click Table Wizard. Figure 16: Inserting Table

33 Creating Web Site 33 Adding Rows and Columns You can add the table elements in two ways: To add the table element using the Insert Table dialog box. To add the table element using Table Wizard. To add a row to the table, using Insert Table dialog box 1 Place the cursor on the row next to which you want to add a new row. 2 Click Insert Table. 3 In the Insert Table dialog box, you can: Click to insert a row above the row, where you placed the cursor. Click to insert a row below the row, where you placed the cursor. To add a column to the table, using Insert Table 1 Place the cursor on the column next to which you want to add a new column. 2 Click Insert Table. 3 In the Insert Table dialog box, you can: Click to insert a column behind the column, where you placed the cursor. Click to insert a column in front of the column, where you placed the cursor. To add rows and columns in the Table Wizard 1 Place the cursor on the column next to which you want to add a new column. 2 Click Insert Table. 3 Click Table Wizard in the Insert Table dialog box. 4 Click [+] next to Columns or Rows to add row or column. 5 Click OK.

34 Figure 17: Adding Rows and Columns Creating Web Site 34

35 Creating Web Site 35 Removing Rows, Columns and Cells You can delete the table elements in two ways: To add the table element using the Insert Table dialog box. To add the table element using Table Wizard. To remove a row from a table, using Insert Table 1 Place the cursor on the row which you want to delete. 2 Click Insert Table. 3 Click Remove Row to remove a row, on which you placed the cursor. To remove a column from a table, using Insert Table 1 Place the mouse cursor on the column you want to remove. 2 Click Insert Table. 3 Click Remove Column to remove a column, on which you placed the cursor. To remove a cell from the table, using Insert Table 1 Place the cursor on the cell you want to remove. 2 Click Insert Table. 3 Click Delete Cell to delete a cell, on which you placed the cursor. To remove rows and columns in the Table Wizard 1 Place the cursor on the row or column which you want to remove. 2 Click Insert Table. 3 Click Table Wizard in the Insert Table dialog box. 4 Click [-] next to Columns or Rows to remove row or column. 5 Click OK.

36 Figure 18: Adding Rows and Columns Creating Web Site 36

37 Creating Web Site 37 Merging Cells You can merge cells in the table using either one of the following methods: To merge the cell using the Insert Table dialog box. To merge the cell using Table Wizard. To merge cells in the table using the Insert Table dialog box 1 Place the cursor on the cell which you want to merge with the cell to the right. 2 Click Insert Table. 3 Click Merge Cells Horizontally to merge the cell on which you placed mouse cursor with the cell to the right. OR Click Merge Cells Vertically to merge the cell on which you placed mouse cursor with the cell above. To merge cells using Table Wizard 1 Place the cursor on the cell which you want to merge with another cell. 2 Click Insert Table. 3 Click Table Wizard in the Insert Table dialog box. 4 Click [+] next to Column Span to merge the right cell with the cell you have selected. OR Click [+] next to Row Span to vertically merge the cell you have selected. 5 Click OK.

38 Figure 19: Adding Rows and Columns Creating Web Site 38

39 Creating Web Site 39 Splitting Cells You can split cells in the table using either one of the following methods: To split a cell using the Insert Table dialog box. To split a cell using Table Wizard. To split a cell in the table using the Insert Table dialog box 1 Place the cursor on the cell which you want to split with the cell to the right. 2 Click Insert Table. 3 Click Split Cell. To split a cell using Table Wizard 1 Place the cursor on the cell which you want to split. 2 Click Insert Table. 3 Click Table Wizard in the Insert Table dialog box. 4 Click [-] next to Column Span to split the cell to the left. OR Click [-] next to Row Span to vertically split the cell you have selected. 5 Click OK. Figure 20: Adding Rows and Columns

40 Creating Web Site 40 Formatting Tables To set the table properties 1 Go to the Table Properties from the Table Wizard. In order to use Table Wizard, do the following: 1. Click Insert Table. The Insert Table dialog box appears. 2. Click Table Wizard. 3. Click Table Properties. Note: The above described method of formatting table is used prior to inserting the table. 2 Or right-click inside the table and select Table Properties from the context menu. Note: Second method is used after the table was inserted in the web page. 3 In the Table Properties, set the following properties: Width/Height. Specify the width and height of the table (in pixels or percent). Background. Set the background of the table. Alignment. Align the table to the left, center or the right part of the page. Cell spacing. Increase or decrease the space between the borders of the cells. Cell padding. Increase or decrease the space between the content and the border of a cell. Border. Set cell border width, color and layout. ID. Setting ID for a table provides some options for advanced table handling. Background Image. Set an image as the table background. CSS Class. Specify table CSS class and style. CSS class is the predefined style which is applied to the selected text. Note: CSS Class is the option for advanced users only. 4 Click OK.

41 Creating Web Site 41 Figure 21: Formatting Tables Formatting Tables with CSS Classes CSS class provides easy and consistent way for formatting the tables. To use CSS class 1 Create a table. This process is described in detail in Inserting Table (see page 32), earlier in this guide. 2 Open the Table Properties dialog box. 3 Select a CSS class from the CSS Class list in the Table Properties dialog box. 4 Click OK.

42 Creating Web Site 42 Formatting Cells To configure the parameters of your table cells 1 Go to the Cell Properties from the Table Wizard. To format cell using Table Wizard, do the following: 1. Click Insert Table. The Insert Table dialog box appears. 2. Click Table Wizard. 3. Click Cell Properties. Note: The above described method of formatting table is used prior to inserting the table. 2 Or right-click inside the cell and select Cell Properties from the context menu. Note: The second method is used after the table was inserted in the web page. 3 On the Cell Properties tab, set the following properties: Width/Height. Specify the width and height of the selected cell (in pixels or percent). Content alignment. Align the content in the selected cell (vertically or horizontally). Background. Set the background color of the cell. Background image. Set an image as the background of the cell. Content. Specify default content for the cell. You can input content after you have inserted the table as well. ID. Setting ID for a cell provides options for advanced cell handling (for advanced users and developers). No wrapping. Enable/disable cell wrapping (i.e. if enabled, it forces new line when the text reaches the cell border). CSS class. Specify cell CSS class and style. CSS class is the predefined style which is applied to the selected text. 4 Click OK.

43 Figure 22: Formatting Cells Creating Web Site 43

44 Creating Web Site 44 Making Tables Available for Users with Impaired Vision MS Windows OS include tools that help users with impaired vision to use same programs as regular users do. In order to generate content that can be interpreted by the Accessibility Tools integrated in MS Windows (such as the Narrator, the Magnifier, and the On-Screen Keyboard) Table Wizard includes additional field called Accessibility. The Narrator uses the information from the Accessibility table fields (heading rows, columns, caption alignment, and summary) to produce Tooltip message for each table cell. Users with impaired vision can hear those Tooltips as they hover over these cells with their mouse cursor. To make the table available for users with impaired vision 1 Insert a table or open Table Properties dialog box. (See Inserting Table (see page 32), earlier in the guide.) 2 Click the Accessibility tab. Figure 23: Making Tables Available for Users with Impaired Vision 3 Select Caption Alignment. 4 Fill in the following fields: Heading rows Heading columns Caption Summary 5 Select the Associate cells with headers check box. 6 Click OK.

45 Creating Web Site 45 Dragging Tables You can move a table all along the web page using a simple drag-and-drop operation. To move a table 1 Point the cursor at a table. 2 Drag the table to the desired location and drop it. Figure 24: Dragging Tables

46 Creating Web Site 46 Configuring Tag Properties In SiteBuilder, textual and tabular information on your web pages is automatically converted into the HTML code. HTML, which stands for HyperText Markup Language, is a standardized language for presenting information, graphics, and multimedia on the World Wide Web. Using the Tag Properties feature, you can easily apply different styles and change properties of selected elements. At the bottom of the SiteBuilder editor window you can see the panel displaying the HTML structure of the line, on which your mouse cursor is now placed. For example, if you place the mouse cursor in a table, the HTML code structure will contain the following tags: TABLE, TBODY, TR, TD. The tag where the cursor is now is shown in bold. To edit tag properties 1 Place your mouse cursor in the line you want to edit and click the tag name. 2 Click Tag Properties. The Tag properties dialog box opens. In this dialog box, you can change the following properties: For TABLE (Table), you can adjust cell spacing, cell padding, table width and height, table and cell alignment, and define the style of borders. For TR (Table Row) and TD (Table Data) tags, you can enter the width and height of table cells and rows and alignment patterns. For A (Link), you can change the link path, link text, target pages, decoration in the text. For UL (Unordered List), you can change the style of bullets. For OL (Ordered List), you can change the style of numbers in the list. For HR (Horizontal Rule), you can adjust the width and height of the horizontal rule. For IMG (Image), you can edit the image title and alternate text, image width and height, and alignment. 3 Click OK. The changes will be immediately applied in the editor screen.

47 Creating Web Site 47 Using SiteBuilder Modules In SiteBuilder, there are two types of modules: Page modules. These modules can be placed only on separate web pages. They cannot be inserted in the web page content. There are the following page modules in the current version of SiteBuilder: Blog eshop Flash-Intro Forum Guestbook Image gallery Login The page modules are located on the Pages tab, in the Special pages box. You add them as regular site pages to the structure of your site. For more detailed information about editing site structure, see Creating and Editing Web Site Structure earlier in the guide (see page 17). Block modules. SiteBuilder modules, which can be placed on the same web page where the other text content is located. There are the following block modules in the current version of SiteBuilder: Area Map Feedback Forms Constructor RSS Reader Script Voting The block modules are located on the Edit tab, in the Available modules box. To insert a block module to a page, click the module icon and drag it to the page where you want to insert the module. General rules for working with block modules: You can add any number of block modules on each page. The modules cannot be viewed directly on the Edit tab. You can only configure page modules on the Edit tab. To preview the modules as they will be displayed in browser windows, click Preview Web Site. Your site will open in a new browser window with all elements displayed. To delete a block module from the page, click Remove Module on the block module dialog box.

48 Creating Web Site 48 Using Blog Editor Blog is short for web log. A web log is a web journal that is used as a publicly accessible personal diary or journal of an individual. Usually, blogs are frequently updated and reflect the personality of the author (a good example of blogs is the so-called Live Journals). Using the SiteBuilder Wizard, you can insert a blog on your web page. To insert the Blog module 1 Click the Pages tab. 2 Select Blog in the Special Pages dialog box. 3 Click to add Blog module to your site structure. 4 Click Next. To configure the Blog module 1 Click the Edit tab. 2 Click Blog on the Edit tab. OR Click Blog shortcut in the Site Map located in the left part of the SiteBuilder Wizard screen. Figure 25: Using Blog Editor On the Categories tab you can Add new blog category (see page 50) Edit blog category (see page 51) Remove blog category (see page 51) On the Content tab you can Add new blog entry (see page 52)

49 Creating Web Site 49 Edit blog entry (see page 53) Remove blog entry (see page 53) On the Settings tab you can Set maximum number of entries per blog page (see page 54) Set maximum number of comments per page (see page 54) Set post summary truncation limit (see page 54) You can preview blog module by clicking Preview located at the bottom of every SiteBuilder Wizard screen.

50 Creating Web Site 50 Adding New Category in Your Blog To add new category to the Blog module 1 Click the Edit tab. 2 Click Blog on the Edit tab. OR Click Blog shortcut in the Site Map located in the left part of the SiteBuilder Wizard screen. 3 Click Add New Category on the Categories tab. Figure 26: Configuring New Category Main Properties 4 On the Main Properties tab, enter a name of the new category in the Name field. 5 Select a category position from the Position in list list. 6 Go to the Description tab and enter the new category description. You can use editor toolbar described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 7 Click OK. Figure 27: Providing New Category Description

51 Creating Web Site 51 Editing Blog Category To edit a blog category 1 Click the Edit tab. 2 Click Blog on the Edit tab. 3 On the Categories tab, click Edit icon in the Edit column beside the category you want to edit. 4 Edit category name on the Category tab. 5 Select new position from the Position in the list list to change the category position in the list of categories. 6 Click the Description tab. 7 Edit category description on the Description tab. 8 Click OK. Removing Category To remove a blog category 1 Click the Edit tab. 2 Click Blog on the Edit tab. 3 On the Category tab, select a category you want to remove. 4 Click Remove Selected.

52 Creating Web Site 52 Adding New Entry To add a new entry 1 Click the Edit tab. 2 Click Blog on the Edit tab. 3 Click the Content tab. 4 On the Content tab, click Add New Entry. 5 Enter entry title in the Title field. Figure 28: Adding New Entry Note: If you do not enter a title for the entry, the entry will not be added to the blog. 6 Enter the new entry text in the Content field. You can use editor toolbar described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 7 Click the Categories tab. Figure 29: Selecting New Entry Category 8 On the Categories tab, select the blog category you want this entry to be assigned to. 9 Click OK.

53 Creating Web Site 53 Editing Blog Entry To edit an existing blog entry 1 Click the Edit tab. 2 Click Blog on the Edit tab. 3 On the Content tab, click Edit icon in the Edit column beside the entry you want to edit. 4 On the Message tab, edit entry title in the Title field. 5 Edit the entry content in the Content area of the Message tab. You can use editor toolbar, described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 6 If you want to change entry category, click the Categories tab. 7 Deselect the present category to which current entry is assigned. 8 Select new category for the entry. 9 Click OK. Removing Blog Entry To remove a blog entry 1 Click the Edit tab. 2 Click Blog on the Edit tab. 3 Click the Message tab. 4 On the Message tab, select an entry you want to remove. 5 Click Remove Selected.

54 Creating Web Site 54 Configuring Blog Settings To configure the blog settings 1 Click the Edit tab. 2 Click Blog on the Edit tab. 3 Click the Settings tab. Figure 30: Configuring Blog Settings 4 Enter the maximum number of blog entries per page in the Messages per page field. 5 Enter the maximum number of comments per page in the Comments per page field. 6 Enter maximum number of symbols a post summary can contain in the Post summary truncation limit field.

55 Creating Web Site 55 Creating Your eshop To create a professional and profitable e-commerce store, you do not need any programming or site design skills because all you do is to point and click. SiteBuilder eshop module is easy to configure and use. You, as an e-shop owner, can create categories of products, add products to the categories, and manage users who will be able to purchase the products online. Customers browse your e-shop, add products to their shopping carts, and submit their orders. They register at the store online so that they can later return to their shopping carts and continue shopping. Your e-commerce resource can be integrated with the PayPal payment processing system so that customers can pay for their purchases using their credit cards. If you do not want to accept credit card payments, the orders made through your online store will be saved in the E-shop Management System, from where you can view customers' contact information and handle orders. The sections below describe in detail how to create and manage a fully-functional web-based online store. You can view e-shop orders in SiteBuilder Administrator Panel. For more detailed information regarding viewing e-shop orders see SWsoft SiteBuilder 3.1 for Windows Site Owner's Guide (available herehttp:// To insert the eshop module 1 Click the Pages tab. 2 Select eshop in the Special Pages dialog box. 3 Click to add the eshop module to your site structure. 4 Click Next. To configure the eshop settings 1 Click the Edit tab. 2 Click eshop. Figure 31: Creating Your eshop

56 Creating Web Site 56 On the eshop screen you can do the following operations: Add a new category (see page 57) Add a new product (see page 60) Configure payment method (see page 63) Configure eshop settings (see page 65)

57 Creating Web Site 57 Managing Categories You can perform the following operations on the Categories tab: Add a category Remove a category Edit a category Move a category up and down the category list Adding new category To load your online store with goods, you first need to create categories. Then, add products and their pictures to the existing categories. To add categories to the eshop 1 Click the Edit tab. 2 Click eshop on the Edit tab. 3 Click Add category on the Categories tab. Figure 32: Configuring New Category Main Properties 4 Enter a name of the new category in the Name field. 5 Select position number for this category from the Position in list list. 6 Click the Image tab to upload an image for the new category. Figure 33: Uploading Image for New Category 7 Click Browse. 8 In the Browse window, select image file on your computer.

58 Creating Web Site 58 9 Click Open. 10 Click Upload to upload category image. The uploaded image is displayed in the Preview area of the Image tab. 11 Click the Description tab. Figure 34: Providing New Category Description 12 Enter the category description on the Description tab. You can use editor toolbar described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 13 Click OK. Removing category To remove category 1 Click the Edit tab. 2 Click eshop. 3 Select a category you want to remove. 4 Click Remove Selected. Editing category To edit a category 1 Click the Edit tab. 2 Click eshop on the Edit tab. 3 On the eshop screen, click Edit icon beside the category you want to edit. 4 Edit category name in the Category name field. 5 Select new category position from the Position in list list. 6 Click the Image tab to replace the category image. 7 Click Delete to delete current category image. 8 Click Browse. 9 In the Browse window, select new category image on your computer. 10 Click Open. 11 Click Upload.

59 Creating Web Site Click the Description tab to edit current description of the category. You can use editor toolbar, described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 13 Click OK. Moving a category in the list of available categories To move a category up the list of available categories, click category on the eshop screen. To move a category down the list of available categories, click category on the eshop screen. Move Up icon beside this Move Down icon beside this

60 Creating Web Site 60 Managing Products You can manage products sold in the eshop on the Products tab of the eshop module. On the Products tab you can perform the following operations: Add product Remove product Edit product Move product up and down the list of available products Adding product After you have created the new category, add a new product to assign it to this category. To create a new product 1 Click the Edit tab. 2 Click eshop. 3 Click the Products tab. 4 On the Products tab, click Add New Product. Figure 35: Configuring New Product Main Properties 5 On the Main Properties tab, enter the following data: Name is the name of the product. Price is the product's price. Note: It is required to fill in both fields listed above, otherwise product will not be added. Position in list is a product position in the list of products. 6 Click the Image tab to upload image of the product.

61 Creating Web Site 61 Figure 36: Uploading Image for New Product 7 On the Image tab, click Browse. 8 In the Browse window, select product image file on your computer. 9 Click Open. 10 After you have selected image file, click Upload. Uploaded product image is displayed in the Preview area of the Image tab. 11 Click the Description tab. Figure 37: Providing Description for New Product 12 On the Description tab, enter product description. You can use editor toolbar described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 13 Click the Categories tab to assign new product to the category. Figure 38: Selecting Category of New Product

62 Creating Web Site Select a category to which you want to assign the new product. 15 Click OK.

63 Creating Web Site 63 Choosing Payment System You can choose payment system that will be used by the customers visiting your eshop on the Payments Systems tab. To select a payment system 1 Click the Edit tab. 2 Click eshop on the Edit tab. 3 Click the Payments Systems tab. Figure 39: Choosing Payment System 4 On the Payment Systems tab, choose one of the following payment systems: Cash on delivery. Payment is made, when product is delivered to a customer. Check/Money order. Customer issues check or money order that will be sent to you by regular mail. PayPal. Customer pays you for the product online using PayPal payment system. 5 To choose cash on delivery payment system, select the Cash on delivery option. 6 To choose check or money order 1. Select the Check/Money order option. 2. In the Make payable to field, enter the name of the company to which the money orders or checks will be sent. 3. In the Send to address field, enter the mail address of the company that will receive checks or money orders. 7 To choose PayPal payment system 1. Select the PayPal option.

64 Creating Web Site In the address field, enter your PayPal address to where PayPal payments should be sent. Note: To accept payments online, you can integrate the PayPal payment processing system into your online store. Online shoppers will be able to pay for their purchases using credit cards directly from your web page. If you, as a store owner, want to accept credit card and bank account payments from shoppers, use the integrated PayPal payment system at your online store. For this, you should have a merchant account at PayPal. Therefore, register at PayPal. On the official PayPal web site ( you can find more information about PayPal services for online store owners. 8 Select currency from the Currency list. 9 Click OK.

65 Creating Web Site 65 Configuring eshop Settings To configure your eshop settings 1 Click the Edit tab. 2 Click eshop. 3 Click the Settings tab. Figure 40: Configuring eshop Settings 4 On the Settings tab, configure the following eshop settings: Number of rows on Categories page, in this field indicate how many rows per page should be displayed on the Categories page. Number of columns on Categories page, in this field indicate how many columns per page should be displayed on the Categories page. Sort field on Products page, in this list you should choose by what field the products list will be sorted on the Products page (Name, Position in list, or Price). Sort order on Products page, in this field select the type of sort order should be applied to sort the products list (Ascending or Descending). Number of rows on Products page, in this field indicate what number of rows per page should be displayed on the Products page. Number of columns on Products page, in this field indicate how many columns per page should be displayed on the Products page. 5 Click OK.

66 Creating Web Site 66 Inserting Flash Intro Flash Intro is the Flash-animated introduction clip launched prior to opening of the first page of the published site. This is a page type module and it is added in the Edit tab. To insert the Flash Intro module 1 Click the Pages tab. 2 Select Flash Intro in the Special pages dialog box. 3 Click to add Blog module to your site structure. 4 Click Next. To configure Flash Intro settings 1 Click the Edit tab. 2 Scroll down the Edit screen and click Flash Intro, located at the bottom of the Edit screen. Figure 41: Inserting Flash Intro 3 On the Flash Intro screen, configure the following parameters: Header text is the text displayed as the flash introduction title. Body text is the text displayed as the body of Flash introduction clip. Background scheme is the Flash Intro background color scheme. Object scheme is the Flash Intro layout color scheme.

67 Creating Web Site 67 4 Click Apply. After you click Apply on the Flash Intro screen, you will see the small preview image of the Flash Intro with new parameters in the Preview area of the screen. You can view Flash Intro module on the Publish tab. If you want to skip Flash Intro, click Skip Flash Intro on the Publish tab.

68 Creating Web Site 68 Using Forum Editor To improve the quality of your services and know the opinion of your customers and visitors on different matters, you can provide an online forum on your web page. Online forums are webbased message boards where visitors can open new topics, post topic-relevant messages, and discuss a wide range of questions. To insert the Forum module 1 Click the Pages tab. 2 Select Forum in the Special pages dialog box. 3 Click to add the Forum module to your site structure. 4 Click Next. To configure the Forum module settings 1 Click the Edit tab. 2 Click Forum on the Edit screen. Figure 42: Using Forum Editor On the Edit screen, the following information regarding the Forum module is displayed: # is the number of category. Name is the category name. Topics is a number of topics in the category. Replies is a number of replies in the category. On the Categories tab, you can perform the following operations: Add a new category Edit an existing category Remove a forum category

69 Creating Web Site 69 Adding new category To add a new category in the forum 1 Click Add New Category on the Categories tab. Figure 43: Configuring New Category Main Properties 2 Enter a name of the new category in the Name field. 3 Click the Description tab. Figure 44: Providing Description for New Category 4 Enter the new category description on the Description tab. You can use the editor toolbar, described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 5 Click OK. Editing forum category To edit a forum category 1 On the Categories tab, click Edit icon in the Edit column beside the category you want to edit. 2 Edit the name of the category in the Name field. 3 Click the Description tab to edit description of the category. 4 Edit description of the category. You can use the editor toolbar, described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 5 Click OK.

70 Creating Web Site 70 Removing forum category To delete a forum category 1 On the Categories tab, select the forum category you want to delete. 2 Click Remove Selected. The forum category you selected will be removed from the forum.

71 Creating Web Site 71 Configuring Forum Content On the Content tab, you can perform the following operations: Create a new topic Edit a topic Remove a topic To create a new topic 1 Click Forum on the Edit tab. 2 Click the Content tab. 3 Click Create New Topic. Figure 45: Configuring New Topic Main Properties 4 On the Main Properties tab, enter the name of new topic in the Name field. 5 Click the Content tab. Figure 46: Configuring New Topic Content 6 On the Content tab, enter topic content. You can use editor toolbar described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 7 Click the Categories tab. Figure 47: Selecting Category of New Topic

72 Creating Web Site 72 8 Select the category, where you want to create the topic. 9 Click OK. To edit a forum category 1 Click Forum on the Edit tab. 2 Click the Content tab. 3 Click Edit icon in the Edit column beside the topic you want to edit. 4 Edit the topic name in the Name field. 5 Click the Categories tab. 6 Select the category containing the topic you are editing. 7 Click OK. To remove a topic 1 Click Forum on the Edit tab. 2 Click the Content tab. 3 Select the topic you want to remove. 4 Click Remove Selected. Configuring Forum Settings To configure forum settings 1 Click Forum on the Edit tab. 2 Click the Settings tab. 3 On the Settings tab you can configure the following settings: Maximum number of categories per page Maximum number of topics per page Maximum number of replies per page Maximum number of search results per page Figure 48: Configuring Forum Settings

73 Creating Web Site 73 Using Guestbook On a guestbook page, your visitors will be able to leave their notes, messages, and comments. The main difference between guestbooks and online forums is that in forums, all messages are grouped in threads, or topics. In guestbooks, all messages are displayed in the order they were submitted. To insert the Guestbook module 1 Click the Pages tab. 2 Select Guestbook in the Special pages dialog box. 3 Click to add the Guestbook module to your site structure. 4 Click Next. To configure the Guestbook module settings 1 Click the Edit tab. 2 Click Guestbook on the Edit tab. Figure 49: Using Guestbook On the Guestbook screen, the following information about the Guestbook module is displayed: # is the guestbook comment number. Comment is the content of the guest comment. Posted on is the date when the comment was posted. You can perform the following operations with the Guestbook module: Configure guestbook content (see page 74) Configure guestbook settings (see page 75)

74 Creating Web Site 74 Configuring Guestbook Content You can perform the following operations with guestbook messages: Add a new message Edit a message Delete a message To add a new message to the guestbook 1 Click the Edit tab. 2 Click Guestbook on the Edit tab. 3 Click Add New Message on the Content tab. Figure 50: Adding New Message 4 Enter new message on the Add New Message screen. You can use editor toolbar described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 5 Click OK. To edit a guestbook message 1 Click Guestbook on the Edit tab. 2 Click Edit icon in the Edit column beside the message you want to edit. 3 Edit the guestbook message. You can use editor toolbar described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 4 Click OK. To remove a message from the guestbook 1 Click Guestbook on the Edit tab. 2 Select the message you want to remove. 3 Click Remove Selected.

75 Creating Web Site 75 Configuring Guestbook Settings You can configure guestbook settings on the Settings tab of the Guestbook screen. To configure the Guestbook module settings 1 Click the Edit tab. 2 Click Guestbook on the Edit tab. 3 Click the Settings tab. 4 On the Settings tab, configure the following settings: Message lifetime (in days) Page size (in lines) Show author Figure 51: Configuring Guestbook Settings

76 Creating Web Site 76 Using Image Gallery Pages Using SiteBuilder, you can add image gallery pages to your site, which are optimized for presentation of any kind of images. To insert the Image Gallery module 1 Click the Pages tab. 2 Select Image Gallery in the Special pages dialog box. 3 Click to add Image Gallery module to your site structure. 4 Click Next. To configure the Image Gallery module settings 1 Click the Edit tab. 2 On the Edit tab, click Image gallery. Categories in the image gallery module were implemented in case when a user has too many images in the gallery and wants to divide them into groups. Each category will be the group of pictures in the image gallery. Several categories may contain the same images. Figure 52: Using Image Gallery Pages On the Categories tab you can perform the following operations: Add new category (see page 78) Edit category properties (see page 80) Remove category (see page 80) You can also preview category image by clicking Preview icon the category's row. located in the P column of

77 Creating Web Site 77 On the Images tab you can perform the following operations with images: Add new image (see page 81) Edit image properties (see page 83) Remove image (see page 83) To preview image file, click Preview icon located in the P column of the image's row. On the Settings tab, you can configure the Image Gallery module settings. To change the Image Gallery module settings 1 Click the Settings tab on the Image Gallery screen. Figure 53: Configuring Image Gallery Settings 2 Change the following settings: Number of columns on the Categories page. Number of rows on the Categories page. Number of columns on the Images page Number of rows on the Images page

78 Creating Web Site 78 Adding New Category To add a new category 1 Click the Edit tab. 2 On the Edit tab, click Guestbook. 3 Click Add New Category. Figure 54: Configuring New Category Main Settings 4 On the Main Properties tab, enter the following parameters: Name is a name of the new category Position in list is a category position in the list of categories in the Image Gallery module. 5 Click the Image tab to upload new image representing this category. Figure 55: Uploading Image for New Category 6 On the Image tab, click Browse. 7 In the Browse window, select image file on your computer. 8 Click Open. The Uploaded image is displayed in the Preview area of the Image tab. 9 Click Upload. 10 If you decided to remove the uploaded image, click Delete. 11 Click the Description tab.

79 Creating Web Site 79 Figure 56: Providing Description for New Category 12 On the Description tab, enter the Image Gallery category description. You can use the editor toolbar described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 13 Click OK. To move a category up the list of available categories, click category on the Categories tab. To move a category down the list of available categories, click category on the Categories tab. Move Up icon beside this Move Down icon beside this

80 Creating Web Site 80 Editing Category To edit a category of the image gallery 1 Click the Edit tab. 2 On the Edit tab, click Image Gallery. 3 Click Edit icon in the Edit column beside the category you want to edit. 1 On the Main Properties tab, edit the following parameters: Category name Category position in the category list 4 Click the Image tab. 5 Click Delete to delete image. 6 Click Browse. 7 In the Browse window, select an image file. 8 Click Open. 9 Click Upload. 10 Click the Description tab. 11 Edit the category description. You can use the editor toolbar described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 12 Click OK. Removing Category from Image Gallery Module To remove a category from the image gallery 1 Click the Edit tab. 2 On the Edit tab, click Image Gallery. 3 Select the category, you want to remove. 4 Click Remove Selected.

81 Creating Web Site 81 Adding New Image All operations with images are performed on the Images tab of the Image Gallery module. In order to access the Images tab, click the Images tab on the Image Gallery screen. The following information regarding image files contained in the Image Gallery module is available on the Images tab: # is the image number. Name is the image name. Categories indicates to what category this image belongs. To add a new image 1 Click Add New Image. Figure 57: Managing Images Figure 58: Configuring New Image Main Properties 2 On the Main Properties tab, enter an image title in the Name field. 3 Select image position in the list of images from the Position in list list. 4 Click the Image tab.

82 Creating Web Site 82 Figure 59: Uploading New Image 5 On the Image tab, click Browse. 6 In the Browse window, select an image file on you computer. 7 Click Open. The uploaded image is displayed in the Preview area of the Image tab. 8 Click Upload. 9 Click Description tab. Figure 60: Providing Description for New Image 10 On the Description tab, enter a description of the image. You can use the editor toolbar, described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 11 Click the Categories tab. Figure 61: Selecting Category for New Image

83 Creating Web Site One the Categories tab, select the category to which you want to assign new image. 13 Click OK. Editing Image Properties To edit a category of the image gallery 1 Click the Edit tab. 2 On the Edit tab, click Image Gallery. 3 Click the Images tab. 4 Click Edit icon in the Edit column beside the image you want to edit. 5 On the Main Properties tab, edit the following parameters: Name is an image name Position in list is image position in the list of images 6 Click the Image tab. 7 Click Delete to delete image. 8 Click Browse. 9 In the Browse window, select an image file. 10 Click Open. 11 Click Upload. 12 Click the Description tab. 13 Edit category description. You can use the editor toolbar, described in Editing Textual Information on Web Pages earlier in the guide (see page 21). 14 Click the Description tab. 15 On the Description tab, select the new category to which you want to assign the image. 16 Click OK. Removing Image To remove an image from the image gallery 1 Click the Edit tab. 2 On the Edit tab, click Image Gallery. 3 Click the Images tab. 4 Select the image, you want to remove. 5 Click Remove selected.

84 Creating Web Site 84 Inserting Login Page Login module allows to authenticate users and manage their accounts. After you inserted the Login module into your site, you can manage your registered site users via SiteBuilder Administrator Panel. For more information regarding site users management, see SWsoft SiteBuilder 3.1 for Windows Site Owner's Guide. To insert the Login module 1 Click the Pages tab. 2 Select Login in the Special pages dialog box. 3 Click to add Image gallery module to your site structure. 4 Click Next. To configure the Login module 1 Click the Edit tab. 2 On the Edit tab, click Login. Figure 62: Inserting Login Page By default two options are enabled on the Login screen: Password remember provides site user with possibility of accessing your site without entering user's password per each visit. Registration is option for registering users on your site. 3 On the Login screen you can disable these options: Click Disable option beside Password remember. Click Disable option beside Registration. 4 Click OK.

85 Creating Web Site 85 Using Area Map Module Area Map module displays map of every geographical location and can be used for showing company's location and any other geographical location that will be of interest to every site visitor. If there are more than one geographical location with the same name, you can choose from the list of these location the location to be displayed. In order to receive geographical maps and location names, purchase Microsoft MapPoint Web Service. There are the following methods of licensing such service: 1 Purchasing Map Point Web Service through a direct agreement with Microsoft. If you choose this method, you purchase one license per each Area Map module, added to your sites. 2 Purchasing Map Point Web Service through Microsoft Volume Licensing. IF you choose this method, you purchase one license for all Area Map modules, added to all your sites. To insert the Area Map module to your site 1 Click the Edit tab. 2 Click the Area Map module located in the Available modules area. 3 Keep pressing left mouse button and drag Area Map module icon to the web page, on which you want to place the module. To configure the Area Map module properties 1 Click Configure located in the Area Map module area on the Publish tab. 2 If you have purchased Microsoft Map Point Service 1. Enter your Microsoft Map Point Service user name in the User name field. 2. Enter your Microsoft Map Point Service password in the Password field. Note: Both the above listed fields should be filled out in order to login to Microsoft Map Point Service, otherwise operation will fail with an error. 3. Click Login to MS Map to login to Microsoft Map Point Service. 3 If you did not purchase Microsoft Map Point Service, click Click here to go to Microsoft site if you do not have such credentials. You will be directed to the Microsoft Map Point Service page, located on the official Microsoft site to read instructions on purchasing Microsoft Map Point Service. After you purchase Microsoft Map Point Service, you will receive Microsoft Map Point Service credentials, i.e. login and password. 4 Enter your Microsoft Map Point Service user name in the User name field. 5 Enter your Microsoft Map Point Service password in the Password field.

86 Figure 63: Using Area Map Module Creating Web Site 86

87 Creating Web Site 87 Constructing Feedback Forms Online feedback forms are used to create registration forms and send this information to the specified address. To insert the Feedback module to your site 1 Click the Edit tab. 2 Click the Feedback module located in the Available modules area. 3 Keep pressing left mouse button and drag the Feedback module icon to the web page, on which you want to place the module. 4 To see the Feedback module as it will be presented on the published site, click Next. To configure the Feedback module properties 1 Click Configure in the Feedback module area on the Edit tab. Figure 64: Constructing Feedback Properties 2 On the Properties tab, configure the following properties: Feedback form title is a name of the feedback form that will be available on your site. address the feedback form should be sent to is an to which your site visitors send their feedbacks. Subject for the feedback form is a subject of feedback s that will be sent by your site users to the address indicated above. Response text to be displayed once a visitor has successfully submitted the feedback form is a text displayed to a site user after this user sends the feedback.

88 Creating Web Site 88 3 Click OK. On the Fields tab, the following information about feedback form fields is available: S is a status of a field. Active icon next to a field means that this field is displayed in the feedback form. the feedback form. Inactive icon next to the field means that this field is not displayed in R column shows whether the field is required for filling out or optional. If there is Active icon next to the field, this field is required for filling out. Inactive icon next to the field indicates that this field is optional. Name is a field name. Type is a type of data that can be entered in the corresponding field. Records total is a total number of fields in the feedback form. Figure 65: Configuring Feedback Form Fields On the Fields tab you can do the following: Adding new fields to the feedback form Disabling or enabling the feedback form fields Making required or optional fields in the feedback form Selecting the type of data that can be entered in the corresponding field. Moving fields up and down in the feedback form.

89 Creating Web Site 89 To add new field in the feedback form 1 On the Fields tab, click Add New Field. 2 Replace New Field name with the new name. Note: By default new field is always inactive, i.e. it is not displayed in the feedback form and it is optional for filling out. 3 In order for the new field to be displayed in the feedback form in the S column, click Inactive icon next to the new field. Note: If in the S column you click Active icon next to the field, it becomes inactive and will not be displayed in the feedback form. 4 To make new field required in the R column, click Inactive icon next to the new field. Note: If you want to switch required field to the optional, click the R column of this field. 5 From the Type list, select the type of input in the new field. 6 Click OK. To remove a field from the Feedback module 1 Select a field you want to remove. 2 Click Remove Selected. Active icon in To move field up in the feedback form, select a field you want to move up and click Up icon next to the field you want to move up. Move To move a field down in the feedback form, select a field you want to move down and click Move Down icon next to the field you want to move down.

90 Creating Web Site 90 Importing News from RSS Channels RSS, which stands for Really Simple Syndication, allows web masters to automatically load favorite news and information on private sites from RSS news feeds (also called "channels"). Many well-known news communities and corporate sites offer news headlines and article summaries in the form of news channels. RSS readers retrieve the recent content from the RSS news feeds and display it on your site. A visitor can preview the recent news content from your site and will be redirected to the news page if they want to read the full story. The news from RSS channels will be updated automatically, required no interaction from your part. Using the RSS Reader integrated with SiteBuilder, you can easily add your favorite news from either well-known RSS news feeds or from your own RSS news channel to your site. To insert the RSS Reader module to your site 1 Click the Edit tab. 2 Click the RSS Reader module in the Available modules area. 3 Keep pressing left mouse button and drag RSS Reader module icon to the web page, on which you want to place the module. 4 Click Change Channel to change the RSS channel from which you are importing the news. Figure 66: Selecting RSS Channel 5 To see the RSS module as it will be presented on the published site, click Next. On the Publish tab you will see the list of news headlines imported from RSS Channel.