Webové stránky ASP.NET - Rozvržení stránky


Pomocí webových stránek je snadné vytvořit webovou stránku s konzistentním rozložením.


Konzistentní vzhled

Na internetu objevíte mnoho webových stránek s konzistentním vzhledem:

  • Každá stránka má stejné záhlaví
  • Každá stránka má stejné zápatí
  • Každá stránka má stejný styl a rozložení

Pomocí webových stránek to lze provést velmi efektivně. V samostatných souborech můžete mít opakovaně použitelné bloky obsahu (bloky obsahu), jako jsou záhlaví a zápatí.

Můžete také definovat konzistentní rozvržení pro všechny stránky pomocí šablony rozvržení (souboru rozvržení).


Bloky obsahu

Mnoho webových stránek má obsah, který se zobrazuje na každé stránce (například záhlaví a zápatí).

U webových stránek můžete použít metodu @RenderPage() k importu obsahu ze samostatných souborů.

Blok obsahu (z jiného souboru) lze importovat kamkoli na webovou stránku a může obsahovat text, značky a kód, stejně jako jakákoli běžná webová stránka.

Použití běžných záhlaví a zápatí jako příkladu vám ušetří spoustu práce. Nemusíte psát stejný obsah na každou stránku, a když změníte soubory záhlaví nebo zápatí, obsah se aktualizuje na všech vašich stránkách.

Takto to vypadá v kódu:

Příklad

<html>
<body>
@RenderPage("header.cshtml")
<h1>Hello Web Pages</h1>
<p>This is a paragraph</p>
@RenderPage("footer.cshtml")
</body>
</html>


Použití stránky s rozložením

V předchozí části jste viděli, že zahrnout stejný obsah na mnoho webových stránek je snadné.

Dalším přístupem k vytvoření konzistentního vzhledu je použití stránky s rozložením. Stránka rozvržení obsahuje strukturu webové stránky, nikoli však její obsah. Když je webová stránka (stránka s obsahem) propojena se stránkou rozvržení, zobrazí se podle stránky rozvržení (šablony).

Rozvržení stránky je jako normální webová stránka, s výjimkou volání metody @RenderBody() , kde bude zahrnuta stránka s obsahem.

Každá stránka obsahu musí začínat direktivou Layout .

Takto to vypadá v kódu:

Rozvržení stránky:

<html>
<body>
<p>This is header text</p>
@RenderBody()
<p>&copy; 2014 W3Schools. All rights reserved.</p>
</body>
</html>

Jakákoli webová stránka:

@{Layout="Layout.cshtml";}

<h1>Welcome to W3Schools</h1>

<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit,sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laborisnisi ut aliquip ex ea commodo consequat.
</p>

SUCHÝ – Neopakujte se

Se dvěma nástroji ASP.NET, Content Blocks a Layout Pages, můžete dát svým webovým aplikacím konzistentní vzhled.

Tyto nástroje vám také ušetří spoustu práce, protože nemusíte na všech stránkách opakovat stejné informace. Centralizace značek, stylů a kódu dělá webové aplikace mnohem snadněji spravovatelnými a snadnějšími na údržbu.


Zabránění procházení souborů

S ASP.NET nelze z webu procházet soubory s názvem, který začíná podtržítkem.

Pokud chcete zabránit zobrazení bloků obsahu nebo souborů rozvržení vašimi uživateli, přejmenujte soubory na:

_header.cshtml

_footer.cshtml

_Layout.cshtml


Skrytí citlivých informací

V ASP.NET je běžným způsobem skrytí citlivých informací (hesla k databázi, hesla e-mailů atd.) uchování informací v samostatném souboru s názvem „_AppStart“.

_AppStart.cshtml

@{
WebMail.SmtpServer = "mailserver.example.com";
WebMail.EnableSsl = true;
WebMail.UserName = "[email protected]";
WebMail.Password = "your-password";
WebMail.From = "[email protected]";
}