Setting up TwitterBootstrap with ASP.NET MVC 4

Question

This is what I have done so far:

1) create new ASP.NET MVC 4 project in VS2012.

2) select the "internet application" template (which includes membership and entity framework)

3) test it, it works fine

4) using the package manager, run:

> Install-Package twitter.bootstrap.mvc4
> Install-Package twitter.bootstrap.mvc4.sample

5) in "_ViewStart.cshtml", change

Layout = "~/Views/Shared/_Layout.cshtml"

to

Layout = "~/Views/Shared/_BootstrapLayout.basic.cshtml"

Unfortunately, when I run it now, I get the following error:

The following sections have been defined but have not been rendered for the layout page "~/Views/Shared/_BootstrapLayout.basic.cshtml": "featured".

I'm new to ASP.NET and am not really sure what's going on and why this is happening. Any ideas?

As a second question, once I get this fixed, how can I install a template from http://wrapbootstrap.com? I can't seem to find any instructions for how to do it with ASP.NET.

You should make your second question exactly that...another question. The simple answer to it is you can't just drop it in because it's designed to work with bootstrap not ASP MVC. You need to do a bunch of work to make those templates work. Ask the question as a new question and you might get some better advice. — Peter
– Peter, Commented May 13, 2013 at 22:08
A general suggestion: you might find useful a library TwitterBootstrapMvc — Dmitry Efimenko
– Dmitry Efimenko, Commented Jun 27, 2013 at 19:46

Peter · Accepted Answer · 2013-01-14 22:04:36Z

13

in your Home/index.cshtml there are sections defined that aren't in the bootstrap layout.

either add them to the new layout (see Shared/_Layout.cshtml for how, you're looking for something called featured) or delete them from the index.cshtml.

For homework look up how to define sections in ASP.MVC

answered Jan 14, 2013 at 22:04

Peter

7,8049 gold badges68 silver badges95 bronze badges

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

3 Comments

Ludwo Over a year ago

I had to change \Views\Home\Inbox.cshtml and comment @section featured block

hanzolo Over a year ago

The bootstrap "out of the box" solution needs to be more of an "out of the box" solution, obviously understanding sections is helpful, but fixing code that should work shouldn't require doing homework

Peter Over a year ago

hanzolo see BillH's answer for the kind of solution you are after. See my answer for why it was breaking and do the homework on how to use sections in ASP.MVC to understand the error being thrown. Mine is a complete and accurate answer that addresses the question and doesn't demand that the world should be a certain way.

BillH · Accepted Answer · 2013-06-19 20:48:40Z

7

This is probably too late for the original poster, but I think a better solution is to start with an Empty MVC 4 project. That way, you don't have to delete anything.

1) Start with an empty ASP.NET MVC 4 project.
2) Using the package manager, run:

    install-package twitter.bootstrap.mvc4
    install-package twitter.bootstrap.mvc4.sample

This builds and runs fine on my VS2012.

It seems to me that this was the original way the sample code was intended to be installed.

answered Jun 19, 2013 at 20:48

BillH

4213 silver badges7 bronze badges

Comments

Alex_Sotam · Accepted Answer · 2013-06-27 19:41:18Z

4

In the _BootstrapLayout.basic.cshtml verify that you have "featured" in the @RenderSection :

<head>
    <meta charset="utf-8">
    <title>@ViewBag.Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="@Styles.Url("~/content/css")" rel="stylesheet"/>
    @RenderSection("featured", required: false)
    @Html.Partial("_html5shiv")
</head>

answered Jun 27, 2013 at 19:41

Alex_Sotam

413 bronze badges

Collectives™ on Stack Overflow

Setting up TwitterBootstrap with ASP.NET MVC 4

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related