Все для создания и продвижения сайтов

Верстка, программирование, SEO

Modx Revolution pdoPage и Bootstrap 4

количество просмотров 169
Modx Revolution pdoPage и Bootstrap 4

На текущий момент компоненты pdoTools для MODX Revolution и в том числе pdoPage работают из коробки со старой версией Bootstrap, а для нового Bootstrap 4 есть такое решение, для корректного отображения пагинации (разбивка статей на страницы).

[[!pdoPage?
&tpl=`tpl_usluga`
&limit=`10`
&parents=`[[*id]]`
&tplPageWrapper=`@INLINE <nav aria-label="pagination"><ul class="pagination">[[+first]][[+prev]][[+pages]][[+next]][[+last]]</ul></nav>`
&tplPageFirst=`@INLINE <li class="page-item"><a class="page-link" href="[[+href]]">Первая</a></li>`
&tplPageLast=`@INLINE <li class="page-item"><a class="page-link" href="[[+href]]">Последняя</a></li>`
&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><span class="sr-only">Previous</span></a></li>`
&tplPageNext=`@INLINE <li class="page-item"><a class="page-link" href="[[+href]]"><span aria-hidden="true">»</span><span class="sr-only">Next</span></a></li>`
&tplPagePrevEmpty=`@INLINE <li class="page-item disabled"><a class="page-link" href="[[+href]]"><span aria-hidden="true">«</span><span class="sr-only">Previous</span></a></li>`
&tplPageNextEmpty=`@INLINE <li class="page-item disabled"><a class="page-link" href="[[+href]]"><span aria-hidden="true">»</span><span class="sr-only">Next</span></a></li>`
]]
<div>
    [[!+page.nav]]
</div>

Или на Fenom

{$_modx->runSnippet('!pdoPage', [
'parents' => $_modx->resource.id,
'tpl' => 'one_article',
'limit' => 4,
'includeTVs' => 'image',
'tplPageWrapper' => '@INLINE <nav aria-label="pagination"><ul class="pagination">{$first}{$prev}{$pages}{$next}{$last}</ul></nav>'
'tplPageFirst' => '@INLINE <li class="page-item"><a class="page-link" href="{$href}">1Первая1</a></li>'
'tplPageLast' => '@INLINE <li class="page-item"><a class="page-link" href="{$href}">Последняя</a></li>'
'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><span class="sr-only">Previous</span></a></li>'
'tplPageNext' => '@INLINE <li class="page-item"><a class="page-link" href="{$href}"><span aria-hidden="true">»</span><span class="sr-only">Next</span></a></li>'
'tplPagePrevEmpty' => '@INLINE <li class="page-item disabled"><a class="page-link" href="{$href}"><span aria-hidden="true">«</span><span class="sr-only">Previous</span></a></li>'
'tplPageNextEmpty' => '@INLINE <li class="page-item disabled"><a class="page-link" href="{$href}"><span aria-hidden="true">»</span><span class="sr-only">Next</span></a></li>'
])}
{$_modx->getPlaceholder('page.nav')}
Последние статьи

Инструменты

Отблагодарить и поддержать автора
Если вы нашли ошибку, выделите её и нажмите Ctrl+Enter
Выделите опечатку и нажмите Ctrl + Enter, чтобы отправить сообщение об ошибке.