# Managing your business with anyPiece/WYSIWYG Web editor/Web designer or programmer/Create page template
## Create page template

* Click New Page Template button on Template Tab
* You will see Template Editor dialog.
* Enter template name, and select any of the template type
* Optional: Preview is Preview Image for new page. This image will be use when we create new page. Use Upload Picture button to upload image preview or use Clear Preview button to use default Preview Image.
* Once you have selected all the above, you can enter your code into the code editor
* Use Upload Template button to upload html/htm/txt file from your Computer or use Download button to download text from code editor to your computer
* Warning: By click on Clear Page Data button, all page's data which related to this template will cleared.
* Click Save & Close to save this template. You must provide Unique Template Name to save template

### Template type

| Template Type | Description |
| Master | Master pages provide templates for other pages on your web site. A master page provides a template for other pages, with shared layout and functionality. Master page must have content tag. |
| Content | Content Page is a page that is associated to a Master Page. A Content Page will contain only mark-up and controls for that page. Content page will override content tag on master page. |
| Login | Login page is a page will use by user to insert *username and password* to access locked page. |
| Logout | Logout page is a page using to *clear login information* |
| Block | Block page is a page use by *render engine* to show error message like page not found. You can add *Error Message *tag to this page |

#### Master Page

If you choose page type is Master, Master Page will be hide because you cannot set Master Page for Master Page.

#### Other Page

* If you choose other page type, Master Page will show and you can choose default Master Page for this template.

## Tutorial
### Exercise 2: Create Master Page Template

* Go to WebEditor Manager
* Make sure Website “example website” is selected
* Click on new page template button to create first page template (Master Page)
* Insert this data to Template Editor dialog :
| Field | Value |
| Name | Master Page |
| Type | Master |
| Code Editor | <html> <head> <title> <!--ap type='website_title'/--> : <!--ap type='page_title'/--> </title> </head> <body> <!--ap type='content'/--> </body> </html> |

### Exercise 3: Create Content Page Template

* Click on new page template button to create second page template (Content Page)
* Insert this data to Template Editor dialog:
| Field | Value |
| Name | Main page |
| Type | Content |
| Master Page | Master Page |
| Code Editor | <h1>Welcome To <!--ap type='website_title'/--></h1> <p> This is page <b><!--ap type='page_title'/--></b></br> </p> |

### Exercise 4: Create Error Page Template

* Click on new page template button to create second page template (Error Page)
* Insert this data to Template Editor dialog and click OK
| Field | Value |
| Name | Error |
| Type | Block |
| Master Page | Master Page |
| Code Editor | Oppsss... <!--ap type='err_msg'/--> |

### Exercise 5: Create Login Page Template

* Click on new page template button to create second page template (Login Page)
* Insert this data to Template Editor dialog and click OK
| Field | Value |
| Name | Login |
| Type | Login |
| Master Page | Master Page |
| Code Editor | <div class='err_msg' style='display:none;'>Please Login to Continue</div><br /> Username : <input type='text' value='' id='txt_user' style='width:200px;' /><br /> Password : <input type='password' value='' id='txt_password' style='width:200px;' /><br /> <input type='button' value='Login' onclick='do_login' /> |

### Exercise 6: Create Logout Page Template

* Click on new page template button to create second page template (Logout Page)
* Insert this data to Template Editor dialog and click OK
| Field | Value |
| Name | Logout |
| Type | Logout |
| Master Page | Master Page |
| Code Editor | You has been logout for this website. <br /> Click <a href="main"><b>here</b></a> to go to Main page |