PHP Development Framework Yii Framework Tutorial (47) Topic Theme Sample

Theming is a systematic way to customize the appearance of a Web page in a Web application. By adopting a new theme, it is very convenient to change the appearance of the application.

In Yii, each topic is represented by a directory containing view files, layout files, and related resource files such as pictures, CSS files, JavaScript files, and so on. The name of the subject is his directory name. All topics are placed under the same directory webroot/themes. At any time, only one theme can be activated.

Tip: The default theme root directory Webroot/themes can be configured as a different. You only need to configure the properties of the Thememanager application BasePath and BaseURL for the value you want.

To activate a theme, set the properties of the Web application theme for the name you want. Can be configured in the application configuration or modified during the execution of the controller's actions.

Note: The topic name is case-sensitive. If you try to start a theme that does not exist, Yii:: App ()->theme will return null.

The content in the subject directory is organized in the same way that it is organized under the application Base path directory. For example, all view files must be located under Views, Layout view files under Views/layouts, and System view files under Views/system. For example, if we were to replace the Postcontroller create view file with the classic theme, we would save the new view file as webroot/themes/classic/views/post/create.php.

For the controller view file inside the module, the corresponding theme view file will be placed in the views directory. For example, if the above Postcontroller is in a module named forum, we should save the CREATE view file as webroot/themes/classic/views/forum/post/create.php. If the Forum module is nested within another named support module, the view file should be webroot/themes/classic/views/support/forum/post/create.php.

This example adds two activeform to this example by modifying the Yii Framework Development tutorial (one) UI component, and for simplicity, two subject names are Cyan,grey, with their background color named.

First create the Themes directory under the application directory structure, then create the Cyan,grey two subdirectories, and then copy the default Protected/views to two subdirectories, as the initial version of theme.

and use yii default CSS definition, also copied to two subject subdirectories, as the original CSS file.

The following two themes under the CSS file slightly modified to show the difference, modify the css/main.css to modify the background color of the body

Body      
{
    margin:0;
    padding:0;
    Color: #555;
    Font:normal 10pt Arial,helvetica,sans-serif;
    Background: #00FFFF;
}

The colors for cyan and grey are respectively.

Then modify the layout/main.php reference topic under the CSS file, in a topic view, we often need to link to other theme resource files. For example, we might want to display an image file in the images directory under the theme. Using the BaseURL property of the currently active theme, we can generate the following URL for this image file

Yii:: App ()->theme->baseurl. 

' /images/filename.gif '

The modified layout file is as follows:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional . DTD ">