Teaser templates

When an article is displayed in a board, it will use what we call a "teaser template", these templates can be added in to the clients themes and then chosen in the board settings, widget settings and more.

A teaser template is added to the theme by adding a PHP file in templates/ sub folder of the theme, a comment in the php file will then set the name of the template and make it accessible in Everyboard.

The PHP file will automatically get access to a PHP variable $article which is an object of type OcArticle. Another variable, $args (array), may be available and gives information about the context in which is it rendered. $args is always set in Everyboard but may not be available if teaser is rendered in a widget somewhere else.

Example of template:

<?php

/**
 * Article Name: List element
 */

use Customer\TeaserArticle;
use EwTools\Twig\View;

$teaser = TeaserArticle::createFromOcArticle( $article, $args ?? [] );

View::render( '@base/page/partials/teaser/teaser-list-element.twig', $teaser->getViewData() );

The php file will in this example use twig for the actual HTML-rendering as follows.

<article class="article-teaser article-teaser--list-element">
    <div class="article-teaser__header">
        <h3 class="article-teaser__title{{ title_class ? ' '~title_class : '' }}">
                {{ title }}
        </h3>
    </div>
</article>

Example of $args:

In this example Everyboard uses a framework with a 12-column grid, and the template is being rendered in a container that takes up 12 columns' width on the smallest screen, and 4 on larger screens.

$args = [
    'max_cols' => 12,
    'content_sizes' => [
        'xs' => 12,
        'sm' => 4,
        'md' => 4,
        'lg' => 4
    ]
];

Last updated