Webaloo Manual. A Guide to Editing your Website.

Transcription

1 Webaloo Manual A Guide to Editing your Website.

2 ~ 1 ~ WEBALOO MANUAL The following manual is designed to familiarize new users with the Webaloo Content Management System (CMS) and to provide extra knowledge for current users. This manual will focus on the tasks involved with putting together and maintaining a web site. There are many terms and abbreviations in this manual that may be unfamiliar to you if you are new to website management and design. You can find information about the terms and abbreviations in this manual by searching for them on a search engine such as Google. INDEX HOW TO LOGIN TO THE EDITOR PAGE 2 HOW TO ADD A NEW PAGE PAGE 3 HOW TO EDIT, RENAME, OR DELETE A CURRENT PAGE.... PAGE 4 HOW TO ADD CONTENT TO A NEW PAGE PAGE 5 HOW TO USE THE EDITOR PAGE 7 HOW TO USE THE CONTROL PANEL PAGE 18 HOW TO PASSWORD PROTECT A PAGE PAGE 20 HOW TO ADD A NEWS STORY PAGE 23 HOW TO EDIT THE CALENDAR PAGE 25 HOW TO WORK IN CONTENT REGIONS PAGE 27 HOW TO USE THE FORM BUILDER PAGE 31 HOW TO SET UP YOUR WEBMAIL PAGE 41 CONTACT US PAGE 42 ~ 1 ~

