How to Implement Multiple Themes in the Websites that Generated by PHPMaker 9.0.1

In this article I will show you how to turn your web applications that generated with PHPMaker 9 become support for using multiple themes. As we have already known, PHPMaker will generate your website which include a Cascading Style Sheet (.css) file in order to change the look of your website. Unfortunately, by default, you can only use a generated .css file each time PHPMaker generates your web application. If you want to modify the content of the .css file, then usually you have to do it from your PHPMaker application, afterwards re-generate the .css file. Alternatively, you can modify directly the content of the .css file (only for the advanced developers).

By using the following customization, now you don’t have to modify the content of your .css file anymore. In addition, you don’t have to re-generate several .css files each time you generate your website using PHPMaker. There are 16 themes I created, and of course, you are able to download all of them and put them to your phpcss sub directory. I will also show you how you can switch from one theme to another easily and quickly. Not only that, now you are able to provide the different theme for your users. For example, user A chooses theme 1, then each time user A is successfully logged, he/she will see your web application in theme 1, whereas user B is choosing and running the different theme than user A.

All we have to do is customizing the PHPMaker template files. In other words, we do not modify any generated script files.

Updated on May 30, 2012: This customization has been implemented in PHPMaker version 9.0.2, it matches to each other, and as a result, it works properly.

Updated on July 22, 2012: This customization has been implemented in PHPMaker version 9.0.3, it matches to each other, and as a result, it works properly.

Updated on September 5, 2012: This customization has been implemented in PHPMaker version 9.0.4, it matches to each other, and as a result, it works properly.

Updated on November 29, 2012: This customization has been implemented in PHPMaker version 9.1.0, it matches to each other, and as a result, it works properly.

Updated on February 9, 2013: This customization has been implemented in PHPMaker version 9.2.0, it matches to each other, and as a result, it works properly.

Updated on June 17, 2013: The customization has been handled by using MasinoFixedWidthSite extension. You don’t need to implement the customization below if you use my extensions together with the original PHPMaker Template and Extension files.

[hidepost]

