Lupe Suche
Responsiv Devices

6 - Vergleich Vorlage und Page.ss

Der Vergleich zwischen der Vorlage und der Silverstripe-Template-Datei Page.ss bietet Einblick in die Möglichkeiten mit Silverstripe. Die Übersichtlichkeit lässt ein sauberes, schnelles Arbeiten zu. Voraussetzung ist es, die Funktionsweise eines Silverstripe-Templates zu verstehen.

Hilfreicher Überblick

Codeansicht der HTML-Vorlage dieses Tutorials (ohne CSS):
Der aus der Vorlage gelöschte Code (grau).

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Weblabor HTML5</title>
<style></style>
</head>
<body>
<header><h1>Weblabor</h1></header>
<nav>
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Seite 1</a></li>
    <li><a href="#">Seite 2</a></li>
    <li><a href="#">Seite 3</a></li>
  </ul>
</nav>
<article>
  <h1>Titel der Startseite</h1>
  <p>Lorem ipsum dolor sit amet ... </p>
</article>
<footer>
  <p>Adresse in der Fusszeile</p>
</footer>
</body>
</html>

Die Datei Page.ss

Der zusätzlich in die Datei eingefügte Code (pink).
Der aus der Vorlage gelöschte Code (grau), siehe oben.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>$Title</title>
    <% base_tag %>
    <% require themedCSS('typography') %>
    <% require themedCSS('form') %>
    <% require themedCSS('layout') %>
</head>
<body>
<header><h1>Weblabor</h1></header>
<nav>
    <ul>
     <% loop Menu(1) %>
       <li><a href="$Link">$MenuTitle</a></li>
     <% end_loop %>
    </ul>
</nav>
<article>
  $Content
  $Form
</article>
<footer>
  <p>Adresse in der Fusszeile</p>
</footer>
</body>
</html>

Weiter mit dem Publizieren des Templates