Zur Zeit so:
Code:
<script>
$(".blog__next, .blog__prev").click(function (event) {
var element;
//Get url of next Month
var $url = window.location.origin + '/' + $(this).attr('href');
// Don't follow the link
event.preventDefault();
// This is the elements div container like ".mod_my_module". "Allow ajax reload" has to be ticket for this element in the backend
element = $(this).closest('[class^="ce_"],[class^="mod_"]');
// Add a css class to this element. An overlay and spinning icon can be set via css
element.addClass('ajax-reload-element-overlay');
$.ajax({
method: 'POST',
url: $url,
data: {
// The data- attribute is set automatically
ajax_reload_element: element.attr('data-ajax-reload-element')
}
})
.done(function (response, status, xhr) {
if ('ok' === response.status) {
// Replace the DOM
element.replaceWith(response.html);
} else {
// Reload the page as fallback
location.reload();
}
});
});
</script>
<div class="layout_short arc_<?= $this->archive->id ?> block<?= $this->class ?>" itemscope itemtype="http://schema.org/Article">
<?php if ($this->hasMetaFields): ?>
<p class="info"><time datetime="<?= $this->datetime ?>" itemprop="datePublished"><?= $this->parseDate("d.", $this->timestamp) ?><br><?= $this->parseDate("M.", $this->timestamp) ?><br><?= $this->parseDate("Y", $this->timestamp) ?></time> <?= $this->author ?> <?= $this->commentCount ?></p>
<?php endif; ?>
<h2 itemprop="name"><?= $this->linkHeadline ?></h2>
<div class="ce_text block" itemprop="description">
<?= \Contao\StringUtil::substrHtml($this->teaser, 150) ?>
</div>
<?php if ($this->hasText || $this->hasTeaser): ?>
<p class="more"><?= $this->more ?></p>
<?php endif; ?>
<?php if ($this->addImage): ?>
<?php $this->insert('image', $this->arrData); ?>
<?php endif; ?>
</div>
Es gibt auch noch das Modul mod_newslist.html5 dazu. Darin ist dann die Pagination eingebunden