Custom view modes #

This page is for designers who need more shapes than full, line and embed: a card in a grid, a big teaser in a hero, a compact item in a sidebar. A view mode is just a name with templates behind it.

Contents #

1. Creating a view mode
2. Using it
3. By URL
4. For editors' embeds
5. Examples in the shipped designs

Creating a view mode #

1. A default template for every class: design/mytheme/templates/node/view/card.tpl.

   <article class="card">
       <h3 class="card-title"><a href={$node.url_alias|ezurl}>{$node.name|wash}</a></h3>
   </article>

2. Overrides for classes that need more:

   [mytheme_card_article]
   Source=node/view/card.tpl
   MatchFile=card/article.tpl
   Subdir=templates
   Match[class_identifier]=article

3. Clear the template override cache.

Prefix the mode with nothing special, but avoid names the kernel already uses (full, line, embed, embed-inline, text, text_linked, plain, tiny, listitem, thumb, sitemap, print, pdf).

Using it #

<div class="card-grid">
{foreach $children as $child}{node_view_gui content_node=$child view='card'}{/foreach}
</div>

Layout block templates can draw their items in your mode too (Block view templates).

By URL #

/content/view/card/<node id> renders the mode as a page. Only modes in site.ini [ContentSettings] CachedViewModes are view-cached when opened this way.

For editors' embeds #

To let editors pick your mode when they embed content in rich text, add it to content.ini [embed] AvailableViewModes[] in your extension's settings, and give it a content/view/<mode>.tpl too (embeds draw objects with content_view_gui).

Examples in the shipped designs #

The media design uses frameless modes for its own purposes: payload (the pagelayout prints only the content) and layout_preview (a reduced frame), both read from $module_result.content_info.viewmode in its pagelayout.

Related pages #

• View modes
• Node templates by class
• Free documentation: this page is free to copy, translate and improve under the GNU FDL 1.3.