I've been reading about layouts, sections, views and partial views, but I don't really know how to approach a layout like this example:
Top bar: would be like the bar that Facebook have on top. I would contain the authentication information and general options and menus.
Navigation bar: would contain information about where are you, and where can you go. Also a "search" box.
Body: The actual wanted information.
Side bar: would contain relevant information about what is in the body.
Footer: copyright, licence and things like that.
Body would be a "View", Sidebar would be a "Section", Footer would be static HTML in the "Layout", but... what would be Top bar and Navigation?
Top bar is not related with anything, so I would put it as a "Partial View" in the "Layout", but I cannot do that because it has to be inside the <body>
anyway, so when I call @RenderBody()
, it should be rendered. Same thing with Navigation, it's somehow related with the body, but I'd like to separate it as an external control that runs on his own and show information depending on the information in the URL.
How should I approach this?
UPDATE, please read: The question is not about CSS and HTML, it's not about how to layout this, but how to use the Razor tools to do it, it's about Razor RenderBody
and PartialView
.
When I return a result from my controller, I want to return just what is marked in the picture as "body", and "side bar" as a section, I'd like to avoid repeat the top bar code. Is there a way to create a "ChildView", that inherits from "ParentView", and this from "Layout", in a way that when I return "View("ChildView") the screen is built automatically?