Bootstrap

How to disable Bootstrap in Yii2
How to disable Bootstrap in Yii2

By default, Yii2 comes bundled with the Bootstrap framework. After installing any configuration (basic or advanced), you’ll see a start page styled with Bootstrap. In this case (and possibly in all others), there’s nothing wrong with that, since it's just a placeholder, not a production website. But what if the client or studio decides to move away from such a popular solution like Bootstrap and opts for something like MaterializeCSS instead? In that case, you’ll need to disable Bootstrap and connect the MaterializeCSS framework (or any other you prefer).

The first thing we need to do is get rid of the built-in Bootstrap setup provided by Yii developers.

The second step is to disable Bootstrap support in the asset file (in basic, it’s located at /assets/AppAsset.php):

class AppAsset extends AssetBundle
{
    public $basePath = '@webroot';
    public $baseUrl = '@web';
    public $css = [
        'css/site.css',
    ];
    public $js = [
    ];
    public $depends = [
        'yiiwebYiiAsset',
        'yiibootstrapBootstrapAsset',
    ];
}

Remove the line:

'yiibootstrapBootstrapAsset',

read more...

Custom layout on Bootstrap 3
Custom layout on Bootstrap 3

Hello! In this article, I want to share my experience of custom layout development using the Bootstrap 3 framework.

What exactly will we do?

  1. Learn how to install the SCSS version of Bootstrap via Bower
  2. Configure Bootstrap's grid and other framework settings (if needed)
  3. Include specific Bootstrap components in the final stylesheet

Project Configuration

First, let’s define the directory structure of our project. For example:

/_data
/scss
/bootstrap //This directory contains the Bootsrap files we modified
_bootstrap.scss //Connected components
_variables.scss //Variables
style.scss //Contains connections to other files
template.scss //Project styles
.bowerrc
bower.json
gulpfile.js
package.json
/assets //Contains scripts loaded by bower
/image //Images and project styles
index.php

read more...