How to edit variable and compile .less with Bootstrap in Yii Framework?

Question

I am using the php Framework Yii and I want to use it in combination with the Twitter Bootstrap Framework.

I did exactly the same steps like here: http://www.cniska.net/yii-bootstrap/setup.html for setting it up.

How can I change the default values for all the colors and so on? I changed it in the "variables.less" and it compiled successful even the bootstrap.less and the style.less, but nothing changed.

Sorry that I am such a newbie but could you tell which file I have to change and compile for changing the design?

bool.dev · Accepted Answer · 2012-11-11 15:51:46Z

3

+50

As of Yii-Bootstrap ver 1.2.0, the css files are taken from path/to/bootstrap-extension/assets/css/ folder, therefore any changes you make to the base .less files should be compiled and stored in that folder. Check this line in the source:

Yii::app()->clientScript->registerCssFile($this->getAssetsUrl().'/css/bootstrap.css');

For example:

Css folder for extension is: project-name/protected/extensions/bootstrap/assets/css/
Base .less files in project-name/protected/extensions/bootstrap/lib/bootstrap/less/
Make a change in project-name/protected/extensions/bootstrap/lib/bootstrap/less/variables.less :
```
@white:                 #ffe;// changed from #fff
```
Make a backup of original bootstrap.css just in case.
Compile protected/extensions/bootstrap/lib/bootstrap/less/bootstrap.less file.
Example (server-side command-line compiling & while in project-name folder):
```
$lessc protected/extensions/bootstrap/lib/bootstrap/less/bootstrap.less > protected/extensions/bootstrap/assets/css/bootstrap.css
```
Clear cache in browser, refresh to see change.

answered Nov 11, 2012 at 15:51

bool.dev

17.5k5 gold badges71 silver badges93 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

bool.dev Over a year ago

@RD. i have given detailed steps, check it out.

acorncom · Accepted Answer · 2012-05-24 04:19:55Z

1

Assuming your less files are compiling properly, the colors should be changing in the compiled CSS files. At which point, you need to make sure your HTML files link to the newly compiled CSS file.

answered May 24, 2012 at 4:19

acorncom

5,9441 gold badge21 silver badges31 bronze badges

Comments

user1413212 · Accepted Answer · 2012-05-25 11:03:11Z

1

I got to know that it is a good idea to copy the bootstrap's less files into a less folder in the root directory and to edit and compile them there. In this way it would be easy to update the bootstrap framework.

In this less folder I have a style.less file which imports the bootstrap.less of the extentions/bootstrap/ folder and my single edited files. There I have to pay attention when I use variables of other files then I need to import some less files that the variables are defined.

answered May 25, 2012 at 11:03

user1413212

534 bronze badges

Collectives™ on Stack Overflow

How to edit variable and compile .less with Bootstrap in Yii Framework?

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related