"generateTabs" output filter for ContentBlocks. See http://slides.com/christianseel/contentblocks/ for instructions.

Chunk tabNavigationItem

<li class="tab-title [[+idx:is=`1`:then=`active`:else=``]]" role="presentational">
	<a href="#[[+id]]" role="tab" tabindex="0" aria-selected="false" controls="[[+id]]">[[+title]]</a>
</li>

Repeater Container Tpl

<div class="tab-accordion-cmp">
    <ul class="tabs show-for-large-up" data-tab>
        [[+rows:generateTabs]]
    </ul>
    <dl class="tabs-content accordion" data-accordion>
        <dd class="accordion-navigation">
            [[+rows]]
        </dd>
    </dl>
</div>

Repeater Row Tpl

<a href="#tab-[[+unique_idx]]-[[+idx]]"
    class="accordion-tab hide-for-large-up">
        [[+title]]
</a>
<section id="tab-[[+unique_idx]]-[[+idx]]"
    data-tabcontent data-title="[[+title]]"
    role="tabpanel" aria-hidden="false"
    class="content [[+idx:is=`1`:then=`active`:else=``]]">
    <div class="content-box section-box">
    	[[+content]]
    </div>
</section>

Snippet generateTabs

<?php
$doc = new DOMDocument();
$doc->loadHTML('<meta http-equiv="content-type" content="text/html; charset=utf-8">'.$input);
$divs = $doc->getElementsByTagName('section');

$tabs = array();

$idx = 1;
foreach($divs as $div) {
    if ($div->hasAttribute('data-tabcontent')) {
	    $tabs[$div->getAttribute('id')] = $div->getAttribute('data-title');
    }
}

$tabheaders = '';

$idx = 1;
foreach($tabs as $id => $title) {
	$tabheaders .= $modx->getChunk('tabNavigationItem', array(
	    'idx' => $idx,
	    'id' => $id,
	    'title' => $title
	));
	$idx++;
}

return $tabheaders;

The slides can now be found at http://sedadigital.slides.com/sedadigital/contentblocks#/4.

The slides can now be found at http://sedadigital.slides.com/sedadigital/contentblocks#/4.

The link is not working.

I found the slides on web archive:
https://web.archive.org/web/20200804104206/http://sedadigital.slides.com/sedadigital/contentblocks