Yii - 主题

  • 简述

    主题化可帮助您将一组视图替换为另一个视图,而无需修改原始视图文件。您应该设置视图应用程序组件的theme属性以使用主题。
    您还应该定义以下属性 -
    • yii\base\Theme::$basePath - 定义 CSS、JS、图像等的基本目录。
    • yii\base\Theme::$baseUrl - 定义主题资源的基本 URL。
    • yii\base\Theme::$pathMap - 定义替换规则。
    例如,如果您在 UserController 中调用$this->render('create') ,则会渲染@app/views/user/create.php视图文件。不过,如果您像在以下应用程序配置中那样启用主题,则将呈现视图文件 @app/themes/basic/user/create.php。
    第 1 步- 以这种方式修改config/web.php文件。
    
    <?php
       $params = require(__DIR__ . '/params.php');
       $config = [
          'id' => 'basic',
          'basePath' => dirname(__DIR__),
          'bootstrap' => ['log'],
          'components' => [
             'request' => [
                // !!! insert a secret key in the following (if it is empty) - this
                   //is required by cookie validation
                'cookieValidationKey' => 'ymoaYrebZHa8gURuolioHGlK8fLXCKjO',
             ],
             'cache' => [
                'class' => 'yii\caching\FileCache',
             ],
             'user' => [
                'identityClass' => 'app\models\User',
                'enableAutoLogin' => true,
             ],
             'errorHandler' => [
                'errorAction' => 'site/error',
             ],
             'mailer' => [
                'class' => 'yii\swiftmailer\Mailer',
                // send all mails to a file by default. You have to set
                // 'useFileTransport' to false and configure a transport
                // for the mailer to send real emails.
                'useFileTransport' => true,
             ],
             'log' => [
                'traceLevel' => YII_DEBUG ? 3 : 0,
                'targets' => [
                   [
                      'class' => 'yii\log\FileTarget',
                      'levels' => ['error', 'warning'],
                   ],
                ],
             ],
             'view' => [
                'theme' => [
                   'basePath' => '@app/themes/basic',
                   'baseUrl' => '@web/themes/basic',
                   'pathMap' => [
                      '@app/views' => '@app/themes/basic',
                   ],
                ],
             ],
             'db' => require(__DIR__ . '/db.php'),
          ],
          'modules' => [
             'hello' => [
                'class' => 'app\modules\hello\Hello',
             ],
          ],
          'params' => $params,
       ];
       if (YII_ENV_DEV) {
          // configuration adjustments for 'dev' environment
          $config['bootstrap'][] = 'debug';
          $config['modules']['debug'] = [
             'class' => 'yii\debug\Module',
          ];
          $config['bootstrap'][] = 'gii';
          $config['modules']['gii'] = [
             'class' => 'yii\gii\Module',
          ];
       }
       return $config;
    ?>
    
    我们添加了视图应用程序组件。
    第 2 步 - 现在创建web/themes/basic目录结构和theme/basic/site。在themes/basic/site 文件夹中,使用以下代码创建一个名为about.php的文件。
    
    <?php
       /* @var $this yii\web\View */
       use yii\helpers\Html;
       $this->title = 'About';
       $this->params['breadcrumbs'][] = $this->title;
       $this->registerMetaTag(['name' => 'keywords', 'content' => 'yii, developing,
          views, meta, tags']);
       $this->registerMetaTag(['name' => 'description', 'content' => 'This is the
          description of this page!'], 'description');
    ?>
    <div class = "site-about">
       <h1><?= Html::encode($this->title) ?></h1>
         
       <p style = "color: red;">
          This is the About page. You may modify the following file to customize its content:
       </p> 
    </div>
    
    第 3 步- 现在,转到http://localhost:8080/index.php?r=site/about,将呈现themes/basic/site/about.php文件,而不是views/site/about.php
    创建主题
    第 4 步- 要主题模块,以这种方式配置 yii\base\Theme::$pathMap 属性。
    
    'pathMap' => [
       '@app/views' => '@app/themes/basic',
       '@app/modules' => '@app/themes/basic/modules',
    ],
    
    第 5 步- 要主题小部件,以这种方式配置yii\base\Theme::$pathMap属性。
    
    'pathMap' => [
       '@app/views' => '@app/themes/basic',
       '@app/widgets' => '@app/themes/basic/widgets', // <-- !!!
    ],
    
    有时您需要指定一个包含应用程序基本外观的基本主题。为了实现这个目标,您可以使用主题继承。
    第 6 步 - 以这种方式修改视图应用程序组件。
    
    'view' => [
       'theme' => [
          'basePath' => '@app/themes/basic',
          'baseUrl' => '@web/themes/basic',
          'pathMap' => [
             '@app/views' => [
                '@app/themes/christmas',
                '@app/themes/basic',
             ],
          ]
       ],
    ],
    
    在上述配置中,@app/views/site/index.php视图文件将被主题化为@app/themes/christmas/site/index.php 或@app/themes/basic/site/index.php,具体取决于存在于哪个文件上。如果两个文件都存在,将使用第一个文件。
    第 7 步- 创建主题/圣诞节/站点目录结构。
    第 8 步- 现在,在主题/圣诞节/站点文件夹中,使用以下代码创建一个名为 about.php 的文件。
    
    <?php
       /* @var $this yii\web\View */
       use yii\helpers\Html;
       $this->title = 'About';
       $this->params['breadcrumbs'][] = $this->title;
       $this->registerMetaTag(['name' => 'keywords', 'content' => 'yii, developing,
          views, meta, tags']);
       $this->registerMetaTag(['name' => 'description', 'content' => 'This is the
          description of this page!'], 'description');
    ?>
    <div class = "site-about">
       <h2>Christmas theme</h2>
       <img src = "http://pngimg.com/upload/fir_tree_PNG2514.png" alt = ""/>
       <p style = "color: red;">
          This is the About page. You may modify the following file to customize its content:
       </p>
    </div>
    
    第 9 步- 如果您访问http://localhost:8080/index.php?r=site/about,您将看到使用圣诞节主题的更新的 about 页面。
    圣诞主题