Keys are a way of extracting data from subpages. In a blog you have lots of posts and a main blog page. The main blog page extracts the title and image from each post using keys.
Keys have broader applications beyond blogs, including products, articles, and other collections.
Template Structure
post.tpl Example
<div class="post">
<sf-image3 id="1" width="1170" height="400" key="image"></sf-image3>
<sf-singlerow id="2" key="title" html-element="h1"></sf-singlerow>
<sf-text id="3"></sf-text>
</div>
The template defines image and title keys for extraction.
blog.tpl Example
{ com_keys (
id:'1',
description: 'Blog posts',
class: 'posts',
html:'<a href="##{{ page.url }}" class="post">
<span class="image" style="background-image:url(##{{ keys.image | resize:120,120 }})"></span>
<span class="title">##{{ keys.title }}</span>
</a>',
sortBy:'publishedDate descending',
useChildPages: 'true',
limit: '9',
offset: '0'
) }
com_keys Reference Parameters
Parameter | Description |
| Namespace identifier |
| Displays when no subpages exist |
| CSS class for wrapper div |
| Repeating code per page |
| Sort by date/name (ascending/descending) |
| Maximum pages to display |
| Pages before pagination |
| Custom pagination HTML |
| Skip pages |
| Exclude current page |
HTML Reference Variables
Variable | Description | |
| Page URL | |
| Page name | |
| format:"%e %B, %Y"}} | Formatted publish date (uses PHP strftime formatting) |
| Accesses subpage-defined keys |