1. Download this file and extract all of the files to your \Script\ directory.
2. Open your \Script\control.xml file, and find this code:

   	<!--
   		Js
   	 -->
   	<control id="ew.js" type="other" ofolderid="_js" ifiles="ewp.js" ofile="ewp9" oext="js">
   		<session type="key" value="jscommon" />
   	</control>
   

   after the last line of that code, please insert the following code:

     <!--
       Themes menu
     -->
   	<control id="themeblack.php" type="copy" remark="Copy themeblack.php" ifiles="themeblack.php" />
   	<control id="themeblue.php" type="copy" remark="Copy themeblue.php" ifiles="themeblue.php" />
   	<control id="themedark.php" type="copy" remark="Copy themedark.php" ifiles="themedark.php" />
   	<control id="themedarkglass.php" type="copy" remark="Copy themedarkglass.php" ifiles="themedarkglass.php" />
   	<control id="themedefault.php" type="copy" remark="Copy themedefault.php" ifiles="themedefault.php" />
   	<control id="themeglass.php" type="copy" remark="Copy themeglass.php" ifiles="themeglass.php" />
   	<control id="themegray.php" type="copy" remark="Copy themegray.php" ifiles="themegray.php" />
   	<control id="themegreen.php" type="copy" remark="Copy themegreen.php" ifiles="themegreen.php" />
   	<control id="thememaroon.php" type="copy" remark="Copy thememaroon.php" ifiles="thememaroon.php" />
   	<control id="themeolive.php" type="copy" remark="Copy themeolive.php" ifiles="themeolive.php" />
   	<control id="themeprofessional.php" type="copy" remark="Copy themeprofessional.php" ifiles="themeprofessional.php" />
   	<control id="themepurple.php" type="copy" remark="Copy themepurple.php" ifiles="themepurple.php" />
   	<control id="themered.php" type="copy" remark="Copy themered.php" ifiles="themered.php" />
   	<control id="themesand.php" type="copy" remark="Copy themesand.php" ifiles="themesand.php" />
   	<control id="themesilver.php" type="copy" remark="Copy themesilver.php" ifiles="themesilver.php" />
   	<control id="themewhite.php" type="copy" remark="Copy themewhite.php" ifiles="themewhite.php" />
   	
   	<!--
   		Css
   	 -->
   	<control id="theme-black.css" type="copy" remark="Copy theme-black.css" ofolderid="_css" ifiles="theme-black.css" />
   	<control id="theme-blue.css" type="copy" remark="Copy theme-blue.css" ofolderid="_css" ifiles="theme-blue.css" />
   	<control id="theme-dark.css" type="copy" remark="Copy theme-dark.css" ofolderid="_css" ifiles="theme-dark.css" />
   	<control id="theme-darkglass.css" type="copy" remark="Copy theme-darkglass.css" ofolderid="_css" ifiles="theme-darkglass.css" />
   	<control id="theme-default.css" type="copy" remark="Copy theme-default.css" ofolderid="_css" ifiles="theme-default.css" />
   	<control id="theme-glass.css" type="copy" remark="Copy theme-glass.css" ofolderid="_css" ifiles="theme-glass.css" />
   	<control id="theme-gray.css" type="copy" remark="Copy theme-gray.css" ofolderid="_css" ifiles="theme-gray.css" />
   	<control id="theme-green.css" type="copy" remark="Copy theme-green.css" ofolderid="_css" ifiles="theme-green.css" />
   	<control id="theme-maroon.css" type="copy" remark="Copy theme-maroon.css" ofolderid="_css" ifiles="theme-maroon.css" />
   	<control id="theme-olive.css" type="copy" remark="Copy theme-olive.css" ofolderid="_css" ifiles="theme-olive.css" />
   	<control id="theme-professional.css" type="copy" remark="Copy theme-professional.css" ofolderid="_css" ifiles="theme-professional.css" />
   	<control id="theme-purple.css" type="copy" remark="Copy theme-purple.css" ofolderid="_css" ifiles="theme-purple.css" />
   	<control id="theme-red.css" type="copy" remark="Copy theme-red.css" ofolderid="_css" ifiles="theme-red.css" />
   	<control id="theme-sand.css" type="copy" remark="Copy theme-sand.css" ofolderid="_css" ifiles="theme-sand.css" />
   	<control id="theme-silver.css" type="copy" remark="Copy theme-silver.css" ofolderid="_css" ifiles="theme-silver.css" />
   	<control id="theme-white.css" type="copy" remark="Copy theme-white.css" ofolderid="_css" ifiles="theme-white.css" />
   

3. Create 16 menu item and then assign the .php file with the 16 files from the multipletheme-scripts.zip file above.
4. Alter your users table (please note that this table name could be different with yours, adjust it with your users table name), by adding a new field named theme which has field type as VARCHAR(20). This new field is important in order to save the theme that user chooses, so each user is able to select the different theme that other users selected.
5. Implement this customization which will alter your users table too, by adding two new fields. They are:
   - current_url (text)
   - redirect_to_last_visitted_page_after_login (type=enum; values=’Y’, ‘N’; default=’Y’)
6. Go to your PHPMaker application, then expand this: Server Events -> Global -> All Pages -> Page_Loading, and then insert the following code into the function in the right pane:

   // Begin of modification Multiple Theme, by Masino Sinaga, May 12, 2012
       global $conn;
       $user_table = "employees"; // <--- IMPORTANT: Change it with yours!
       $user_id_field = "EmployeeID"; // <--- IMPORTANT: Change it with yours!
       $sSqlu = "SELECT * FROM ".$user_table ."
                 WHERE ".$user_id_field." = '".CurrentUserName()."'";
       $rsu = $conn->Execute($sSqlu);
       $user_theme = ($rsu->fields("theme")=="")? "theme-default.css" : $rsu->fields("theme");
       // assuming in your users table, you have a field "theme" that stores the .css filename
       @define("EW_PROJECT_STYLESHEET_FILENAME", 'phpcss/'.$user_theme, FALSE);   
       // this code above will override the default stylesheet filename in your configuration file    
   // End of modification Multiple Theme, by Masino Sinaga, May 12, 2012
   
   

7. Re-generate all your script files using PHPMaker as always.

[/hidepost]