HTML-Dateien

Wie man das Layout seiner Webseite anpasst.

HTML anpassen

Um den HTML-Code deiner Webseite anzupassen, ändere das Layout. Das Standardlayout wird in den Systemeinstellungen festgelegt. Eine anderes Layout lässt sich in den Einstellungen ganz oben auf jeder Seite festlegen, zum Beispiel Layout: default.

Hier ist eine Beispiel-Datei system/layouts/default.html:

<?php $this->yellow->layout("header") ?>
<div class="content">
<?php $this->yellow->layout("sidebar") ?>
<div class="main" role="main">
<h1><?php echo $this->yellow->page->getHtml("titleContent") ?></h1>
<?php echo $this->yellow->page->getContent() ?>
</div>
</div>
<?php $this->yellow->layout("footer") ?>

Hier ist ein Beispiel-Layout um Seiteninhalt und zusätzlichen HTML-Code anzuzeigen:

<?php $this->yellow->layout("header") ?>
<div class="content">
<?php $this->yellow->layout("sidebar") ?>
<div class="main" role="main">
<h1><?php echo $this->yellow->page->getHtml("titleContent") ?></h1>
<?php echo $this->yellow->page->getContent() ?>
<p>Hello world</p>
</div>
</div>
<?php $this->yellow->layout("footer") ?>

Hier ist ein Beispiel-Layout um Seiteninhalt und zusätzliche Blogseiten anzuzeigen:

<?php $this->yellow->layout("header") ?>
<div class="content">
<?php $this->yellow->layout("sidebar") ?>
<div class="main" role="main">
<h1><?php echo $this->yellow->page->getHtml("titleContent") ?></h1>
<?php echo $this->yellow->page->getContent() ?>
<?php $pages = $this->yellow->content->index()->filter("layout", "blog")->sort("published", false)->limit(5) ?>
<?php $this->yellow->page->setLastModified($pages->getModified()) ?>
<?php $this->yellow->page->setHeader("Cache-Control", "max-age=60") ?>
<table>
<?php foreach ($pages as $page): ?>
<tr>
<td><a href="<?php echo $page->getLocation(true) ?>"><?php echo $page->getHtml("title") ?></a></td>
<td><?php echo $page->getHtml("author") ?></td>
<td><?php echo $page->getDateHtml("published") ?></td>
</tr>
<?php endforeach ?>
</table>
</div>
</div>
<?php $this->yellow->layout("footer") ?>

Themen können ihre eigenen Layoutdateien haben, um das vorhandene Layout zu überschreiben. Zum Beispiel wird die Datei system/layouts/default.html bei allen Themen verwendet, die Datei system/layouts/stockholm-default.html jedoch nur beim Theme: Stockholm.

Die Installation kommt mit mehreren Navigationen und man kann weitere Layoutdateien erstellen. Die Standardnavigation wird in den Systemeinstellungen festgelegt. Eine andere Navigation lässt sich in den Einstellungen ganz oben auf jeder Seite festlegen, zum Beispiel Navigation: navigation.

Die folgenden Navigationen sind vorhanden:

Navigation: navigation zeigt Hauptseiten
Navigation: navigation-tree zeigt alle Seiten
Navigation: navigation-sidebar zeigt Unterseiten

Weiter: CSS-Dateien →