How to easily apply Bootstrap to a completed ASP.net MVC 4 application?

Question

I created an ASP.net MVC 4 app. Now I decided to integrate bootstrap 3.0.3 in my app. But I found out it's not easy. I searched on google and found tutorials where they explain how to integrate bootstrap with a totally new ASP.net MVC app.

Tutorial 1

Tutorial 2

My ASP.net MVC 4 app has 'Razor' as View engine and I selected the 'Internet Application' template.

Do I have to modify all the views step-by-step because I didn't chose Bootstrap at the beginning?

If I only include the bootstrap.css and bootstrap.js the pages become deformed.

Solution

You do not have to delete the Site.css file since it contains the currently defined styling for your site, if you remove it you remove your styling. If you want to include the bootstrap.css call it BEFORE your site.css file. The reason your site is deformed when you just use the bootstrap css file is because you did not design for bootstrap but your own custom Site.CSS. bootstrap can be easy or extremely hard to integrate depending on the complexity of your site. Even if you call the bootstrap css before your site css it can, and more likely will, affect how your site looks. You will just have to add it, look at the site, and the go make the needed changes to fix any issues.