3 ~ 2 ~ HOW TO LOGIN TO THE EDITOR The first step to editing your website is to log into edit mode. Enter your domain name, such as After your site loads, type in /edit after the domain name ( Next, type in your username and password and click login. Once logged in, you will notice a number of editing icons on the page. (A) Next, begin by reviewing the Website Page List located at the top of left of your homepage. This is a dropdown menu that contains a list of all of the pages in your website. Visitors to your site will not see this dropdown menu nor have access to it. (B) The red Add Page button allows you to add a new page to the site. (C) The green Page Options button allows you to change any page information non-content related, delete the page, or set page security. (D) The blue Control Panel button brings you to the control panel where you can easily jump to edit the website, edit the calendar, edit the news, adjust global settings, view web statistics, use the page manager, bulk upload photos or files, view categories, edit the master pages, set page security, update account information and access help/support for the site. (E) The gray Preview button allows the editor to view the site in the normal mode without the editing tools or extra spaces on the page all while still being logged in. It is a nice feature because the editing tools often distort the spacing of the layout. To edit again or get out of preview mode, just click the preview button again. You will notice that your Webaloo buttons such as Add Page, Page Properties, Control Panel, Preview, and Logout are still at the top of the screen to remind you that you are still logged in. (F) The red Logout button logs the editor out of the site. (G) The blue Web Stats button will take you to view your website statistics. You can also view past month's activity. ~ 2 ~

4 ~ 3 ~ HOW TO ADD A NEW PAGE Click on the Add Page button at the top of the window (see HOW TO LOG INTO EDITOR above). This brings you to the page options window. Page Name First, give your page a URL name. This is the name that will appear after the website address, such as The.aspx will be added by the software running the website. You only need to type the page name (with no spaces) in this box. You can use an underscore in place of a space. Example: Page Title Next, give your page a page title. This is what will appear as the title of your page in the browser window. Choose this line intelligently because the words will help your optimization with search engines. Example: Link Name Then give your page a link name. This text will appear in your navigation column as the link to the page that you are creating. Example: Master Page Choose the master page appropriate for this page (if applicable) Category Choose your name in the Category drop down box (if applicable). Categories make it easier to find the specific pages you want to edit as well as keep all of your pages organized. Keywords & Descriptions In the Keywords box, you can enter specific words that are relevant to the content on this page so search engines such as Google and Yahoo! can read your site s content and rank the site higher on their site. You can also enter a description of what this particulars page contains and can enhance your search engine ranking. ~ 3 ~

5 ~ 4 ~ Start & End Date You can set the start date and the end date for when this page is live. The page never deletes itself or disappears (it will be available for editing under the Website Page List at the top of the page), just is unavailable for the end user. Page Security You can click here to make the page password protected. (see PASSWORD PROTECT A PAGE section of manual) When you ve filled out the boxes, click on Create New Page. HOW TO EDIT, RENAME, OR DELETE A CURRENT PAGE Click on the green button at the top of the page called Page Options (see HOW TO LOGIN TO THE EDITOR above). Here you can change the page title or link name, ~ 4 ~

6 ~ 5 ~ The starting or ending date, edit or add keywords and page description, or delete the page from your website.. HOW TO ADD CONTENT TO A NEW PAGE Now that you ve added a page to your right column, you need to add a content region, such as text and images. Click on the word Add on the page in the middle column "left or right column" or main column. This will add content to the main portion of the website. Once you click on Add, you ll have a choice of what you d like to add to your page. ~ 5 ~

7 ~ 6 ~ Some of your options are (more are available): - Text and Images: This is the editor that allows the editor to add text and images to a content region on the site. - Navigation 1: A type of navigation that will be set up by the web designers and it uses categories. - Navigation 2: A type of navigation that will be set up by the web designers and it uses the tree navigation. - Site Search: This tool places a search bar into the site that allows the user to type in a word and get a results page with results returned to them. - Form: This is an optional tool contact form that a user can enter their information and it will send the admin or whomever an with their information and what the user would like, such as subscribe to an enewsletter or receive further information. - Event Calendar: This optional tool is the calendar tool that allows events and schedules to be entered into a calendar grid or event list format. - News Headlines: This optional tool creates news headlines that can be clicked on and a full story can be available for reading. - Photo/Gallery Slideshow: This optional tool places a slide show on the page that rotates photos automatically and the photos can be links to other sites or have a description for the photo. - Iframe: This optional tool allows a particular region of the page to hold videos or other sites from outside sources on your website, yet the user cannot tell the difference. It also can have its own scroll bar since it is a window in another window. Let s choose Text and Images and click Add Content Item. ~ 6 ~

8 ~ 7 ~ Click this edit icon and enter your text, images, or tables in the editor window. Hit Save Changes at the bottom of the screen when you are finished. (See the next section, HOW TO USE THE EDITOR, to learn how to edit your content.) HOW TO USE THE EDITOR The editor is very simple to use, and has many options. Here are a few basics and most commonly used capabilities: HOW DO I ADD TEXT? Simply place your cursor in the window and begin typing. You can format your copy using the text formatting buttons. You can also copy text from other programs. There are text styles built into your site if you d like your fonts to be consistent with the rest of the site. To do this, highlight your copy and choose the font style from the Apply CSS Class drop down box to keep a consistent look of content throughout your site. ~ 7 ~

9 ~ 8 ~ HOW DO I ADD IMAGES? First, have your image saved on your desktop. If it is a low resolution photo, you are ready to insert it. If not, you need to upload it using the bulk uploader tool in the control panel. (See How To Use The Control Panel.) Click on the Image Manager button inside the editor (two mountains and a sun). If you have already uploaded the image, you can find it in the middle column. If not, you will need to upload it. First, in the left-hand column, click on the folder into which you would like to add the image. ~ 8 ~

10 ~ 9 ~ If you would like to create a new folder, click on the folder icon and give the folder a name and click OK. Once you have selected the correct folder, click on the Upload button with the green plus sign to the left of it. ~ 9 ~

11 ~ 10 ~ Once here, you can use the Select buttons to the right of the boxes to browse your computer for images. If you would like to upload more than 3 images, click the Add button. After you have selected all of the images, click Upload. HOW DO I EDIT OR ALIGN IMAGES? To edit the photo, right click on the image and select Image Properties. Within the Image Properties you will find basic photo editing options. ~ 10 ~

12 ~ 11 ~ Adding a Boarder You have the option of adding a border around your photo. Decide how wide you want your boarder to be (this is measured in pixels), and then select the color you would like for the border. You also have the ability to make it a specific color by clicking on Add Custom Color. Alignment Next, you can choose to align the photo with text by clicking on the box to the right of Image Alignment. You can align it either left, right, top, bottom, or in the middle of the text. Add Spacing After you align the photo, you may want to add a margin to your image. This will add white space around the photo so it will not be right up next to the text. Resize Lastly, you can resize the photo by changing the width or height. Make sure to click the chain link to the right of the dimension boxes BEFORE changing the width or height so the image will proportionally resize. ~ 11 ~

13 ~ 12 ~ HOW TO CREATE A TABLE Put your cursor where you d like the table to go on the page. Select the table icon. Choose the number of rows and columns one you want in your table by dragging your curser across the grid. The area you select will highlight in gray. Double click on the lower right hand cell in the shaded area. Right click on the table and notice all of your options. You can insert a row above or below, insert column to the left or right, delete columns or rows, and much more. ~ 12 ~

14 ~ 13 ~ For more editing options, click on Table Properties tab. Within the Table Properties, you can: Set a Height and Width for the table. You can make the table span your page by setting the width to 100%. Add Cell Spacing, Cell Padding, set the Alignment of the table, and add a Background Color: Add a background image to the table. Set the font style for the table. Click on the Table Properties tab. Within the Table Properties, you can: Set a Height and Width for the table. You can make the table span your page by setting the width to 100%. ~ 13 ~

15 ~ 14 ~ Add Cell Spacing, Cell Padding, set the Alignment of the table, and add a Background Color: Add a background image to the table. Set the font style for the table. Tables are really just something you need to play with to understand. DON T FORGET TO HIT 'OK' AT THE BOTTOM OF THE EDITOR WINDOW TO SAVE YOUR SETTINGS! HOW DO I CREATE LINKS TO DOCUMENTS, SUCH AS PDF OR WORD FILES? This works much like the image tools. In this case, you are uploading and linking to a document. First have your document ready on your desktop. Its file size should not exceed 3 MB. Step 1: Highlight the copy that you d like to link to the document (for example, it may be click here to download ) Click on the Document Manager icon. It is a piece of paper with a red paperclip. ~ 14 ~

16 ~ 15 ~ Step 3: Once you are in the Document Manager, click on the tab that says Upload Document. Step 4: Click on 'Select" and locate the PDF file you want to upload. Then click 'Upload.' Step 5: Find the document you uploaded and click on it (1). Then go to the dropdown that says Target (2) and select New Window (3), then hit Insert (4). ~ 15 ~

17 ~ 16 ~ Step 6: Now your text should be linked. The last step is to highlight the link and at the bottom of the screen above 'Save Changes' locate the box that says 'Classname.' Choose the font style that you want for the link and then hit 'Save Changes.' DON T FORGET TO HIT 'SAVE CHANGES' AT THE BOTTOM OF THE EDITOR WINDOW HOW DO I MAKE AN LINK OR HYPERLINK? Link to an Step 1: First select the copy you d like to link to an address (for example, it may be click here to send me an . ) Step 2: After you have highlighted the text, click on the Hyperlink Manager. Step 3: Go to the tab, Step 4: And enter the address you d like your visitor to write to. Step 5: You can type in the subject line if you wish. This will show up as the subject line for the being sent. Step 6: Lastly, you will want to select the CSS Class. Choose the most appropriate (usually called Link or something similar). ~ 16 ~

18 ~ 17 ~ Step 7: Click OK when finished. Link to an Exterior Website: Step 1: If you d like to create a link to a website outside of your website, highlight the text you want to be the link. Step 2: Enter the website you d like the link to next to URL. Step 3: Next, choose the target. By selecting New Window, if someone clicks on the link from your website, it will open that link in a new window or tab instead of navigating away from your website. Choose this for any link to an external website. Step 4: Lastly, chose the correct CSS Class for the link. DON T FORGET TO HIT SAVE CHANGES AT THE BOTTOM OF THE EDITOR WINDOW. Link to an Interior Page (a page within your website) Step 1: If you d like to create a link to a page within your website, highlight the copy you d like to link and select the page you d like to link to under the Page Links menu. Step 2: Highlight the link and apply the font style with the Classname dropdown above the Save Changes button. ~ 17 ~

19 ~ 18 ~ HOW TO USE THE CONTROL PANEL The control panel is a one-stop place to access various features on your site. A. Edit Website: This button will take you directly to your homepage so you can edit the site. B. Edit Calendar: This button will bring you to your calendar to edit the events or change the options. C. Edit News/Headline: This is where you can edit the news headlines, change the starting and ending date for the articles, and update where you d like the news to be on your site. D. Global Settings: This button is the heart and functionality of your website. With that said, one minor change can alter or erase part of your website. Unless you are very computer savvy, we recommend staying out of this area. E. Web Stats: This is where you can view a very detailed layout of visitors to the website. F. Page Manager: A place where you can manage all of the navigation for your site and control where the pages are located. ~ 18 ~

20 ~ 19 ~ G. Bulk Upload: This tool allows you to upload a folder of images or files at one time. It also has the capabilities to assign a set or a customized size that you would like the photos to upload to. Java is needed to have the bulk upload function, but Java can be downloaded for free simply by clicking on the Java logo. a. To upload a folder of images: Select the size of the photos that you would like them to be and then click on the browse bar at the bottom of the upload and browse your computer until you find the folder you would like to upload. Select the folder and click OK and they will automatically upload. Or, select the size of the photos that you would like them to be and have the browser windows smaller and next to each other and drag the folder of images right into the upload box and they will automatically resize for you. b. To upload a folder of files: Select the browse button on the bottom of the bulk upload and browse your computer until you find the folder you would like to upload. Select the folder and click OK and they will upload automatically. You may also drag the folder directly into the bulk upload box and they will automatically upload. H. Categories: Categories are assigned when a certain type of navigation is used. I. Master Pages: Just like Global Settings, this button is the heart and functionality of your website. With that said, one minor change can alter or erase part of your website. Unless you are very computer savvy, we recommend staying out of this area. J. Edit Users: This is where the admin can assign user names and passwords for people to edit or view certain parts of the website. First a role needs to be created, and then a user belongs to a role. ~ 19 ~

21 ~ 20 ~ To add a role, click on Roles and then select Add Role. Assign the role a name, such as teachers, coaches, parents, staff, etc., and hit Save Role. Now the manage website roles screen appears and click on Users at the top of the page and select Add User. Here is where you will assign the user name and password for this user and select the level of security that you would like. If they are allowed to edit certain pages, you will check the boxes for editor, user, public, and the name of the role that was just created. If the new user is allowed only to view certain pages, you will check the boxes user, public, and the name of the role that was just created. To use the log in box option, you will do the same as above pertaining to what you will give them access to, but you will also select from the drop-down list what page they will be directed to when they log in. Once the roles and users are created, go to the website page that you want to give them access to and select the green button, Page Options. This will bring you to the page where you can change the page names, delete pages or set a starting or ending date, but you can also assign security by clicking the button at the top titled Page Security. Here, you will need to click the search button on the Add Role feature and all of the roles will appear. Click Add on the role you want to add and then select or unselect the Can View or Can Edit box for the level you would like that person to have access to, and then hit Save Changes. K. Account Info: In account info, you can enter information about your Webaloo account, your domain, the website, and enter notes for an easy place to store this often-easy-to-lose information. Manual: This will bring you to an online version of this manual. On the left hand side of the control panel screen is where you can see the available storage capacity remaining for files and images for your website. If you notice your bar is getting close to 100%, you can either delete old images and files you are not using or support@webaloo.com to learn more about increasing your capacity. PASSWORD PROTECT A PAGE Step 1: Log into your website editor and click on Control Panel. ~ 20 ~

22 ~ 21 ~ Step 2: Click on the Edit Users tab, then click on the link in the upper left that says Roles. Step 3: click on the link in the upper left that says Roles. Step 4: Click on the Add Roles link. Add a new role for the people with separate editing privileges. You can name this role anything you want. Step 5: Click on the Users tab in the upper left Step 6: Then click Add user. Step 7: Create a username/password and under the Roles check boxes, select only the role that you just created. Set the user's homepage to the webpage you want them to edit. ~ 21 ~

23 ~ 22 ~ Step 8: Click on Edit Website again and select the new user's homepage from the website page drop down list. Step 9: Click on the Page Options button Step 10: Then on the Page Security button on the top right corner. Step 11: Search for the role you created in step 3 and click Add next to it. Step 12: Set that new role to Can View only if you just want them to log in to view the page OR check Can View and Can edit if you want them to have editing capabilities. ~ 22 ~

24 ~ 23 ~ Step 13: Repeat steps 8-12 for every page you need to allow these new users to view/edit. When creating new users with the same editing privileges, there is no need to create new roles for each of them. You can simply re-use the same role you created earlier. HOW TO I ADD A NEWS STORY? Go to the control panel and click on Edit News. Click on Add Story on the left side. ~ 23 ~

25 ~ 24 ~ A: Enter the headline for your news story here B: Enter the starting date that you would like your news story to appear on your site for the end users to view. C: Choose a news category where you want the story to appear (if applicable). D: Enter the ending date that you would like your news story to appear on your site for the end users to view. Once it expires, the story will still be available in your news story list. E: Enter a synopsis for the story, typically one or two sentences. F: If this box is checked, the public can syndicate your news stories through their RSS readers to get the most up-tothe-minute news from your site. G: For advanced users, Linked Media will allow an iframe to be used to show a video. H: Enter your full news story in this box. You can add images, videos, text, and tables. It has all of the capabilities as ~ 24 ~

26 ~ 25 ~ the Text and Images Editor. Hit Save Story at the bottom of the window when your story is how you would like it to appear on your site. There is a filtering tool at the top of the tabs that allow the editor to sort by headline, start date, end date or category in either ascending or descending order. This is a great feature because often, large quantities of news stories are on the site and trying to locate a particular story can be a tedious task. HOW TO EDIT THE CALENDAR To edit the calendar, click on the edit icon above the month calendar or go into the control panel and click on Edit Calendar (see HOW TO USE THE CONTROL PANEL above). The easiest way to enter new events is to first edit the locations of events (A), if you should choose to use this feature. This feature gives the event an actual location for the user to get a pop-up of a Google map where the user can enter their address to get directions to or from the location. Simply click on Locations and click on Add Location (B) on the left-hand side. Give the location a name and fill in the other boxes (C). By giving an address, you are allowing a map to automatically be available by Google. To add a schedule, click on the Schedules tab (A) and simply click on the Add a New Schedule tab (B) on the lefthand side. Give that schedule a new name (C) and now you can assign a group of events just to their own schedule, such as girl s basketball, boy s basketball, drama club, etc. ~ 25 ~

27 ~ 26 ~ To edit or add an event, click on the Calendar Events tab (A) near the top of the screen. If you are adding a new event, click on Add New Event (B) on the left-hand side or if you are editing a current event, click on Edit (C) next to the appropriate event. From here, you can edit any information regarding your event. Fill in the Event Title (A) and the Event Date (B), enter an Event Synopsis (C), check if it is an All Day Event (D) or has a Start and End Time, and if so, enter those times (E), assign a category to the event if necessary (F). ~ 26 ~

28 ~ 27 ~ Click on enable recurrence if you d like to have the event appear on your calendar all year long (G), click on enable RSS Syndication if you d like to allow visitors to subscribe to your calendar and have it appear in their favorite RSS reader and view your events as soon as you add them (H), choose a location for the event (I), choose if the event belongs to a schedule (J), and finally add text and images to the editor for the full story of the event (K). Hit the Save Changes button at the bottom of the screen. HOW TO WORK IN CONTENT REGIONS Standard Content Region The first step to adding a content region to your page is to click Add above the area where you want to put the content. Then select Content Region. Click on the Edit icon (little piece of paper and pen) and click on New Content Item. Enter a content name in the box and make sure you know what the name means. Then enter your information in the editor box below. Hit Save Changes. You can add as many content items as you would like by repeating these steps. ~ 27 ~

29 ~ 28 ~ You need to then activate which content region you want to appear on that page by clicking on Set Current Content. Select the one you want and click Save Changes. Hit the blue Back button to go back to your previous page. Random Content Regions: This type of content region is used when you want a standard content region to randomly rotate (with each page reload) on your page. You can rotate any standard content that you already have on your site. To add a random content region, click Add above the area where you want to put the content. Then select Random Content Region and follow the same steps as to add a standard content region To activate which content regions you want to randomly change on that page by clicking on Set Current Content. ~ 28 ~

30 ~ 29 ~ Check the boxes next to the content that you want to randomly change on your page. Click on Save Changes at the bottom of the screen. Hit the blue Back button to go back to the previous page. Rotating Content Regions: The rotating content region is similar to the random content region with the exception that you can control the rotation of the piece of information. Rotating content may look like Flash, an animation, or a slide show, but it is just images rotating through. Some Photoshop experience is needed to get a more complicated animation. The first step to adding a rotating content region to your page is to click Add above the area where you want to put the content. Then select Rotating Content Region. Click on the Edit icon (little piece of paper and pen) and click on New Content Item. Enter a content name in the box and make sure you know what the name means. Then enter your information in the editor box below. Hit Save changes. You can add as many content items as you would like by repeating these steps. You need to then activate which content regions you want to rotate on that page by clicking on Set Current Content. Check the boxes next to the content that you want to rotate on your page. Click on Save Changes at the bottom of the screen. You also need to set up the properties for the rotation. Click on the Properties link. ~ 29 ~

31 ~ 30 ~ The Width and the Height boxes are for the area that is uses on the page. You will want to set it up to match the original images size. For instance, if you are going to rotate five different photos and the photos are 120 pixels wide and 70 pixels high, you will want to set the Width and Height to 120 and 70 pixels. If you enter a percentage, it will use that percentage; along with it will stretch your image, to the size of the column where this content region is located. It will push the remaining columns out and your website will explode. A: The transition type needs to be chosen to either Slide Show or Scrolling. The transition effect can be used for the Slide Show only and it is how the images rotate through. B: Frame timeout is how long the image is shown before it rotates and changes. It is in milliseconds, so 3000 ms equals 3 seconds. C: The scroll direction can only be used for the scrolling transition type. You can choose to make it scroll up, down, left or right. D: The scrolling speed is how long it takes in milliseconds to scroll. Again, 500 milliseconds equal a half a second. E: The smooth scroll makes the images scroll smoothly, and not quickly jump to the next image. ~ 30 ~

32 ~ 31 ~ F: The smooth scroll delay is how long it takes in milliseconds to smoothly scroll. G: The pause on mouse over is where the rotating content pauses when the mouse is over the content. E: The use random slide makes the images randomly rotate through. Otherwise, if it is not checked, it will automatically rotate through the list you checked. F: The Tool Tip box is where you enter any description that will show up every time someone mouse over the rotating content region. G: The CSS Class allows you to set up a style sheet for the text on the region. H: Hit the blue back button to go back to the page you were working on. Something to keep in mind is that the photos or text should be put in a table so they are always the same size and look consistent. (To fix the table size, right click on the table and select Table Properties and enter in the width box the width that you want the table to be.) HOW TO USE THE FORM BUILDER HOW TO CREATE A FORM Step 1: Click on the blue Control Panel button. Step 2: Next click on Manage Forms. Step 3: To create a new form, type the title in the box under Form Name on the left side of the page and then click Add New Form. Step 4: You should now see the new form you created on the right hand side of the page. You will now have four editing choices: ~ 31 ~

33 ~ 32 ~ The first icon allows you to delete your form The second icon will allow you to copy, or make an exact replica, of your form. The third icon will let you edit/add fields to your form And the last icon allows you to view the entries submitted for your form Step 5: To add form elements, click on the edit button. On the left you will see sixteen Form Elements that can be added to your form. To add one, just click on it and it will automatically add that element on the right hand side of the page. To learn what each element is for and how to edit titles/ add values, please see. Step 6: Once your elements have been added, you can reorder them by clicking and dragging the elements into the correct order. Step 7: If you would like to create two columns for your form, click on the first form element, and type a lowercase L (if you want that element to be in the left column) or a lowercase R (if you want that element to be in the right column) into the box that says Advanced CSS Layout Options : Step 8: When all of your form elements have been added and are in the correct order/columns, click Save Form at the bottom of the form. Now you can edit the form title, descriptions, and settings. ~ 32 ~

34 ~ 33 ~ HOW TO EDIT THE FORM SETTINGS Step 1: Click on Form Settings at the top of the form. Step 2: You can change the title of the form by typing into the box that says Form Title. You can also edit/add a description in the box that says Form Description. Step 3: You can create categories in the Form Manager and select a specific category. You can also add a Form Status. The available statuses are: Disabled, Live, New, and Testing. To create a new Category (do this before you create your form), go to the Form manager and click on the Categories tab. Type in the name you want as the Category and click Add New Category. ~ 33 ~

35 ~ 34 ~ The new Category will now show up in the dropdown list under Form Settings. Step 4: You can create a Thank You for Filling Out this Form page in Webaloo if you would like, and link it to the form. Just click on the Redirect to a new webpage after form submit box. If you do not want to setup a Thank You Page, you can write a custom Thank You Message by typing text into the box. Step 5: If you would like the form submissions to be ed to you, click the box next to Settings and type in an address (you can type more than one by separating them with a comma). Then fill out the Message you would like to see when the form is submitted. Step 6: If you would like your form to take payment, click the box next to Payment Settings. Then choose your Payment Gateway and set a Form Fee. ~ 34 ~

36 ~ 35 ~ Step 7: Remember to click Save Form when you are done. HOW TO ADD A FORM TO A PAGE Step 1: First create the page you want the form to be on (for instructions see How to Create/Edit Forms ). Step 2: Next, click on the Add button in the column you would like the form to be in. Select Form Builder in the list and then click Add New Content Item. Step 3: You should now see text that says No Form Selected. Click on the Edit button above this. Step 4: After you click the Edit button, choose the form you want to place on the page from the dropdown menu and click Save Changes. ~ 35 ~

37 ~ 36 ~ You should now see the form you created on the page. HOW TO VIEW FORM SUBMISSIONS Step 1: Click on the blue Control Panel button. Step 2: Next click on Manage Forms. Step 3: Find the form you want to view submissions for in the column on the right. Then click on the Entries button next to the form on the far right. Step 4: You will now see each submission for this form. If you would like to download all of the form submissions at once, click on the Export Entries: Detail button at the top. This will export all of the submissions into an Excel spreadsheet. Step 5: You can also export individual submissions by click on the Details icon to the right of the submission. ~ 36 ~

38 ~ 37 ~ Step 6: From this page, you can see all of the submissions for each form element. To export the submission, click on the Export Entry: Detail icon at the top. This will export the submission into an Excel spreadsheet. Step 7: After you have viewed/exported the submission, you can then change the status from New to Processed, Canceled, or Other. This will make it easier for you to know when you have new submissions that have not been exported yet. If you click on Entries at the top of the page, you can mark all submissions set as New to Processed, Canceled, or Other. DESCRIPTION OF FORM ELEMENTS/FIELDS The Paragraph Text is a standard area for any medium-to-large amount of text or numbers to be inserted. The Checkbox List inserts a group of checkboxes that may be used to select multiple boxes or options. The Radio Button List gives the user a selection of buttons or options but can only select one of the options per Radio Button Group. Section Break allows you to place a Title and Description for a portion of the form, essentially allowing you the ability to break the form into sections. The Dropdown List element allows one box to have multiple selections that display in a dropdown list. Only one item ~ 37 ~

39 ~ 38 ~ may be selected per Dropdown. Used for the form creator only. The user will not see Hidden fields. These areas can be used to help sort and identify sections or help separate results in the database or . A group of predefined Text Boxes that allows the user to input their Title, First Name, Middle Name, Last Name, and Suffix. A group of predefined Text Boxes and a small calendar icon that create a Date form. A predefined Text Box that creates a Phone form. A group of predefined Text Boxes that creates an form. A predefined Text Box that only accepts a numerical price value. A group of predefined Radio Buttons that create a Price Radio form. This form can be used to indicate a cost per item. Only one Radio Button can be selected at a time. A Total Element will be added as well with this selection which will add the values of the selections and give a total. A group of predefined Check Boxes and Text Boxes that create a Price Checks form. This form can be used to indicate a cost per item. Multiple Check Boxes can be selected at a time. A Total Element will be added as well with this selection which will add the values of the selections and give a total. HOW TO EDIT FORM ELEMENT/FIELD SETTINGS Below you will find definitions/instructions for the basic Field Settings. ~ 38 ~

40 ~ 39 ~ Text Box: Click on 'Text Box' to edit the information or click 'Field Settings' at the top of the page. The form element will turn blue when selected. Field Label: This allows you to inserts a text title for this Form Element. Require This Field: This makes this Form Element a required field for the user to fill in. Predefined Value: This inserts a default value in the Text Box. Instructions for User: This allow you to type text below the Form Element for notes that might help the form user. Field Alignment: Choose 'Align Left' from the dropdown here if you would like this form element to align in the left column or 'Alight Right' if you would like it to align in the right column. Leave as 'Default' if you do not want to align the form element at all. ~ 39 ~

41 ~ 40 ~ Add Field: The 'Add Field' button allows you to add a new form element. Delete: The 'Delete' button allows you to delete the selected form element. Predefined Values: The 'Predefined Values' for Checkboxes and Radio Buttons allow you to type custom choices. You can delete a choice by clicking on the 'Delete' button on the right or add another by click 'Add Checkbox/Add Radio Button' below. Predefined Values for Price Checkboxes and Price Radio Buttons allow you to type custom choices, set a price for each choice, and add an optional account number. You can delete a choice by clicking on the 'Delete' button on the right or add another by click 'Add Checkbox/Add Radio Button' below. ~ 40 ~

42 ~ 41 ~ HOW TO SETUP YOUR WEBMAIL Incoming Server: pop.webaloo.com (port 110) Outgoing Server: smtp.webaloo.com (port 25) Accessing your Webaloo through the internet. 1. Open up an internet browser and delete everything in the address bar (ex Type in domain name) 1. For example: 3. Your user name is the first part of your address before symbol. Your password should have been mailed to you when your account was created. Setting an auto response. Once logged in the webmail click on the 'options' tab, then click on 'auto response.' Set the auto response to 'on' and type your message in the box below. ~ 41 ~

43 ~ 42 ~ Setting up your Webaloo in a mail client. (These instructions are for written for outlook, but the procedure and terminology should be similar for Entourage, Mac Mail, and the iphone.) Inside Outlook click on Tools > Accounts > View or Change existing Accounts > and click the 'add' button. 'Your name' can be set to anything and ' address' should be your full address. Incoming Mail Server: pop.webaloo.com Outgoing Mail Server: smtp.webaloo.com User Name: your full address Password: your password Then click on the 'more settings' tab. Click on the 'Outgoing Server' tab and check "My outgoing server requires authentication. Then click on the advanced tab and click the 'Leave a copy of the message on the server' check box if you want to be able to check your mail from webmail. Remember that you'll have to log into webmail once in awhile and delete your old messages so that you don't run out of storage space. "I receive s fine, but I cannot send mail or connect to the smtp server." If this is the case your ISP has blocked other SMTP servers as a measure to reduce spam inside its network. You must call your ISP and ask for their SMTP server settings and change them accordingly in your mail client. CONTACT US Webaloo P.O. Box 757, Stillwater, MN Phone: Fax: ~ 42 ~