EasySiteWizard 6 User Guide
Contents
1. will appear in the list Click on it and rename it as described above If you wish to delete a button from the list select that button in the list and click Delete Button The button is removed from the list and will not appear on your website 2 Select an action To indicate what should happen when a particular button is pressed click on the button who s behaviour you wish to define and then select an option for the list The actions available are Go to selected page Sends the user to the page indicated in select a page Go to my home page Returns the user to the website s default home page 15 Go to my online store Opens your EasyStoreMaker or EasyStoreMaker Pro store if you have one set up Go to my appointment schedule Opens your appointment schedule if you have set one up using the Appointment Scheduler application Go to my blog Opens your blog if you have set up a blog using the Easy Blog Builder application Send me an email Allows the customer to send you an email The address it is sent to is the same as the one you entered in Step 1 Define your site Go to another website specify URL below Links the button to a web page which is not a part of your website The exact URL of the site needs to be entered in the box provided below this option Link opens in drop down menu This is where the information will be displayed if the button is clicked When a button on your website is cl2. ae ir Ms ion Restores a previously undone action Can restore up to 20 undone actions This command removes all web content from all frames currently displayed A dialog box will pop up asking for confirmation that you wish to complete this action Opens the Navigation Setup window See the Navigation Setup section for more details Allows you to view and edit the source code of the current page s web content Selecting this menu option a second time returns you to the WYSIWYG Clear All Navigation Setup View HTML Source editor nsert Image Calls up the image insertion interface SiteSparks OpensalistofSiteSparks which you can insert After highlighting some text selecting this command allows you to create a hyperlink You can specify the ill cree MN URL and the target of the link new window same frame top frame other Allows you to insert a table into your website You can specify the formatting and the number of rows and columns in the interface which appears Inserts a horizontal separator Line Allows you to insert a form You can insert a standard form from the list or create your own custom form by selecting the form components from the list which appears 11 The following buttons are available through the PageEditor toolbar Picture _ Description size font F Font Name Sets the type of font you wish to use Font Size Sets the font size 1 7 Color Sets the font
3. color B Bod Sets the font to boldface I pu Underine Sets the font to underline Align Left Aligns text to the left zZ taios Sets the font to italics Center Centers text Align Right Aligns text to the right Justify Justifies the text makes the text flush with the left and right margins Insert numbered list allows you to create a numbered list Insert Bulleted list allows you to create a bulleted list Insert table this is the same as the Table command found under the Insert menu Image This is the same as the Image command found under the Insert menu SiteSpark This is the same as the SiteSpark command found under the Insert menu Undo identical to the command found under the Edit menu with the same name Redo identical to the command found under the Edit menu with the same name 12 Cut and paste into PageEditor PageEditor supports cutting and pasting from a text editor into the WYSIWYG What You See Is What You Get PageEditor You can also copy from the PageEditor into a text editor Entering text in PageEditor Click in the area you want to insert text and begin typing You can format it using the formatting tools at the top of the page For a description of the buttons and menu commands available in PageEditor see the section titled PageEditor menu options and buttons Using images with PageEditor With page editor you may build your ow
4. website creation process and publish your site Cloning an EasySiteWizard site Cloning copying a site is a useful tool for making changes to your site without risking any permanent loss of your original site s material To make an exact copy of an entire website select a website you have created in the My Websites listing and click on the Clone button This will create a copy of your site with the name Copy of added before the original website s name For example if your site was called My Website then the cloned site will be called Copy of My Website You can rename this website in Step 1 Define your site Now that you have successfully created a clone of one of your websites you can edit and modify it just as you would any other website without any risk of losing your original website s content or design scheme Unless you modify the publishing location in Step 1 for this site publishing your cloned site will overwrite your original website however since the original website is still listed in My Websites re publishing the original site will restore your content This allows you to publish your updated website and if necessary revert your published website to its previous format Step 1 Define it The Define it step of EasySiteWizard allows you to enter specific information for your website Fields that are displayed in red are required fields You will not be able to continue to the n
5. EasySiteWizard 6 User Guide Introduction to EasySiteWizard EasySiteWizard is a robust tool that allows you to quickly create customizable professional looking websites with no knowledge of HTML To access the EasySiteWizard application select Site Builders from the main menu and then EasySiteWizard from the Site Builders menu Tips for EasySiteWizard e Clear your web browser s cache before using EasySiteWizard This will ensure that everything will run smoothly while you build your site As a general rule clearing your cache periodically will ensure your web browser works smoothly all the time Browser compatibility with EasySiteWizard EasySiteWizard contains advanced functionality that may not be compatible with older web browsers The current version of EasySiteWizard is compatible with the following browser versions e Internet Explorer 6 e Mozilla 1 6 e Firefox 0 9 e Netscape 7 1 EasySiteWizard step descriptions Below is a description of what information or tasks are performed during each step of the website editing or construction process You may perform the Define it Design it and Build it steps described below in any order you like it is not necessary to do them in order even when creating a brand new website My Websites If you already have one or more websites created by EasySiteWizard This EasySiteWizard s starting point this is a management tool rather than a step in the actual webs
6. alled new page will appear in the list Click on it and rename it as described above 16 If you wish to delete a page from your site select that page in the list and click Delete Page The page is removed from the list and its contents are deleted In the case of an accidental deletion it may be possible to recover the page using the File Restore utility Using SiteSparks SiteSparks are special plug ins which allow you to easily add customizable complex functions to your page without any webpage scripting knowledge To call up a list of available SiteSparks click on the Insert menu and select SiteSparks A pop up window will appear providing you with a list of available SiteSparks Clicking on an item in the list will bring up an explanation of what each SiteSpark is used for When you have selected the SiteSpark you wish to use click on Insert An icon will appear in the page editor at your insertion point which represents the SiteSpark To configure your SiteSpark right click on the icon and select Properties A pop up window will appear This window will display all customizable information colors font sizes etc available for the SiteSpark you have selected Using forms Forms can be used for a number of interactive functions such as running java scripts sending information to a CSV comma separated value file or emailing information to a specified email address There are two
7. aragraph lt B gt lt BR gt lt B gt lt I gt This is a new sentence without a paragraph break in bold italics lt I gt lt B gt lt HR gt lt BODY gt lt HTML gt 24
8. box making no changes Ok After you have selected an image in your private library clicking Ok will insert the image into your website at whatever location the cursor is currently located Accessing the public image library You can access the public image library by clicking on the icon and selecting Free Images in the window that comes up The functions available in this window are described below Categories this drop down menu allows you to select what category of images you would like to browse through Search enter in a keyword and press the enter key in order to perform a keyword search for the kind of picture you d like to find Next and Previous links These links let you browse between pages of images To get a larger view of an image click on it After viewing the larger image if you wish to add it to your private library click on ok If you want to go back to the list of images click cancel Before adding an image to your private library you may enter in your own name for the image in the box labeled copy to my images as Other image sources for your library Several websites that allow you to use royalty free images for personal use are http www photoessentials com http www animfactory com http www freeimages co uk http www clipart com http www freegraphics com 14 Navigation Setup Please note The features described in this section are only availabl
9. detailed explanation of what clicking each button will do Button Name Symbol Define your site Takes you to Step 1 Define your site Design your site Takes you to Step2 Design your site Build your site Takes you to Step 3 Build your site My Websites If you have more than one website available for editing this button opens the list of available websites you have to choose from This allows you to switch from editing one website to another Preview This button pops up a window which allows you to preview the current state of your site including any saved but unpublished revisions you have made Publish This button publishes your website If you were editing a website which already exists on your domain then publishing will overwrite the current live version of the web site 2 Opens online help files X Closes the EasySiteWizard window Editing an EasySiteWizard site First you must access the EasySiteWizard application In WebsiteOS select Site Builders from the main menu and then EasySiteWizard from the Site Builders menu After launching the EasySiteWizard application in WebsiteOS click on the Begin button You will be taken to the My Websites screen where you will choose which website you wish to edit Click on next to continue to Step 1 see Step 1 Define your site for more details Please note EasySiteWizard will remember any unpublished changes y
10. dicates that a template is available in different color tints Selecting one of these templates will display a small color palette on the left hand side of the page Clicking on the colors lets you select which tint you want A preview of the template in that tint will be shown This icon indicates that template variants alternate images are available When a template marked by this icon is selected a drop down list is displayed indicating what Template variations are available This icon indicates that a section of the template can have a custom image uploaded Selecting a template marked with this icon will allow the user to upload a custom image For the best appearance custom images should conform to the dimensions specified in the upload interface Step 3 Build your site PageEditor In the third and final step Build your site a full scale version of your template is displayed and the PageEditor application is loaded PageEditor will allow you to edit your website s content using a WYSIWYG What You See Is What You Get interface it allows you to enter text or insert pictures into your website set up the overall layout of your page and lets you to configure the buttons and hyperlinks on your site At the top of the window is a menu bar with formatting buttons Click an area in the window and enter your content You can enter text upload an image or access the free image library and insert a picture from t
11. dle Left and Right lt BR gt A line break indicates that the line should end here lt a href http othercompany com gt Link Name lt a gt This links the text Link Name to the URL in quotes http amazon com If you click on the words Link Name in the browser it will open the page at the URL lt a href mailto support yourcompany com gt support yourcompany com lt a gt This opens a browser s email client when people click on the text between the tags so people can send you an email from your webpage The TO field will contain the address specified in the first tag lt HR gt This inserts a Horizontal Rule which is a horizontal line lt H1 gt This is a Header lt H1 gt Headers can be created using tags lt H1 gt through lt H6 gt lt H1 gt is the largest header lt H3 gt This is a Medium Header lt H3 gt lt P gt This starts a new paragraph lt P gt This ends the paragraph lt B gt Text between these tags will be bold text lt B gt lt I gt Text between these tags will be italicized lt I gt Explanation of meta tags Meta tags are used by search engines to help find your website When you type a search topic on a search engine website it uses a software program called a spider to search through the meta tags of websites in its list and find ones that match your search word Meta tags do not appear on your website but are hidden in the HTML code They are us
12. e for multi page sites Buttons provide links to pages within your website or to other sites on the Internet A logical set of buttons will make it much easier for people to find information on your site In most of the EasySiteWizard templates buttons will appear on the left side of your website or along the top of your website The design you choose will determine the general appearance of your buttons If you are creating a new site you will have some buttons on your page by default To edit the button name add new buttons or designate button linkages you need to access the Navigation Setup window There are two ways to do this 1 By clicking on the Customize button in Step 1 2 By clicking on the Navigation Setup command in the Edit Menu of the PageEditor Step 3 This will bring up a list of all buttons and pages on your site This window is divided into three parts select a button select an action and select a page An explanation of the functions available in each section is detailed below 1 Select a button A list of the buttons currently on your site is shown here To rename a button select a button name from the list and enter in the new name in the box provided at the bottom of the page When you click on a different button in the list it will display the new name you entered To create a new button click on the button called New Button A button called new button
13. ed by web browsers and other web reading software 22 Example of a simple HTML page Hypertext Markup Language HTML is the most common language used to create documents on the World Wide Web HTML uses hundreds of different tags to define a layout for web pages Most tags require an opening lt tag gt and a closing lt tag gt Example lt b gt On a webpage this sentence would be in bold print lt b gt Below is an example of a very simple page DY Yeu Tile Hero TIES Ble EG Yew Fares Ioh Heb Ka EA BES E nal ns AREAS JB OH BD CAM Doe E o haai e Go Bier Generic is a ink to another nifty ste This is a Header This is a Medium Header Send me mad al pupporPbbegenens com This it a mw paragraph Thais is a mew paragraph This is a new sentence without a paragraph baak ORA CO aN ipe This is the code used to make the page lt HTML gt lt HEAD gt lt TITLE gt Your Title Here lt TITLE gt lt HEAD gt lt BODY BGCOLOR FFFFFF gt lt CENTER gt lt IMG SRC clouds jpg ALIGN BOTTOM gt lt CENTER gt lt HR gt lt a href http somegreatsite com gt Link Name lt a gt is a link to another nifty site lt H1 gt This is a Header lt H1 gt lt H2 gt This is a Medium Header lt H2 gt Send me mail at lt a href mailto support yourcompany com gt 23 support yourcompany com lt a gt lt P gt This is a new paragraph lt P gt lt B gt This is a new p
14. et this up follow these steps 1 Right click on the lt FORM gt tag and select Properties 2 In the properties window which pops up underneath what should happen when this form is submitted click on the option you wish to use Below is a list of your choices E mail results to Enter an email address to send form submissions to e Save results in a CSV file Enter in a filename to save form submissions in The data will be stored in a CSV comma separated value format The filename has to end with csv and will be stored in the main directory of your website e Run a custom script You can select a CGI script if any are present in your cgi bin directory which will run when someone submits form data 3 Click Ok 20 Publishing your website To publish an EasySiteWizard site click on the Publish button on the EasySiteWizard toolbar If you are not ready to publish your EasySiteWizard website but you would like to save your work click on the File menu in PageEditor and select Save Page Your settings will be saved so that you can make changes later but nothing will be visible on the Internet If you recently registered your domain name your website may not be immediately visible on the Internet It may take 24 48 hours for DNS to propagate During this time you will not be able to view your EasySiteWizard site using the link provided on this page However you can access your site bef
15. ext step if these fields are left blank Your name company name slogan etc will be displayed on your site in various places depending on the design you choose Your email address will be used to send an email to you if you create a button on your site that automatically sends email The keywords and description you enter can increase the probability of appearing in search engine results The information in these fields also known as meta tags will not be visible on your site but it will be stored in a hidden part of your website that search engines check for information Enter your keywords in a comma separated list and include words that apply to your website these are also known as meta tags The keywords for your website should be short and descriptive They will be used to categorize your site if a search engine lists your site For more information on meta tags see the section titled Explanation of meta tags Example Keywords books reading read library list children kids 10 ten Description A reading list for ten year old children In this step you also select which type of web page you want to design single or multi page If you select multi page then the Customize button will be visible Clicking on this button brings up the Navigation setup window which displays the default pages and buttons which will appear on your multi page site and how they are linked together You may customize this informat
16. here You can save your information at any time by clicking on the file menu and selecting Save Page or pressing Ctrl S Please note Features marked with an asterisk are only available for multi page websites PageEditor menu options and buttons Once the page editor has loaded you will see the toolbars depicted below If you are creating or editing a single page website then some of the features described and shown will not be available as they are only applicable for multi page sites Features which are only available in multi page mode are marked with an asterisk The PageEditor toolbar The following menu options are available through the PageEditor toolbar Menu Command Shortcut New Page Creates a new page for editing This page is not linked to any button on your website see Navigation Setup for details on linking your new page to a button Save current Saves the current page content You must save Page page content before editing a different page or any changes you have made will be lost Open another Displays a menu of available pages to edit Selecting page a page from the menu loads that page into PageEditor 10 CTRL X Cuts highlighted web content CTRL C Copies highlighted web content C Edit Cut Paste TRL V Pastes content which was either cut or copied The content is pasted at the insertion point you have LL e Undo CTRL Z Undoes your previous action The last 20 actions o
17. icked a variety of things can happen The Link opens in menu determines where the information associated with the button will be displayed You can choose to display the information in the default frame the entire window or a new browser window as described below e Default frame When someone clicks on the button they will still be able to see the design template that you chose in step three The content of the page will be displayed inside of the design e Entire window When someone clicks on the button the content of the page will be displayed without the design template In order to view the buttons and the header of your EasySiteWizard site they will have to use the Back button on their browser e New window When someone clicks on the button an additional browser window will open and it will display the page without the design template The EasySiteWizard window will still be open 3 Select a page This section is used to define what buttons are linked to which pages see 2 Select an action for more details It is also used to let you rename your pages add new ones and delete ones you don t want to have or use on your site To rename a page select a page from the list and enter in the new name in the box provided at the bottom of the window When you click on a different page in the list it will display the new name you entered To create a new page click on the button called New Page A page c
18. ion by changing names adding and removing pages and buttons and changing button links It is not necessary to customize this information immediately you will have an opportunity to modify this information later Step 2 Design it In this step you need to select a template from which to build your site The design template you choose will determine the colors and the overall look and feel of your website The same EasySiteWizard page may look very different depending on the template you select Two design templates used for the same EasySiteWizard Page l re E Reading List Reading List Gaal rn aberdo you rm You can view your EasySiteWizard design choices by scrolling through the designs on the left If you do not find one to your liking change the category in the drop down menu and display other templates Click on one of the designs to select it The design you have selected will be displayed in the middle of the window Some templates support additional customization options These templates are marked with additional icons see example below As indicated above each thumbnail displays one or more icons indicating different types of customizability A full list of icons and their meaning is provided below Over the top left corner of every thumbnail a white number on a blue background is displayed This number indicates the maximum number of navigation buttons which can be used with this template This icon in
19. ite design process Using the Delete Clone and New buttons you can remove an existing website copy one of your sites for backup or editing purposes or create a new website If you wish to edit an existing website click on the radio button beside the website you wish to edit and click Next You can also jump straight to a specific step if you wish by clicking on the Define it Design it or Build it buttons Please note if you have reached your maximum limit for the number of websites you are allowed to build the Clone and New buttons will not be displayed Creating or editing a website in EasySiteWizard is fast and easy There are only three steps involved in creating a new web site Define your site Design your site and Build your site Define your site Enter contact information company name publishing location and other basic information about your website This is also where you may choose to create either a single or multi page site The single page creation process is identical to the multi page process There are only a very few features which can be exclusively accessed by a multi page site Design your site Choose a template for your website from the menu on the left hand side A preview image of the template you have selected is shown on the left Build your site This step is where through the page editor you get to add remove and modify buttons on your page as well a
20. n private library of images for use on your website You can obtain images from two sources for your private library The PageEditor s public free image library and images you upload yourself Using your private image library To access your private image library simply click on the icon A dialog box comes up showing a list of images you have available in your private image library If you have never used PageEditor before this list will be empty There are four buttons on this page Below is a list of the names of these buttons and the tasks they are intended for Free Images Clicking this button opens PageEditor s public image library From this window you may search through the public library and add images to your private library For more details see Accessing the public image library below Refresh newly added images will not appear in this list until you click this button This task only needs to be performed once until you add new images again Upload Clicking this button allows you to browse your hard drive and upload an image from your computer Preview entering in the URL for an online image and clicking Preview lets you see the image you have typed the address to in order to verify you have entered the URL correctly Delete Selecting a file name from the drop down menu and clicking this button will delete that image from your private image library 13 Cancel clicking this button cancels this dialog
21. ore DNS propagation by clicking on the Preview button also located on the EasySiteWizard toolbar HTML tags The meanings of some common HTML tags are shown below lt HTML gt This tag tells the browser this file is an HTML document lt HTML gt End of the HTML document Note Approximately 99 of all HTML tags need to be added in pairs Notice that a lt HTML gt tag is located at the very beginning and the very end of the document There are only a handful of tags that do not need this pair structure lt HEAD gt Beginning of the header The header can contain other additional material that is not to be displayed on the page These can be comments and meta tags provide information to browsers and search spiders about the document lt HEAD gt End of the header lt TITLE gt This indicates the start of your page title which is displayed in your browser s title bar lt TITLE gt End of the title lt BODY BGCOLOR FFFFFF gt Tells the browser that the body of the document starts here and that the background is white For a list of hexadecimal colors go to http Awww lynda com hexh html lt BODY gt End of the body lt CENTER gt Centers the alignment of whatever is between this tag and lt CENTER gt 21 lt IMG SRC clouds jpg ALIGN BOTTOM gt This tag inserts an image called clouds jpg and aligns it with the bottom of any nearby text Alignment options include Mid
22. ou make to a website between editing sessions as long as you save your changes before closing the editing session Editing outside of EasySiteWizard If you are an advanced user or are interested in learning more about HTML you can use the File Manager to edit the pages created by EasySiteWizard If you change the HTML generated by EasySiteWizard you may break some aspects of your site Since EasySiteWizard does not read site information directly from the published site EasySiteWizard will not show the manual changes you have made to your website Please note After manually editing an EasySiteWizard page as long as you do not view or edit the version of the page stored in EasySiteWizard publishing your site will not overwrite your manually edited pages Deleting an EasySiteWizard site First you must access the EasySiteWizard application In WebsiteOS select Site Builders from the main menu and then EasySiteWizard from the Site Builders menu After launching the EasySiteWizard application in WebsiteOS click on the Begin button You will be taken to the My Websites screen To delete a site first select the website you wish to delete then click on the Delete button Your website will be deleted Please note if you only have one website and you delete it a new unpublished site will be created automatically no content from this new site will be available on your domain unless you run through the
23. s create the content including frame layout text links and pictures for each page on your multi page site WARNING When you publish your website EasySiteWizard will rewrite your index html page if you already have one under the directory you are publishing to and it will create several files and a new directory in your public directory Be sure to backup important files before using EasySiteWizard Creating a new site First you must access the EasySiteWizard application In WebsiteOS select Site Builders from the main menu and then EasySiteWizard from the Site Builders menu Click on the Begin button which will take you to the My Websites page To create a new site click on the button labeled New If this button is not present this means that you have reached your limit for the number of websites you are allowed to build you must delete an existing website before you can build a new one When you click on New You will be taken to the first step of the website creation process See Step 1 Define your site for more details The EasySiteWizard tool bar On the My Websites page and throughout all three steps of the EasySiteWizard creation process the EasySiteWizard toolbar shown below is always visible at the top of the screen All buttons shown are fully accessible whether you are creating a brand new page or editing an existing one no matter what step you are currently in Below is a
24. the pull down menu is a more efficient way to create and store longer lists of options Modifying form element properties To customize and input data into your drop down menus change button names etc you much right click on the form element you want to modify and select Properties Below is a list of all fields which can appear inside form elements and what they are used for Please note Not every field listed below is available for each form element type Form Field NAME ONCHANGE SIZE OPTIONS Purpose The value in this field is the name of the form element This value is not displayed to people viewing your website You can enter in a short Java script or a tag pointing to a js file which will be activated when the status of your form element has changed Changes the width of your form element Used to create a list of available options in a drop down menu form element 19 VALUE Used to define values for selected options in drop down menus radio buttons etc Changing the VALUE of a button changes the name which is displayed on the button ONCLICK Similar to ONCHANGE except scripts defined in this field are triggered when the form element has been clicked on Defining the submission target of a form When you are done adding and customizing the values of your form elements you need to define where the form will be submitted to when an end user submits data through the form To s
25. types of forms which can be created in the Page Editor A standard Contact us form and custom forms Details on how to create each type of form are provided below To create a standard Contact Us form 1 Click on the Insert menu 2 Select Form gt Contact us Form 3 A default set of fields will appear at the location of your insertion point in the PageEditor To create a custom form 1 Click on the Insert menu 2 Select Form gt Blank Form 3 Aset of lt FORM gt lt FORM gt tags will appear at the location of your insertion point in the PageEditor 4 Place your insertion point between the lt FORM gt and lt FORM gt tags Press the 17 Enter key on your keyboard a couple of times to create some space between these tags Place your insertion point directly beneath the lt FORM gt tag 6 Type in the text description you want for the form element you are about to insert e g Full Name Comments etc 7 Click on the Insert menu 8 Select Form gt Component and select the form element you wish to insert Hit the enter key on your keyboard once if you wish to add another form element 9 Repeat steps 6 8 until all of your form elements are in place Don t forget to include a submission button if you want data to be posted somewhere e g to an email address a Now that you have your form elements set up you need to customize and inp
26. ut additional data into the form elements and select a submission target for your form Details on performing these tasks are provided below Form elements The following custom form elements are available A brief description of how you might use each form element is also listed Form Element Description Submit Button Used to send information to a defined target such as an email address or a CSV file Reset Button Clicking this button clears all user input from all form elements Button A generic button which can be used to run Java scripts Radio Button Radio buttons are used to present a short list of options or values Only one radio button can be selected at a time a previously selected button will be deselected if the user clicks on another radio button Checkbox Displays a box which can be toggled on checked or off uncheckea Text Field Single line A text field which can hold one line of text 18 Text Area multi line Password Field Hidden Field Pull down menu A text field which can hold multiple lines of text e g for inputting comments A single line text box which records a user s keystrokes but does not display those keystrokes on the screen A text field which can contain or collect information which is not visible on the web site A menu which when clicked on contains a list of options Only one item in the menu can be selected This is similar to radio button usage except
Download Pdf Manuals
Related Search