Zum Inhalt

Inhaltsverzeichnis hinzufügen

Im Folgenden wird beschrieben, wie aus den Inhalten des Hauptteils ein Inhaltsverzeichnis erstellt werden kann. Das Inhaltsverzeichnis soll nach dem Header angezeigt werden.

Beispiel Teil 1: Automatisches Inhaltsverzeichnis hinzufügen
<!DOCTYPE html>
<html>
<head>
    <title>Mein Template</title>
    <meta charset="UTF-8">
</head>
<body>
[CONTAINER name='header' label='Header']...[/CONTAINER]

[INDEX<!-- (1)! --> name='index' container='main'<!-- (2)! --> type='div'<!-- (3)! -->]
[TOP]
<table cellspacing="0" cellpadding="0" width="640" align="center">
  <tr>
    <td><b>Inhaltsverzeichnis</b><br />
[/TOP]
[BOTTOM]
    </td>
  </tr>
</table>
[/BOTTOM]
[INDEXITEM<!-- (4)! --> type='ul']
  <li>[INDEXITEMANCHOR type='a' attributes='']<!-- (5)! -->[INDEXITEMNAME /][/INDEXITEMANCHOR]</li>
[/INDEXITEM]
[/INDEX]
  1. [INDEX]...[/INDEX] erzeugt das Inhaltsverzeichnis.
  2. Name des Containers, dessen Inhalte erfasst werden sollen.
  3. Optional: HTML-Tag, als welches das Inhaltsverzeichnis gerendert werden soll.
  4. Innerhalb [INDEXITEM]...[/INDEXITEM] wird die Darstellung der Inhaltsverzeichnis-Einträge definiert.
  5. Erzeugt den Link <a href="...">...</a> mit der Sprungmarke zum Eintrag. Falls angegeben, werden dem HTML-Tag die Attribute aus attributes='...' angefügt.

Damit die Elemente im Container name='main' in das Inhaltsverzeichnis aufgenommen werden können, müssen diese erweitert werden.

Dem gewünschten Element ein [ANCHOR /]-Tag hinzufügen. Die Sprungmarke wird an dieser Stelle eingefügt.

Beispiel Teil 2: Element erweitern (Variante 1)
[CONTAINER name='main' label='Hauptteil']
  [BETWEEN]<br /><br />[/BETWEEN]

  [ELEMENT name='article' label='Artikel - Text mit Headline' default='true']
  <table cellspacing="0" cellpadding="0" width="640" align="center">
    <tr>
      <td>
        [ANCHOR /]
        [INPUT name='headline' label='Headline' type='h1' rows='2' default='Headline']
        [INPUT name='text' label='Text' type='p' rows='8' default='Das ist der Artikeltext.']
      </td>
    </tr>
  </table>            
  [/ELEMENT]
[/CONTAINER]

[CONTAINER name='footer' label='Footer']...[/CONTAINER]
</body>
</html>
In den Element-Einstellungen ist ein neuer Input "Inhaltsverzeichnis" hinzugefügt. Mittels dieses Eingabefeldes kann individuell entschieden werden, ob der Artikel in das Inhaltsverzeichnis aufgenommen werden soll und wie der Eintrag dort lautet.

Container

Wird dieser befüllt, erscheint der entsprechende Ankerlink im Inhaltsverzeichnis.

An einem Input das Attribut index='true' ergänzen. In der Regel wird dafür die Hauptüberschrift genutzt. Bei dieser Variante wird der Inhaltsverzeichnis-Eintrag immer erstellt, wenn der Headline-Input befüllt ist.

Beispiel Teil 2: Element erweitern (Variante 2)
[CONTAINER name='main' label='Hauptteil']
  [BETWEEN]<br /><br />[/BETWEEN]

  [ELEMENT name='article' label='Artikel - Text mit Headline' default='true']
  <table cellspacing="0" cellpadding="0" width="640" align="center">
    <tr>
      <td>
        [INPUT name='headline' label='Headline' type='h1' rows='2' default='Headline' index='true']
        [INPUT name='text' label='Text' type='p' rows='8' default='Das ist der Artikeltext.']
      </td>
    </tr>
  </table>            
  [/ELEMENT]
[/CONTAINER]

[CONTAINER name='footer' label='Footer']...[/CONTAINER]
</body>
</html>

Lerne im nächsten Schritt, wie du RSS-Feeds integrierst:

RSS-Integrationn