Создание шаблона для категории блога (fenom)

Автор Алексей На чтение 4 мин Просмотров 1.8к. Комментарии 0 Опубликовано 22.10.2021 Обновлено 20.10.2021

В рамках данного урока создадим файловый шаблон для категории блога — который будет выводить наши статьи.

В директории templates создаем файл: CatBlogTemplate.tpl со следующим выводом:

{extends 'file:templates/base.tpl'} 
{block 'content'}
<header class="bg-light pt-2 border-bottom">
    <div class="container">
        {'!pdoCrumbs' | snippet : [
            'showHome' => 1,
            'showAtHome' => 0,
            'tpl' => '@INLINE <li class="breadcrumb-item"><a title="{$menutitle}" href="{$link}">{$menutitle}</a></li>',
            'tplHome' => '@INLINE <li class="breadcrumb-item"><a rel="nofollow" title="{$menutitle}" href="{$link}">{$menutitle}</a></li>',
            'tplWrapper' => '@INLINE <nav aria-label="breadcrumb"><ol class="breadcrumb">{$output}</ol></nav>',
            'tplCurrent' => '@INLINE <li class="breadcrumb-item active" aria-current="page">{$menutitle}</li>'
        ]}
    </div>
</header> 
<section class="bg-white py-4">
    <div class="container">
        <div class="row">
    		<div class="col-lg-9 col-md-8">
                <h1>{$_modx->resource.pagetitle}</h1>
                {$_modx->resource.introtext}
                <div class="row">
                {'!pdoPage' | snippet : [
                    'depth' => '0',
                    'tpl' => '@FILE chunks/blog/article.tpl',
                    'includeTVs' => 'img',
                    'tvPrefix' => '',
                    'sortdir' => 'ASC',
                    'limit' => '4',
                    'tplPageWrapper' => '@INLINE <nav aria-label="pagination"><ul class="pagination">{$prev}{$pages}{$next}</ul></nav>',
                    'tplPageFirst' => '',
                    'tplPageLast' => '',
                    'tplPage' => '@INLINE <li class="page-item"><a class="page-link" href="{$href}">{$pageNo}</a></li>',
                    'tplPageActive' => '@INLINE <li class="page-item active"><a class="page-link" href="{$href}">{$pageNo}</a></li>',
                    'tplPagePrev' => '@INLINE <li class="page-item"><a class="page-link" href="{$href}"><span aria-hidden="true">«</span></a></li>',
                    'tplPageNext' => '@INLINE <li class="page-item"><a class="page-link" href="{$href}"><span aria-hidden="true">»</span></a></li>',
                    'tplPagePrevEmpty' => '@INLINE <li class="page-item disabled"><a class="page-link" href="#"><span aria-hidden="true">«</span></a></li>',
                    'tplPageNextEmpty' => '@INLINE <li class="page-item disabled"><a class="page-link" href="#"><span aria-hidden="true">»</span></a></li>',
                    'tplPageFirstEmpty' => '',
                    'tplPageLastEmpty' => ''
                ]}
                </div>
                {'page.nav' | placeholder}
                {$_modx->resource.content}
            </div>
            {include 'file:chunks/blog/aside.tpl'}
        </div>
    </div>
</section>
{/block}

Где чанк aside.tpl содержит следующий код:

<div class="col-sm-6 mb-3">
    <div class="card h-100">
        <a href="{$uri}"><img class="card-img-top" src="{$img | pthumb : 'w=354&h=156&zc=1'}" alt="{$pagetitle}"></a>
        <div class="card-body">
            <h3 class="h6 card-title"><a class="link-dark" href="{$uri}">{$pagetitle}</a></h3>
            <div class="card-text small">{$introtext | truncate : 100 : ' ... ':true:true}</div>
        </div>
    </div>
</div>

Далее в админке создаем шаблон «Категория блога» и в нем вызываем наш файловый шаблон: {include 'file:templates/CatBlogTemplate.tpl'}.

Теперь зайдите в категорию блога, переключите у нее шаблон, сохраните и посмотрите результат.