14.2. Modifying the PHP-Nuke theme HTML template
In this section we will see how to modify the HTML template that is used by the PHP-Nuke themes to display our page. Topics covered are:
Example creation of HTML file to include in the theme (Section 14.2.1).
14.2.1. Example creation of HTML file to include in the theme
We will not analyse the HTML syntax of all the files, we think it's better that you understand the principles that are used and that you learn a few tricks that allow you to use a visual editor such as DreamWeaver.
- Example:
The block is created in this way:
<table border="0 "cellpadding="1" cellspacing="0 "bgcolor="#000000" width="150 "><tr><td> <table border="0 "cellpadding="3" cellspacing="0 "bgcolor="#dedebb" width="100% "><tr>< td align="left" > <font class="content "color="#363636" ><b> $$title </b ></font> </td></tr></table></td></tr></table> <table border="0 "cellpadding="0" cellspacing="0 "bgcolor="#ffffff" width="150 " > <tr valign="top "><td bgcolor="#ffffff"> $content </td></tr></table> < br >
As you see, we create a table of fixed width (in our case 150) and we assign it some colours (for the background etc...). We also assign two variables ($title and $content) that will, once included in theme.php, load the title and the content of the block. It would have been useful, for a code clarity reasons, to define background values in the CSS tables instead.
To have all the necessary cases to get the conclusions of this chapter and to write a pair of rules, we have to analyse a very simple module that includes a case we have still not mentioned, the images management:
</td><td><img src="themes/NukeNews/images/pixel.gif "width="15" height="1 "border="0" stop = ""> </td><td valign="top" width="100%"> |
The image is a spacer that adds a space of 15 pixels, but where do we load the image from? Which path do we have to assign it? Remember that the theme.php file is included in the PHP-Nuke root directory , so the image path must start from root to the indicated theme. The path to the image "pixel.gif" is "themes/NukeNews/images/pixel.gif"
 | Attention! |
|---|---|
When you add images in an automatic way by using a visual editor, the path will be only images/image.gif, and you will have to correct it by hand, adding the correct path. |
Another trick is to assign, in theme.php, a variable to the name of the theme, to make it independent from possible changes of the folder name. So for the variable $nameoftheme = " NukeNews ", the syntax of the image path will be:
<img src="themes/$nameoftheme/images/pixel.gif"> |