SAQIBZAFAR
SAQIBZAFAR

Reputation: 89

how to use bootstrap3 theme with Yiistrap extension in Yii framework (bootstrap version 2)

i am using an admin theme in my backend which uses Bootstrap 3.0 css (used as main layout). while i have the yiistrap extension installed which uses bootstrap 2 css files(for my grids and other widgets), now if i use both at the same time, every thing breaks (usually theme), it is obviously because both versions are used, and one overrides the css of another.

i need to know if there is a way where i can differentiate both css, or render one after another is some way? or would i have to make my own template/theme using yiistrap files?

let me give you an example, i have theme layout in my main.php (layout), all theme files added on this file, next, i render my user/admin view, which contains a GridView of Yiistrap, now as you can see my problem, both CSS files are needed to render everything correctly, Hance lies my problem. i want to add both files at the same time, but not to conflict with each other. Does YII provide a solution for this? becuase this can Happen to any theme i use, not only bootstrap.

Upvotes: 1

Views: 6415

Answers (2)

Nikolas Grottendieck
Nikolas Grottendieck

Reputation: 2548

Yiistrap has a method called register which will load all CSS and JS files into the rendered html. As far as I know this has to be manually triggered at some point in your application life cycle and is usually done with Yii::app()->bootstrap->register(). You should be fine if you remove that call and replace it with your call to the Bootstrap 3 loader instead.

Edit

Let me clarify my answer a little. Right now I assume that you are calling Yii::app()->bootstrap->register() somewhere in your application as well including Bootstrap 3 files. This, as you noticed, results in a conflict. Yii::app()->bootstrap->register() will only include CSS and JS files directly necessary for Yiistrap. So either removing this call completely or conditionally replacing it with your Bootstrap 3 includes should solve the issue.

Upvotes: 1

StreetCoder
StreetCoder

Reputation: 10061

You can rename the assets folder of bootstrap and also define path as new folder name in admin and place the admin theme correct. i.e.

theme/[your_theme_name]/views/layouts [here you should place main theme files and write yiistrap code in head tag for bootstrap's assets files]

theme/[your_theme_name]/views/admin [here you should place admin theme files]

If you place files correctly as well as assign the path of assets files correct in the <head></head> section of main theme file, I believe you would not fall in any trouble.

Upvotes: 0

Related Questions