<style>
  #pageProperties{
    width: 100%;
  }

  #pageProperties *{
    font-size: 11px;
  }

  #pageProperties select, #pageProperties select *{
    font-size: 13px;
  }

  #pageProperties th{
    width: 20%;
    text-align: left;
    font-size: 12px;
  }

  #pageProperties tr td {
    padding-bottom: 10px;
  }
  
  #pageProperties .text{
    width: 85%;
  }
  
  #pageProperties textarea{
    height: 90px;
  }
</style>
<div id="pageProperties">
  <form class="ajax" action="{siteURL}{defaultController}/{adminFunction}/savePageProperties/?controller={controller}&function={function}" method="post" ajaxOutput="#editPagePropertiesStatus">
    <table>
      <tr>
        <th>Controller</th>
        <td>{controller}</td>
      </tr>
      <tr>
        <th>Function</th>
        <td>{function}</td>
      </tr>
      <tr>
        <th>Page Title</th>
        <td><input type="text" value="{pageTitle}" name="pageTitle" class="siteMapPageTitle text"/></td>
      </tr>
      <tr>
        <th>Section Title</th>
        <td><input type="text" value="{title}" name="title" id="title" class="siteMapTitle text"/></td>
      </tr>
      <tr>
        <th>SEF Link</th>
        <td><input type="text" value="{sefTitle}" name="sefTitle" id="sefTitle" class="siteMapSefTitle text"/></td>
      </tr>
      <tr>
        <th>Meta Description</th>
        <td><textarea type="text" name="metaDesc" class="siteMapMetaDesc text" >{metaDesc}</textarea></td>
      </tr>
      <tr>
        <th>Meta Keywords</th>
        <td><input type="text" value="{metaKeys}" name="metaKeys" class="siteMapMetaKeys text"/></td>
      </tr>
      <tr>
        <th>Page Template</th>
        <td>{selectPageTemplate}</td>
      </tr>
      <tr>
        <th>Banner URL</th>
        <td>
          <input type="text" value="{bannerURL}" name="bannerURL" class="siteMapBannerURL text" />
          <input type="button" value="Select" class="serverBrowser" target=".siteMapBannerURL" />
        </td>
      </tr>
      <tr>
        <th colspan="2"><input type="checkbox" name="allowVisitorComments" {allowVisitorComments}/> Allow visitors to leave a comment for this page</th>
      </tr>
      <tr>
        <th colspan="2"><input type="checkbox" name="showVisitorComments" {showVisitorComments}/> Show visitor comments</th>
      </tr>
      <tr>
        <th colspan="2"><input type="checkbox" name="enableCommentModeration" {enableCommentModeration}/> Enable Comment Moderation</th>
      </tr>
      <tr>
        <th>Comments Moderator Email Address</th>
        <td><input type="text" value="{commentsModeratorEmailAddress}" name="commentsModeratorEmailAddress" id="commentsModeratorEmailAddress" class="siteMapCommentsModeratorEmailAddress text"/></td>
      </tr>
    </table>

    <input type="submit" value="Save" /><input type="button" value="Cancel" onclick="hideEditPageProperties(this)"/>
    <div id="editPagePropertiesStatus"></div>
  </form>
  <br />
  <h2>Manage Child Pages: ( You can drag and drop the child pages and re-order them  )</h2><br />
  <a id="addNewChildPage" href="javascript:void(false)">Add New Child Page<br /></a>
  <div id="addNewChildPageDiv" style="display:none;">
    <br />Page Identifier ( MUST BE A UNIQUE STRING ): <br /><input type="text" id="newPage" value="" />
    <input type="button" value="Add" id="addNewChildPageBtn"/>
    <input type="button" value="Cancel" id="cancelAddNewChildPageBtn" />
  </div>
  <br />
  <div id="applyNewSortOrderDiv" style="display:none;">
    <br />
    <input type="button" id="applyNewSortOrderBtn" value="Apply New Sort Order"/>
  </div>
  <div id="childNodes">
    {childNodes}
  </div>
</div>