Page tree
Skip to end of metadata
Go to start of metadata

Developing a page template is a technical process strictly for web developers.  By developing a page template, it allows us to reuse page designs for multiple pages.


Step-by-step guide

  1. Log into the Livewhale CMS and go to the dashboard.
  2. Decide which group you want to have access to the template.
    1. If you want to restrict the template to a specific group, select that group in Livewhale.
    2. If you want the template to be available to all groups, select the TEMPLATES group in Livewhale.
  3. Create a new page:
    1. Click on the PAGES tab in Livewhale.
    2. On the PAGES tab, click  and then click CREATE A NEW PAGE 
    3. You will see a window similar to the following.  Enter a PAGE TITLE and select the PAGE TEMPLATE you would like to use to build your template with, then click CREATE THIS PAGE.
  4. Click on SAVE THESE CHANGES.
  5. You will now see your new template listed, click on the template name.
  6. You will now see a screen similar to the following.  Click on VIEW OR EDIT THIS PAGE.
  7. Click on EDIT PAGE.


    The sections of the page that have a yellow borders are editable fields where content can be added.  There are two types of editable fields: OPTIONAL & NOT OPTIONAL

    OPTIONAL fields, if left blank, will be hidden when the page is published.  The following code is used to create optional fields:

    <div class = “editable”></div>

    NON-OPTIONAL fields will appear on the page regardless of whether it is blank or not.  The following code is used to create non-optional fields:

    <div class = “editable optional”></div>
  8. Make edits to your template.

    1. In order to make edits to the code, you will need to SFTP into Rupert. 
    2. Once you are connected, look for a directory with the group name that the template was saved under.  Once you find the directory, you should see a sub-directory with the name of the template you created. 
    3. Open the file in the sub-directory using your favorite code editor and make the desired code changes to the OPTIONAL and NON-OPTIONAL fields.

      NOTE**  In theory, the only two things are needed to take any PHP/HTML page and transform it into a LiveWhale template are:

    1.       The file must starts with:
        <?php require $_SERVER[‘DOCUMENT_ROOT’].’/livewhale/frontend.php’;?>

 b.       There must be at least one content area with:

        <div class = “editable”></div>


      9. Once all of your edits are finished, transfer the file via SFTP back onto the server in the same location it was retrieved from.

    10.  Log back into the Livewhale CMS and go to the dashboard and make sure you are logged in under the same group as you were prior.

    11.  Click on the PAGES tab and click on the page that you edited.

  12.  On the EDIT PAGE DETAILS page, you should now see a checkbox titled USE THIS PAGE AS A TEMPLATE under TEMPLATE INFORMATION.  Click on this checkbox and then click the SAVE THIS PAGE button.

13. Once the template is saved, you can make additional modifications to the source code from within the Livewhale CMS if needed.  To do this, click on VIEW OR EDIT THIS PAGE from the EDIT PAGE DETAILS page.

14.  On the next page, you should now see a button titled EDIT SOURCE.  Click on this button to make additional modifications to the source code if needed.