1. 首頁
  2. 問答
  3. yii2主題整合

yii2主題整合

2014-09-02 67 views
9

我已經安裝了yii2高級應用程序，現在我想改變後端主題。 我該怎麼做？ 是否有任何文件需要告訴yii2使用我的自定義主題？ 我在backend \ web \ themes \ mytheme下建立了我的主題。 我剛剛在advanced \ backend \ config \ main.php中替換了這段代碼，但什麼都沒發生！yii2主題整合

'view' => [ 
    'theme' => [ 
     'pathMap' => ['@app/views' => '@app/themes/mytheme'], 
     'baseUrl' => '@web/themes/mytheme', 
    ], 
    ],

然後我換成這個代碼下通用/配置/ main.php，但什麼都沒有改變！

來源

2014-09-02 Muhammad Shahzad

+2

到這個[鏈接]（http://stackoverflow.com/questions/25133379/how-can-i-customize-yii2-theme文件/ 25260008＃25260008）。我們已經解決了這個問題。 – sprytechies 2014-09-03 08:41:37

+0

我在說yii2高級應用程序的主題。 – 2014-09-03 09:18:13

+0

這是關於yii2中的高級應用程序。你將這些步驟應用於後端目錄（如你所願）。 – sprytechies 2014-09-03 09:45:05

回答

8

另一個應用程序蟑螂改變Yii2的主題是：

  1. 在前端或後端的web文件夾中要更改主題的位置創建主題目錄。

  2. 將您的主題文件夾放在主題目錄中。在AppAsset.php

  3. 變化$ CSS和JS $變量的資產文件夾中的前端或後端，如：

    public $css = [ 
    //'css/site.css', 
    'themes/theme_folder/css/font-awesome.min.css', 
    'themes/theme_folder/css/slicknav.css', 
    'themes/theme_folder/css/style.css', 
    'themes/theme_folder/css/responsive.css', 
    'themes/theme_folder/css/animate.css', 
    'themes/theme_folder/css/colors/red.css', 
    //'themes/margo/asset/css/bootstrap.min.css', 
]; 
public $js = [ 
     'themes/theme_folder/js/jquery.migrate.js', 
     'themes/theme_folder/js/modernizrr.js', 
     'themes/theme_folder/js/jquery.fitvids.js', 
     'themes/theme_folder/js/owl.carousel.min.js', 
     'themes/theme_folder/js/nivo-lightbox.min.js', 
     //'themes/theme_folder/js/jquery-2.1.4.min.js', 
     //'themes/theme_folder/asset/js/bootstrap.min.js' 
];

  4. 不包括核心引導CSS，JS引導和jQuery的js，因爲這些是核心API這是由Yii2提供的。我上面評論過他們。

  5. 使用下面的代碼在你的main.php佈局文件或其他網站的頁面引用主題資源（CSS，JS，圖片等）：

    <?= Yii::getAlias('@web/themes/theme_folder') ?>/images/margo.png

  6. 沒有必要包括CSS或JS在layouts-> main.php文件：

來源

2016-02-25 07:27:54

+0

謝謝你的時間，我會做到這一點。 – 2016-02-25 14:19:07

+0

哇，太棒了！這是工作。 – 2016-07-17 19:31:29

+0

使用你的主題整合的方法這個功能不工作'$ this-> theme-> baseurl';） – 2016-07-20 19:29:54

0

只是把所有的視圖文件夾中的主題\ mytheme的

來源

2014-09-02 12:41:23 Ankita

+0

我只是移動mytheme中的視圖文件夾，現在它給了我一個錯誤： 視圖文件不存在：/home/public_html/yii2/advanced/backend/views/site/login.php – 2014-09-03 06:06:20

5

在themes/mytheme創建視圖文件夾，然後將所有視圖文件，如main.php到它和其他的佈局需要。你

也可以設置你的基本佈局在backend\config\main.php像

