- Gii – Generating Module
- Gii – Generating Controller
- Gii – Creating a Model
- Yii - Gii
- Yii - Localization
- Yii - Authorization
- Yii - Authentication
- Yii - Error Handling
- Yii - Logging
- Yii - Aliases
- Yii - Fragment Caching
- Yii - Caching
- Yii - Testing
- Yii - Fields
- Yii - RESTful APIs in Action
- Yii - RESTful APIs
- Yii - Theming
- Yii - Database Migration
- Yii - Active Record
- Yii - Query Builder
- Yii - Data Access Objects
- Yii - Database Access
- Yii - Dependency Injection
- Yii - Configurations
- Yii - Creating a Behavior
- Yii - Behaviors
- Yii - Creating Event
- Yii - Events
- Yii - GridView Widget
- Yii - ListView Widget
- Yii - Data Widgets
- Yii - Data Providers
- Yii - Properties
- Yii - Sorting
- Yii - Pagination
- Yii - Formatting
- Yii - Files Upload
- Yii - Using Cookies
- Yii - Cookies
- Yii - Using Flash Data
- Yii - Sessions
- Yii - AJAX Validation
- Yii - Ad Hoc Validation
- Yii - Validation
- Yii - HTML Forms
- Yii - Rules of URL
- Yii - URL Routing
- Yii - URL Formats
- Yii - Responses
- Yii - HTTP Requests
- Yii - Creating Extensions
- Yii - Extensions
- Yii - Asset Conversion
- Yii - Assets
- Yii - Layouts
- Yii - Views
- Yii - Modules
- Yii - Widgets
- Yii - Models
- Yii - Using Actions
- Yii - Using Controllers
- Yii - Controllers
- Yii - Entry Scripts
- Yii - Application Structure
- Yii - Create Page
- Yii - Installation
- Yii - Overview
- Yii - Home
Yii Useful Resources
Selected Reading
- Who is Who
- Computer Glossary
- HR Interview Questions
- Effective Resume Writing
- Questions and Answers
- UPSC IAS Exams Notes
Yii - Layouts
Layouts represent the common parts of multiple views i.e. for example, page header and footer. By default, layouts should be stored in the views/layouts folder.
Let us have a look at the main layout of the basic apppcation template −
<?php /* @var $this yiiwebView */ /* @var $content string */ use yiihelpersHtml; use yiiootstrapNav; use yiiootstrapNavBar; use yiiwidgetsBreadcrumbs; use appassetsAppAsset; 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"> <?= Html::csrfMetaTags() ?> <title><?= Html::encode($this->title) ?></title> <?php $this->head() ?> </head> <body> <?php $this->beginBody() ?> <span class = "wrap"> <?php NavBar::begin([ brandLabel => My Company , brandUrl => Yii::$app->homeUrl, options => [ class => navbar-inverse navbar-fixed-top , ], ]); echo Nav::widget([ options => [ class => navbar-nav navbar-right ], items => [ [ label => Home , url => [ /site/index ]], [ label => About , url => [ /site/about ]], [ label => Contact , url => [ /site/contact ]], Yii::$app->user->isGuest ? [ label => Login , url => [ /site/login ]] : [ label => Logout ( . Yii::$app->user->identity->username. ) , url => [ /site/logout ], pnkOptions => [ data-method => post ] ], ], ]); NavBar::end(); ?> <span class = "container"> <?= Breadcrumbs::widget([ pnks => isset($this->params[ breadcrumbs ]) ? $this>params [ breadcrumbs ] : [], ]) ?> <?= $content ?> </span> </span> <footer class = "footer"> <span class = "container"> <p class = "pull-left">© My Company <?= date( Y ) ?></p> <p class = "pull-right"><?= Yii::powered() ?></p> </span> </footer> <?php $this->endBody() ?> </body> </html> <?php $this->endPage() ?>
This layout generates the HTML page that is common for all pages. The $content variable is the rendering result of content views. The following methods trigger events about the rendering process so that the scripts and tags registered in other places could be properly injected −
head() − Should be called within the head section. Generates a placeholder, which will be replaced with the registered HTML targeted at the head position.
beginBody() − Should be called at the beginning of the body section. Triggers the EVENT_BEGIN_BODY event. Generates a placeholder which will be replaced with the registered HTML targeted at the body begin position.
endBody() − Should be called at the end of the body section. Triggers the EVENT_END_BODY event. Generates a placeholder, which will be replaced with the registered HTML targeted at the body end position.
beginPage() − Should be called at the beginning of the layout. Triggers the EVENT_BEGIN_PAGE event.
endPage() − Should be called at the end of the layout. Triggers the EVENT_END_PAGE event.
Create a Layout
Step 1 − Inside the views/layouts directory, create a file called newlayout.php with the following code.
<?php /* @var $this yiiwebView */ /* @var $content string */ use yiihelpersHtml; use yiiootstrapNav; use yiiootstrapNavBar; use yiiwidgetsBreadcrumbs; use appassetsAppAsset; 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"> <? = Html::csrfMetaTags() ?> <title><? = Html::encode($this->title) ?></title> <?php $this->head() ?> </head> <body> <?php $this->beginBody() ?> <span class = "wrap"> <span class = "container"> <? = $content ?> </span> </span> <footer class = "footer"> <span class = "container"> <p class = "pull-left">© My Company <?= date( Y ) ?></p> <p class = "pull-right"><? = Yii::powered() ?></p> </span> </footer> <?php $this->endBody() ?> </body> </html> <?php $this->endPage() ?>
We have removed the top menu bar.
Step 2 − To apply this layout to the SiteController, add the $layout property to the SiteController class.
<?php namespace appcontrollers; use Yii; use yiifiltersAccessControl; use yiiwebController; use yiifiltersVerbFilter; use appmodelsLoginForm; use appmodelsContactForm; class SiteController extends Controller { pubpc $layout = “newlayout”; /* other methods */ } ?>
Step 3 − Now if you go to the web browser at any view of the SiteController, you will see that the layout has changed.
Step 4 − To register various meta tags, you can call yiiwebView::registerMetaTag() in a content view.
Step 5 − Modify the ‘About’ view of the SiteController.
<?php /* @var $this yiiwebView */ use yiihelpersHtml; $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 ); ?> <span class="site-about"> <h1><?= Html::encode($this->title) ?></h1> <p> This is the About page. You may modify the following file to customize its content: </p> <code><?= __FILE__ ?></code> </span>
We have just registered two meta tags − keywords and description.
Step 6 − Now go to http://localhost:8080/index.php?r=site/about, you will find the meta tags in the head section of the page as shown in the following screenshot.
Views trigger several events −
EVENT_BEGIN_BODY − triggered in layouts by the call of yiiwebView::beginBody().
EVENT_END_BODY − triggered in layouts by the call of yiiwebView::endBody().
EVENT_BEGIN_PAGE − triggered in layouts by the call of yiiwebView::beginPage().
EVENT_END_PAGE − triggered in layouts by the call of yiiwebView::endPage().
EVENT_BEFORE_RENDER − triggered in a controller at the beginning of rendering a file.
EVENT_AFTER_RENDER − triggered after rendering a file.
You may respond to these events to inject content into views.
Step 7 − To display the current date and time in the actionAbout of the SiteController, modify it this way.
pubpc function actionAbout() { Yii::$app->view->on(View::EVENT_BEGIN_BODY, function () { echo date( m.d.Y H:i:s ); }); return $this->render( about ); }
Step 8 − Type http://localhost:8080/index.php?r=site/about in the address bar of the web browser and you will see the following.
Important Points
To make Views more manageable you should −
Divide complex views into several smaller ones.
Use layouts for common HTML sections (headers, footers, menus and so forth).
Use widgets.
Views should −
Contain HTML and simple PHP code to format and render data.
NOT process requests.
NOT modify model properties.
NOT perform database queries.