Now that we are done with the setup and the frontend controller we need to move to backend.

The backend files for a module are located in the Admin folder inside the module folder, so we need to create folder Admin in the Module\Blog folder.

Now we need to create inside the new created Admin folder the page used for displaying a table with the posts.

This controller that outputs the administration page works almost the same as the frontend page controller.

Some differences are that the filename is now AdminPage.class.php, namespace has now appended \Admin and we don't need any more the ogimage property.

The javascript and stylesheet files are loaded from the admin/js and admin/css folders. If we need a custom javascript or css file that we create in our module folder we need to put a path like this: ../Module/MODULE_NAME/Admin/JS_FILENAME.js or ../Module/MODULE_NAME/Admin/CSS_FILENAME.css

The content of AdminPage.class.php file

//PSR-0 namespace
namespace Module\Blog\Admin;

class AdminPage extends \Controller\AdminPage {
	public function output() {
		$page = new \stdClass();
		$page->title = __('Edit posts');
		$page->h1 = __('Edit posts');
		//Combobox javascript is used to filter by username
		$page->js = array('js/combobox.js','plugins/datatables/jquery.dataTables.js','plugins/datatables/fnReloadAjax.js','plugins/datatables/dataTables.bootstrap.js','plugins/ckeditor/ckeditor.js','js/jsall.js','../Module/Blog/Admin/blog.js');
		$page->css = array('plugins/datatables/dataTables.bootstrap.css');
		//All filters need to have "tableFilter" css class
		$page->content = '<div class="box">
	<div class="box-header"><h3 class="box-title">' . __('Edit posts') . '</h3></div>
	<div class="box-body">
		<table id="data_table" class="table table-bordered table-hover">
			<thead>
				<tr>
					<th>#<br /><input type="text" id="idf" class="tableFilter form-control" size="2"></th>
					<th>' . __('Title') . '<br /><input type="text" size="10" id="titlef" class="tableFilter form-control"></th>
					<th>' . __('Author') . '<br /><input type="text" size="2" id="authorf" class="tableFilter ui-autocomplete-input autocomplete-author form-control" autocomplete="off" /></th>
					<th>' . __('Updated on') . '</th>
					<th>' . __('Status') . '<br /><select id="statusf" class="tableFilter form-control"><option value="-1">' . __('Any') . '</option><option value="0">' . __('Hidden') . '</option><option value="1">' . __('Published') . '</option></select></th>
					<th>' . __('Actions') . '</th>
				</tr>
			</thead>
			<tbody>
			</tbody>
		</table>
	</div>
	<button id="add" class="btn btn-primary">' . __('Add') . '</button>
</div>
<div id="ppEdit" class="modal dialog">
	<div class="modal-dialog" style="width: 80vw;">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="' . __('Close') . '">
					<span aria-hidden="true">×</span>
				</button>
				<h4 class="modal-title">' . __('Edit post') . '</h4>
			</div>
			<div class="modal-body" id="edtable">
				<div class="form-group">
					<label for="edtitle">' . __('Title') . '</label>
					<input type="text" class="form-control" id="edtitle" name="edtitle" placeholder="' . __('Title') . '" />
                </div>
                <div class="form-group">
					<label for="edcontent">' . __('Content') . '</label>
					<textarea id="edcontent" name="edcontent" class="form-control" rows="20" cols="300" placeholder="' . __('Content') . '"></textarea>
                </div>
                 <div class="form-group">
					<label for="eddescription">' . __('Description') . '</label>
					<textarea id="eddescription" name="eddescription" class="form-control" rows="20" cols="300" placeholder="' . __('Description') . '"></textarea>
                </div>
                <form action="" method="post" id="imageUploadForm">
					<div class="form-group">
						<label for="edimage">' . __('Image') . '</label>
						<input type="file" class="form-control" id="edimage" name="edimage" placeholder="' . __('Image') . '" />
						<img id="imagePreview" src="" data-default="default.jpg" data-folder="posts" />
					</div>
				</form>
				<div class="form-group">
					<label for="edstatus">' . __('Status') . '</label>
					<select id="edstatus" name="edstatus" class="form-control"><option value="1">' . __('Active') . '</option><option value="2">' . __('Blocked') . '</option></select>
                </div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default pull-left" data-dismiss="modal">' . __('Close') . '</button>
				<button type="button" class="btn btn-primary" id="save">' . __('Save') . '</button>
			</div>
		</div>
	</div>
</div>';
		return $page;
	}
}