Yii-Bootstrap.Установка и настройка расширения Twitter Bootstrap на Yii Framework

 Twitter Bootstrap один из самых известных наборов HTML/CSS/JS заготовок используемых в веб-разработке, позволяющий легко разработать   front-end каркас (прототип) любого проекта.  Twitter Bootstrap  включает в себя множество элементов  веб интерфейса, облегчая и ускоряя процесс разработки. Для  интеграции в Yii Framework , разработано расширение Yii-Bootstrap. Внедрение в свой проект можно разделить на 2 шага.
 
1 шаг.
Скачать расширение Yii-Bootstrap с репозитория  расширений. Скачанный архив разархивировать  в директорию проекта  домен / ваш_проект / protected / extensions / bootstrap. После чего необходимо скопировать папку theme из директории самого расширения и вставить в домен / ваш_проект / themes / bootstrap. Не забыв переименовать папку theme в bootstrap
 
2 шаг
Настройка файла конфигурации. Добавить в файл домен / ваш_проект / protected / config / main.php
 после строчек :
<?php

// uncomment the following to define a path alias
// Yii::setPathOfAlias('local','path/to/local-folder');

// This is the main Web application configuration. Any writable
// CWebApplication properties can be configured here.
 добавить строку
Yii::setPathOfAlias('bootstrap', dirname(__FILE__).'/../extensions/bootstrap');
 Подключить тему. Добавить строку перед описанием списка модулей:
'theme'=>'bootstrap', //подключение темы

Добавить в описание компонентов следующую строку:

'bootstrap'=>array(
            'class'=>'bootstrap.components.Bootstrap',
        ),

Добавить в описание модулей следующие строки:

'gii'=>array(
            'generatorPaths'=>array(
                'bootstrap.gii',
            ),
        ),

листинг файла после изменений 

<?php

// uncomment the following to define a path alias
// Yii::setPathOfAlias('local','path/to/local-folder');

// This is the main Web application configuration. Any writable
// CWebApplication properties can be configured here.

Yii::setPathOfAlias('bootstrap', dirname(__FILE__).'/../extensions/bootstrap');

return array(
	'basePath'=>dirname(__FILE__).DIRECTORY_SEPARATOR.'..',
	'name'=>'My Web Application',
    'language'=> 'ru',

	// preloading 'log' component
	'preload'=>array('log'),

	// autoloading model and component classes
	'import'=>array(
		'application.models.*',
		'application.components.*',
	),
    'theme'=>'bootstrap', //подключение темы
	'modules'=>array(
		// uncomment the following to enable the Gii tool
		/**/
		'gii'=>array(
            'generatorPaths'=>array(
                'bootstrap.gii',
            ),
        ),
            /*
		'gii'=>array(
			'class'=>'system.gii.GiiModule',
			'password'=>'Enter Your Password Here',
			// If removed, Gii defaults to localhost only. Edit carefully to taste.
			'ipFilters'=>array('127.0.0.1','::1'),
		),
		*/
	),

	// application components
	'components'=>array(
        'bootstrap'=>array(
            'class'=>'bootstrap.components.Bootstrap',
        ),
		'user'=>array(
			// enable cookie-based authentication
			'allowAutoLogin'=>true,
		),
		// uncomment the following to enable URLs in path-format
		/*
		'urlManager'=>array(
			'urlFormat'=>'path',
			'rules'=>array(
				'<controller:\w+>/<id:\d+>'=>'<controller>/view',
				'<controller:\w+>/<action:\w+>/<id:\d+>'=>'<controller>/<action>',
				'<controller:\w+>/<action:\w+>'=>'<controller>/<action>',
			),
		),
		*/
		'db'=>array(
			'connectionString' => 'sqlite:'.dirname(__FILE__).'/../data/testdrive.db',
		),
		// uncomment the following to use a MySQL database
		/*
		'db'=>array(
			'connectionString' => 'mysql:host=localhost;dbname=testdrive',
			'emulatePrepare' => true,
			'username' => 'root',
			'password' => '',
			'charset' => 'utf8',
		),
		*/
		'errorHandler'=>array(
			// use 'site/error' action to display errors
			'errorAction'=>'site/error',
		),
		'log'=>array(
			'class'=>'CLogRouter',
			'routes'=>array(
				array(
					'class'=>'CFileLogRoute',
					'levels'=>'error, warning',
				),
				// uncomment the following to show log messages on web pages
				/*
				array(
					'class'=>'CWebLogRoute',
				),
				*/
			),
		),
	),

	// application-level parameters that can be accessed
	// using Yii::app()->params['paramName']
	'params'=>array(
		// this is used in contact page
		'adminEmail'=>'webmaster@example.com',
	),
);

     

Сайт после обновления страницы будет в стиле Twitter Bootstrap. Более подробно ознакомиться с документацией   Yii-Bootstrap можно на сайте расширения. Документация достаточно подробная и изобилует примерами кода.

Гость 22 июня, 2015

Добавить в \protected\components\Controller.php

public function beforeAction($action)
{
Yii::app()->bootstrap->register();
return parent::beforeAction($action);
}

Гость 14 октября, 2015

Где скачивать Twitter Bootstrap для Yii?, по ссылке не происходит скачивание

Гость 14 октября, 2015

поменяйте фон ссылок ))

Оставить комментарий

Похожие материалы