return [ 
'id' => 'app-backend', 
'layout'=>'yourtheme', //your `themes/mytheme/views/` contain yourtheme.php in this case 
...

也改變pathmap到

'pathMap' => ['@app/views' => '@app/themes/mytheme/views'],

來源

2014-09-02 14:41:47

+0

它適用於我，改變「 config/main.php「 'layout'=>'@ webroot/themes/mytheme/views/layouts/main.php'， 'pathMap'=> ['@ app/views'=>'webroot/themes/mytheme/views']， – 2015-08-21 10:20:43

1

在後端文件夾製作。在文件後端/配置/主主題文件夾。 php組件部分添加下面給出的代碼，這個文件夾中的文件將表現得像後端的視圖文件夾。

'view' => [ 
      'theme' => [ 
       'basePath' => '@backend/themes/demo', 
       'baseUrl' => '@backend/themes/demo', 
       'pathMap' => [ 
        '@backend/views' => '@backend/themes/demo', 
       ], 
      ], 
     ],

來源

2015-09-18 19:25:50 Midhun

3

要安裝新的後端或前端的主題（我做了一個頁面引導主題），請遵循以下步驟：

  1. 複製的主題內容即目錄，如JS，CSS，圖片，字體等，例如後端 - >網頁文件夾。

  2. 更改您的backend->資產 - > AppAsset.php類即修改$ CSS和JS $像數組

    public $css = [ 
    //'css/site.css', 
    'css/font-awesome.min.css', 
    'css/main.css', 
    'css/prettyPhoto.css', 
    'css/bootstrap.min.css', 
]; 
public $js = [ 
     //'js/bootstrap.min.js', 
     'js/html5shiv.js', 
     'js/jquery.isotope.min.js', 
     //'js/jquery.js', 
     'js/jquery.prettyPhoto.js', 
     'js/main.js', 
     'js/respond.min.js', 
];

請記住註釋掉jQuery核心和引導JS文件，它們由Yii2默認提供。

  • 修改backend->則須─> layouts-> main.php文件作爲下：

    <?php 

/* @var $this \yii\web\View */ 
/* @var $content string */ 

use backend\assets\AppAsset; 
use yii\helpers\Html; 
use yii\bootstrap\Nav; 
use yii\bootstrap\NavBar; 
use yii\widgets\Breadcrumbs; 
use common\widgets\Alert; 
use webvimark\modules\UserManagement\models\User; 
use webvimark\modules\UserManagement\UserManagementModule; 

AppAsset::register($this); 
?> 

<?php $this->beginPage() ?> 

<!DOCTYPE html> 
<html lang="<?= Yii::$app->language ?>"> 
<head> 
<meta charset="<?= Yii::$app->charset ?>"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<meta name="description" content=""> 
<meta name="author" content=""> 
<?= Html::csrfMetaTags() ?> 
<title><?= Html::encode($this->title) ?></title> 

<!--[if lt IE 9]> 
<script src="<?= Yii::$app->request->baseUrl ?>/js/html5shiv.js"></script> 
<script src="<?= Yii::$app->request->baseUrl ?>/js/respond.min.js"></script> 
<![endif]--> 
<link rel="shortcut icon" href="<?= Yii::$app->request->baseUrl ?>/images/ico/favicon.ico"> 
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="<?= Yii::$app->request->baseUrl ?>/images/ico/apple-touch-icon-144-precomposed.png"> 
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="<?= Yii::$app->request->baseUrl ?>/images/ico/apple-touch-icon-114-precomposed.png"> 
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="<?= Yii::$app->request->baseUrl ?>/images/ico/apple-touch-icon-72-precomposed.png"> 
<link rel="apple-touch-icon-precomposed" href="<?= Yii::$app->request->baseUrl ?>/images/ico/apple-touch-icon-57-precomposed.png"> 
<?php $this->head() ?> 
</head><!--/head--> 

<body data-spy="scroll" data-target="#navbar" data-offset="0"> 

<?php $this->beginBody() ?> 

    <header id="header" role="banner"> 
    <div class="container"> 
     <div id="navbar" class="navbar navbar-default"> 
      <div class="navbar-header"> 
       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
        <span class="sr-only">Toggle navigation</span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
       </button> 
       <a class="navbar-brand" href="index.html"></a> 
      </div> 
      <div class="collapse navbar-collapse"> 
       <ul class="nav navbar-nav"> 
       <li class="active"><a href="#main-slider"><i class="icon-home"></i></a></li> 


        <li><a href="#services">Services</a></li> 
        <li><a href="#portfolio">Portfolio</a></li> 
        <li><a href="#pricing">Pricing</a></li> 
        <li><a href="#about-us">About Us</a></li> 
        <li><a href="#contact">Contact</a></li> 

       </ul> 
      </div> 
     </div> 
    </div> 
     </header><!--/#header--> 



      <?= $content ?> 



<footer id="footer"> 
    <div class="container"> 
     <div class="row"> 
      <div class="col-sm-6"> 
       &copy; 2013 <a target="_blank" href="http://shapebootstrap.net/" title="Free Twitter Bootstrap WordPress Themes and HTML templates">ShapeBootstrap</a>. All Rights Reserved. 
      </div> 
      <div class="col-sm-6"> 
       <img class="pull-right" src="<?= Yii::$app->request->baseUrl ?>/images/shapebootstrap.png" alt="ShapeBootstrap" title="ShapeBootstrap"> 
      </div> 
     </div> 
    </div> 
</footer><!--/#footer--> 


<?php $this->endBody() ?> 
</body> 
</html> 
<?php $this->endPage() ?>

  • 現在根據主題調整其他內容的網頁，適合你的:)

    在您的網頁主題的地方部分

    • 讓我知道是否有人遇到任何困難:)

    來源

    2016-02-13 16:45:47

    +0

    另一個清潔方法：http://www.bsourcecode.com/yiiframework2/install-new-theme-in-yiiframework-2/ – 2016-02-13 16:59:20

    +0

    謝謝我會嘗試 – 2016-02-24 18:04:10

    +1

    @MuhammadShahzad別忘了答案upvote是有幫助的，因爲這個網站在這個機制的作品，我們都有利於找到正確的答案:) – 2016-02-29 11:59:47

    0 
    'components' => [ 
    'view' => [ 
     'theme' => [ 
      'pathMap' => ['@backend/views' => '@backend/themes/mytheme'], 
      'baseUrl' => '@backend/themes/mytheme', 
     ], 
    ], 
],

    來源

    2016-07-16 15:37:08 rakhmatov

    +2

    請編輯更多信息。僅限代碼和「嘗試這個」的答案是不鼓勵的，因爲它們不包含可搜索的內容，也不解釋爲什麼有人應該「嘗試這個」。 – abarisone 2016-07-18 07:26:06

    相關問題

     相關問題