Page layout

Headings

To divide your page's content, and add block titles, you can add h2 tags.

application/blog/admin.xml

<page for="blogitem">
    <title>
        <singular>Item</singular>
        <plural>Items</plural>
    </title>
    
    <content>
        
        <h2>Item content</h2>

        <input for="title">
            <title>Item title</title>
        </input>
        <input for="content">
            <title>Item content</title>
        </input>
        
        <h2>Comments</h2>
        
        <list for="comment">
            <column for="date"/>
            <column for="author"/>
        </list>
        
    </content>
</page>

Grid

It's possible to use grid tags to create custom layouts for admin pages. These tags require a size attribute, which takes a fraction as value.

application/blog/admin.xml

<page section="blog">
    <title>Blog</title>
    
    <content>
        <grid size="1/2">
            <p>These columns are equal width</p>
        </grid>
        <grid size="1/2">
            <p>These columns are equal width</p>
        </grid>
        
        <grid size="1/3">
            <p>This column is smaller</p>
        </grid>
        <grid size="2/3">
            <p>This column is larger</p>
        </grid>
    </content>
</page>

Tabs

If your page contains a lot of content, it might be preferable to organise related inputs into separate tabs. This can be achieved by adding tab tags alongside (or instead of) a page's content tag.

application/blog/admin.xml

<page for="blogitem">
    <title>
        <singular>Item</singular>
        <plural>Items</plural>
    </title>
    
    <tab>
        <title>Item content</title>

        <content>
            <input for="title">
                <title>Item title</title>
            </input>
            <input for="content">
                <title>Item content</title>
            </input>
        </content>
    </tab>
    
    <tab>
        <title>Comments</title>

        <content>
            <list for="comment">
                <column for="date"/>
                <column for="author"/>
            </list>
        </content>
    </tab>
</page>