Post
Ask Question

Install Bootstrap In ASP.NET MVC 5

Continuing with the previous share, today I will share the way to install Bootstrap in ASP.NET MVC5 using Visual Studio 2019.
 
Read previous articles again:
Setup Bootstrap 3.3.1 to ASP.NET MVC 5
 
Right-click Project -> Manager NuGet Packages -> Click icon setting configuration, add package source.
 
https://api.nuget.org/v3/index.json
 
 
 
Continue by adding a package source (following image)
 
 
 
You search keyword “bootstrap” and then install
 
 
 
You can see bootstrap in project after a successful installation.
 
 
 
Okay, installation is successful!
You can use bootstrap in Layout file of Views/Shared/_LayoutHome.cshtml directory. (Note you add css,javascript to file)
  1. <link rel="stylesheet" href="~/Content/bootstrap.min.css" />  
  2. <script src="~/Scripts/jquery-3.3.1.min.js"></script>  
  3. <script src="~/Scripts/bootstrap.min.js"></script>  
Example - Views/Shared/_LayoutHome.cshtml 
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4.     <meta name="viewport" content="width=device-width" />  
  5.     <title>@ViewBag.Title</title>  
  6.     <link rel="stylesheet" href="~/Content/bootstrap.min.css" />  
  7.     <script src="~/Scripts/jquery-3.3.1.min.js"></script>  
  8.     <script src="~/Scripts/bootstrap.min.js"></script>  
  9. </head>  
  10. <body>  
  11.     <div>  
  12.         @RenderBody()  
  13.     </div>  
  14. </body>  
  15. </html>  
Views/Home/Index.cshtml 
  1. <div class="container">  
  2.     <div class="row">  
  3.         <div class="col-md-12">  
  4.             <h2>@ViewBag.title</h2>  
  5.             <a href="https://hoanguyenit.com" class="btn btn-success">https://hoanguyenit.com</a>  
  6.         </div>  
  7.     </div>  
  8. </div>  
Ok, we successfully installed bootstrap in ASP.NET MVC 5!!
Next Recommended Reading ASP.NET MVC 3 - Handling Not Found with ASP.NET MVC 3