Front-end Cookbook

From PKP Wiki
Revision as of 15:22, 30 September 2013 by Alec (Talk | contribs) (Introductory basics)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to: navigation, search


This document describes the elements in a typical piece of the front-end of a PKP application, starting from the ground up. You can follow these steps with a working installation of OJS (currently written for the ojs-alpha-3_0 branch, which represent OJS 3.0 alpha).

This will illustrate templates, pages, controllers, and finally a custom grid, starting with the simplest example and moving up in complication.


Page classes are described in the OJS Technical Reference (see e.g. See also the introduction to request handling at for a description of how URLs are constructed.

Creating a New Page

Start by creating a directory called "pages/test".

The wrapper class

Create a file called pages/test/index.php with the following contents:

switch($op) {
        case 'myoperation':
                define('HANDLER_CLASS', 'TestHandler');

This wrapper whitelists operations and maps them to a specific handler class.

The handler class

Create the pages/test/ handler class which implements the "myoperation" function, identified in the whitelist above.


class TestHandler extends Handler {
        function myoperation($args, $request) {
                echo "This is my operation.";

Testing the page

Browse to e.g. http://.../index.php/[journal path]/test/myoperation and you should see...

This is my operation.

Adding a Template

To make this example more realistic, change the implementation of the {myoperation} function above to read...

        function myoperation($args, $request) {
                $templateMgr = TemplateManager::getManager($request);
                $templateMgr->assign('someVariable', $request->getUserVar('someVariable'));

Create the template file in "templates/test/myoperation.tpl":

This is a Smarty template.
The value of someVariable is "{$someVariable|escape|default:"<i>(nothing)</i>"}".

Adding a URL parameter called "someVariable" to the browser's URL will cause the value of the variable to be displayed.