Today We are going to change the layout of a module in Yii Framework 2.
2: Extract it to module_name/web/
a: replace module_name with your module name like here my module name is backend
b: Rename the folder as you desire. Here I renamed it to template. Now my folder directory looks like backend/web/template/
3: Go to module_name/views/layouts/
a: Create files as per your choice like header.php, footer.php, menu.php, etc.php. Here we are going to create three files named header.php, side_bar.php, footer.php assuming that we have one file inside layouts folder named main.php. If not create one with the same name.
4: Go to module_name/web/template/ open index.html in one of your favourite text editor
a: copy the header part code as highlighted in screenshot, and past it to header.php
b: copy the header part code as highlighted in the screenshot, and past it to side_bar.php
c: copy the header part code as highlighted in screenshot, and past it to footer.php
5: Copy all content of index.html to main.php and remove those part which you already have copied and pasted it to respective files. For example remove header, side bar, footer content respectively. Now remove the main content part as highlighted below in screenshot.
6: Now prefix to css and js path this code to make the file path dynamic :
- <?php echo yii\helpers\BaseUrl::base(true); ?>/template/
7: Add Yii2 code whenever necessary. For example I’m going to add some of them.
- <?php $this->endBody() ?>
- <?php $this->beginBody() ?>
- <?php $this->head() ?>
- <?php $this->beginPage() ?>
- <?= Breadcrumbs::widget([
- 'links' => isset($this->params['breadcrumbs']) ? $this->params['breadcrumbs'] : ,
- ]) ?>
- <?= Alert::widget() ?>
- <?= $content ?>
8: You are done. Now type URL in browser, and you’ll see new look of admin dashboard.