The following describes how templates can be created with Smarty, to achieve a clear demarcation between programming and design. Smarty is a free PHP template engine and can be downloaded from the following URL https://www.smarty.net/download.
The following requirements must be met:
-
A folder "smarty" is created in the main directory of Xentral. In this directory the downloaded file is unpacked
-
A folder "smarty" is created in www/pages/content. In this directory the templates relevant for smarty are created
-
The file "smartytest.php" is created in the www/pages/ folder. All examples shown here refer to this file
-
The file "smartytest_list.php" is created in the folder www/pages/content/. This file is the target for the HTML generated by Smarty
First, a simple module and a simple template will be created. For more details in the manual entry for creating modules. The file "smartytest_list.php" contains only one line, because all HTML is generated by Smarty:
The file "smartytest.php" gets the following content:
Relevant is the 2nd line: include_once("../smarty/libs/Smarty.class.php");. This will include Smarty and it can then be used.
To use Smarty in xentral, the following procedure must be followed: First initiate the Smarty object and assign values to the Smarty object. Then assign a template to the Smarty object to which the values are to be applied. The smartyobject then generates the HTML code. This is to be assigned to the xentralstemplate and parse the xentralstemplate. For the use of a Smarty the Smartytemplate is still missing. For this you have to create in the folder www/pages/content/smarty the file "smartytest.tpl" ,This template will contain the HTML code, variables and controls used by Smarty. The content of the template file will look like this:
In smartytest.php, the SmartyTestList function is modified as follows:
The subsequent program sequence follows the scheme described above:
-
$smarty = new Smarty → A new Smarty object is created
-
$smarty->assign('text', 'Textual Content') → Tells the smartyobject that the variable 'text' should contain the value 'textual content'
-
$html = $smarty->fetch('../www/pages/content/smarty/smartytest.tpl') → Makes the smarty object generate the HTML code
-
$this->app->Tpl->Set('SMARTY', $html) → Assigns the xentralstemplate the HTML code
-
$this->app->Tpl->Parse("PAGE", "smartytest_list.tpl") → Parse the Xentralstemplate
The result then looks like this:
Here you can see that {$text} has been replaced by "Textual content".
Smarty does not just replace simple text modules. To be able to use Smarty functionally, a few additional modules are needed. For this the following has to be done with Smarty:
Afterwards smartytest.tpl is extended: :developer:smarty11.png?nolink Additionally four new files are created in the directory www/pages/content/smarty/:
-
The file parent.tpl:
-
The child.tpl file:
-
The layout_divwithborder_header.tpl file:
-
The layout_divwithborder_footer.tpl file:
When the module is subsequently reloaded, three tabs appear.
In the first tab you can see that a red box frames the text. This red box is created by importing the line {include file="pages/content/smarty/layout_divwithborder_header.tpl" color="$color"} imports the file "layout_divwithborder_header.tpl". In this file there is only one line which opens a div with border. The line {include file="pages/content/smarty/layout_divwithborder_footer.tpl"} imports the counterpart of this div, namely a closing tag. Additionally, you can see that with color="$color" a variable is passed to the template to be imported. Here the flow is as follows: The smartyobject is told in line 20 that the variable "color" has the value "red". In line 42 the process for generating the HTML code is started and in smartytest.tpl the template "layout_divwithborder_header.tpl" is loaded in line 10. Thereby the variable "color" with the value "red" is passed to the template. Afterwards in smartytest.tpl in line 12 the same is done for the template "layout_divwithborder_footer.tpl".
In the second tab you can see a green bordered div with content. On code page line 15 of "smartytest.tpl" imports the template "child.tpl". This template inherits from "parent.tpl". The green bordered one is taken from the parent template but the content is overwritten by the inheriting template. For this the {block} elements are crucial. The child replaces the blocks with the information from its own blocks, provided that it has its own blocks with corresponding names. If the parent element has blocks that are not overwritten by the child, the blocks of the parent template are displayed. If, on the other hand, the child has blocks that the parent template does not have, they will not be displayed at all.
The third tab is condtional. It only appears if at least one article was found in the SQL query in "smartytest.php". If this is the case, the tab name is assigned to the variable "tab" in line 24. On the template page is checked in "smartytest.tpl" in line 5, if the variable is an empty string. If the variable is not empty, the list item will be displayed in the next line and the name is specified with the variable content. Additionally a combo box and two tables are filled in this tab. To fill the combo box the smartyobject only two arrays have to be passed: $smarty->assign on the smart object side: $smarty->assign('id', $idarray); and $smarty->assign('name', $namearray);.
The smarty object then takes over the generation of the individual ... elements.
In the template, an array is looped in line 26, analogous to the syntax in PHP. Here, for each array element, the code is executed in the loop. That means: For each item a new line is created. The {strip}...{/strip} tags remove line breaks and excess whitespace, which could interfere with the display. In this example the absence would not make a difference but they should be mentioned. On line 40, an associative array is looped through; here you can see how access to the individual values can be realized via the key.