GPTEngine logo

GPTEngine End User Documentation

<prev | up | next>

Templates development

Creating a new template from scratch or converting an existing HTML page to be used as a GPTEngine template is just a matter of proper structure formatting, inclusion of some JavaScript code and snippet usage.

Template structure

GPTEngine templates follow a header + sidebars + main content + footer model. Each container should be represented by a <div> element whose id attribute must observe the following rules:

Template snippets

For a smooth integration with the CMS, the GPTEngine template system includes the following snippets:

Template example

A minimal working GPTEngine template should look something like this:
      <?xml version="1.0" encoding="utf-8"?>
      
      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
          "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
      
      <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en" dir="ltr">
      
        <head>
      
          <title>
      
            [?_page_title_?]
      
          </title>
      
          <base href="[?_site_url_?]/"/>
          
          <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
          <meta http-equiv="content-language" content="en"/>
          <meta http-equiv="imagetoolbar" content="no"/>
              
          <meta name="description" content="[?_page_description_?]"/>
          <meta name="keywords" content="[?_page_keywords_?]"/>
          <meta name="date" content="[?_page_date_?]"/> 
          <meta name="author" content="[?_program_admin_?]"/>
          <meta name="generator" content="GPTEngine [?_gptengine_version_?]"/>
          <meta name="copyright" content="© [?_year_?] by [?_program_name_?]. All Rights Reserved." />
      
          <link rel="stylesheet" type="text/css" href="gpte/css/cms_style.css"/>
             
        </head>
          
        <body>
            
          <div id="header">
      
            [header content goes here...]
      
          </div>
      
          <div id="mainContent">
      
           [?_page_content_?]
      
          </div>
      
          <div id="footer">
      
           [footer content goes here...]
      
          </div>
      
        </body>
      
      </html>
      
© 2015 by popux. All rights reserved.