Yii2: Внедрение своей темы сайта (дизайна)

Yii2: Внедрение своей темы сайта (дизайна) Устанавливаем и настраиваем свою тему оформления сайта в Yii 2.

1. Сохранить вашу тему в папку web/themes. Это может быть собственный или готовый свёрстанный html-шаблон.

2. Внедрение. Здесь аккуратно заменить все динамические части кода на переменные Yii, разбить макеты.

В моём случае было сделано следующее. Меню NavBar я вынес в отдельный макет в layouts/_navbar.php

<?php
use yii\bootstrap\Nav;
use yii\bootstrap\NavBar;

    NavBar::begin([
        'brandLabel' => 'Школа брейка INSPIRE',
'brandUrl' => Yii::$app->homeUrl,
        'options' => [
            'class' => 'navbar navbar-default navbar-custom navbar-fixed-top',
        ],
'innerContainerOptions' => ['class'=>'container-fluid'], //The HTML attributes of the inner container.
    ]);
    echo Nav::widget([
        'options' => ['class' => 'navbar-nav navbar-right'],
        'items' => [
            ['label' => 'Главная', 'url' => ['/site/index']],
            ['label' => 'О нас', 'url' => ['/site/about']],
['label' => 'Блог', 'url' => ['/blog']],
['label' => 'Контакты', 'url' => ['/site/contact']],
        ],
    ]);
    NavBar::end();
?>

и подключил его в шаблоне

<?= $this->render('/layouts/_navbar') ?>

Дальше подключил стили css и скрипты js. Это делается в assets/AppAsset.php

В Yii2 введено понятие пакетов "asset bundles". Я создал отдельный пакет assets/InspireAssetsBundle.php, в котором подключил свои css и js. Может понадобиться создать даже два пакета. Bundles сейчас в Yii2 могут применять css атрибут только сразу ко всем включённым свойствам, то есть

...
public $cssOptions = [
'type' => 'text/css'
];
...
этот тип применится ко всем
...
public $css = [
     'themes/inspire/css/clean-blog.css',
   'http://maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css',
   'http://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic',
   'http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800',
    ];
...
Если в теме есть свойства с атрибутом для IE9, то надо создать второй asset. Либо руками подключить через registerCssFile. Я создал отдельный asset.
Мой InspireAssetsBundle зависит от основного пакета AppAsset, потому что хочу переопределять стили. Прописал это ему в $depends
public $depends = [
        'app\assets\AppAsset',
    ];
 
Далее также отдельно в layouts вынес _footer.php.
 
3. Для создания блога использовал Gii, затем настроил оформление от своего шаблона.
1) Создал через phpMyAdmin базу данных и таблицу blog.
2) Иду в gii, создаю модель Blog
Table Name: blog
Model Class: Blog
3) CRUD Generator
 
4. Настроить ЧПУ в Yii 2.
1) В конфиг добавить
‘urlManager’ => array(
‘enablePrettyUrl’ => true,
‘showScriptName’ => false,
‘rules’ => array(
” => ‘site/index’,
‘login’ => ‘site/login’
),
),
2) .htaccess - надо включить RewriteEngine.
AddDefaultCharset UTF-8

Options +FollowSymLinks
IndexIgnore */*
RewriteEngine on

# if a directory or a file exists, use it directly
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d

# otherwise forward it to index.php
RewriteRule . index.php
 
Полезно:
Источник: loco.ru

almix
Разработчик Loco, автор статей по веб-разработке на Yii, CodeIgniter, MODx и прочих инструментах. Создатель Team Sense.

Вы можете почитать все статьи от almix'а.



Другие статьи по этой теме:

Комментарии (0)     Подпишитесь на RSS комментариев к этой статье.