Skip to content

06. Page Template

Jump to bottom
James231 edited this page Jun 9, 2020 · 2 revisions

Within the Template folder, the Page.html file is the only file which isn't a Template Element. Instead it contains the outermost content for the generated HTML pages. Technically it is the only required file within all three Input, Output and Template folders.

Child Content

In the Page template, to specify where the content from each Input file should be injected, use @ChildContent; (remember the ;!). When generating the documentation, the tool uses a basic string.Replace to insert the content in this position.

You can also use @ChildContent; multiple times on a page but this is normally a bad idea as if your pages are very long then you may be doubling the size of the output files.

Using Page Properties

Recall from the sections on HTML Pages and Markdown Pages that you can add your own page properties to the top of page files. For example, in a HTML page the following defines a property with name myproperty and value myvalue.

<PProperty name="myproperty" value="myvalue"/>

In the page template, these values can be displayed wherever you like using the syntax @Page.myproperty; where you replace myproperty with the name of your property.

Template Elements

You can also use Template Elements in the Page template in the same way as in other template and page files. You can pass Page Properties into templates with <mycustomelement title="@Page.title;"/>.

Page Template Example

Suppose we have the following page:

<PProperty name="PageTitle" value="My Super Page"/>

<p>
    This is my page content.
</p>

And the Page.html template file contains this:

<html>
    <body>
        <navbar curPageName="@Page.PageTitle;"/>
        <h1>@Page.PageTitle;</h1>
        @ChildContent;
    </body>
</html>

Before the template element navbar is converted into pure HTML, the output file looks like:

<html>
    <body>
        <navbar curPageName="My Super Page"/>
        <h1>My Super Page</h1>
        <p>
            This is my page content.
        </p>
    </body>
</html>

Special Tags

The page template has support for a few special tags which allow for looping through pages/subfolders (in a certain order) and accessing their properties. This is useful for creating things like side navigation bars. See the next section for more details.

Enjoying using Documentation Templater? Make sure you ⭐ the repo!!!

Clone this wiki locally