CODEWITHSUNDEEP
asp.net-mvc-4asp.net-mvc-areas
Richard
Richard

Reputation: 224

MVC4 How to configure different layouts & CSS for areas

I have an MVC4 web app and have created 2 areas. I cannot see how to use different layouts for them. When I created the areas there was not a shared folder generated for them, I have tried creating one in the area named BO and copying the _layout.cshtml file there, no luck. Copied the _viewstart.cshtml file there,
renamed the _layout.cshtml to and changed the layout call in the BO area's _viewstart.cshtml to 

Layout = ~/Areas/BO/Shared/Views/_BOLayout.cshtml";

still no luck, neither the layout nor the css & JS files are loading when I navigate to the BO area home page. Lots of stuff around on making areas use the root _layout.cshtml but I cannot find much on using different ones for each area. Any suggestions please?

PS. The above (Copied the _viewstart.cshtml file there) also breaks things; I get: Type 'ASP._Page_Areas_BO__ViewStart_cshtml' does not inherit from 'System.Web.WebPages.StartPage'. Error on navigating to the area.

Upvotes: 1

Views: 3506

Answers (1)

Darin Dimitrov
Darin Dimitrov

Reputation: 1038710

The following structure should work for an Admin area for example:

~/Areas/Admin/Views/Shared/_AdminLayout.cshtml:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    @RenderBody()
</body>
</html>

~/Areas/Admin/Views/_ViewStart.cshtml:

@{
    Layout = "~/Areas/Admin/Views/Shared/_AdminLayout.cshtml";
}

~/Areas/Admin/Views/Foo/Index.cshtml:

<h2>Index view of FooController in Admin area</h2>

Upvotes: 5

Related Questions