tt_content.stdWrap {
  # alte prepend-Funktion von CSS Styled Content loeschen
  prepend >
  prepend = COA
  prepend.stdWrap {
    # Vor Content-Block einen Anker einfuegen
    wrap = < a id="c- | "></a>
    # Anker aber nur setzen, wenn der Content-Block mit Anker umschlossen werden soll 
    if.isTrue.field = sectionIndex
  }
  prepend.10 = TEXT
  prepend.10 {
    field = header
    case = lower
    replacement {
      # Mit Regex alle Leerzeichen durch Bindestriche ersetzen
      10 {
        search = / /
        useRegExp = 1
        replace = -
      }
      # Mit Regex alle unerlaubten Zeichen entfernen 
      20 {
        search = /[^a-zA-Z0-9-]/
        useRegExp = 1
        replace = 
      }
    }
    # Anker aber nur setzen, wenn der Content-Block mit Anker umschlossen werden soll
    if.isTrue.field = sectionIndex
  }
}

<a href="#" title="Mein Ziel-Bild1" data-fancybox-group="gallery1" class="lightbox">
    <img src="meinbild1.jpg" alt="Mein Vorschau-Bild1" />
</a>
<a href="#" title="Mein Ziel-Bild2" data-fancybox-group="gallery1" class="lightbox">
    <img src="meinbild2.jpg" alt="Mein Vorschau-Bild2" />
</a>

# wenn Sprachparameter = 1 UND [tt_news] < 1
[globalVar = GP:L = 1] && [globalVar = GP:tx_ttnews|tt_news < 1]
config.additionalHeaders = HTTP/1.0 301 Permanent Redirect | Location: http:// example.com/news/
[global]

<div class="outer">
  <img src="image.jpg" alt="Mein Testbild" />
  <div class="caption">
    <h1>Wow, was fuer ein Bild!</h1>
    <p>Lorem Ipsum, das ist meine ausfuehrliche Bildbeschreibung...</p>
  </div>
</div>

/* CSS fuer den Aussen-Div */
div.outer {
  position: relative;
  /* WICHTIG: damit wird der caption-div versteckt */
  overflow: hidden;
  width: 400px;
  height: 400px; 
}
/* CSS fuer den Div mit der Bildunterschrift 
 * der Div wird absolut positioniert und 220px unterhalb vom Aussen-Div gesetzt */
div.caption {
  position: absolute;
  bottom: -220px;
  width: 400px;
  height: 200px;
  background: white;
  /* Hintergrund-Deckkraft 80% */
  opacity: 0.8;
  padding: 5px;
  margin: 0;
}

/* Wenn das Dokument fertig ist */
jQuery(document).ready(function($){
  // den Aussen-Div fassen; Funktion aufrufen, wenn mit der Maus ueber den Div gefahren wird
  $('div.outer').hover(function(){
    // das Kinderelement vom Aussen-Div fassen
    $(this).children('div.caption')
    // alte Animationen abbrechen
    .stop(false,true)
    // neue Animation (hochschieben, 200ms lang mit dem Effekt "easeOutQuart"
    .animate({bottom:0},{duration:200, easing: 'easeOutQuart'});
  },
  function(){
    // das gleiche nochmal, wenn man mit der Maus den Aussen-Div verlaesst
    $(this).children('div.caption').stop(false,true).animate({bottom:-220},{duration:200, easing: 'easeOutQuart'});
  });
});

jQuery(window).load(function($){
...
}

# zu erst der Marker fuer das neue Kat-Menu
lib.catList = COA
lib.catList {
  # hole alle Hauptkategorien
  10 = CONTENT
  10 {
    # wrappe die gesamte Liste als "unsortierte Liste"
    wrap = <ul class="news-catmenu">|</ul>
    table = tt_news_cat
    select {
      # hier muss die pid eures News-Sysordners rein, bzw. wo die News-Kategorien gespeichert sind
      pidInList = 3
      orderBy = title
      where = parent_category=0 AND deleted=0 AND hidden=0
    }
    renderObj = COA
    renderObj {
      # wrappe jede gefundene Hauptkategorie als Listenelement
      wrap = <li>|</li>
      # ueberschreibe den vorherigen Wrap ...
      wrap.override = <li class="news-catmenu-ACT">|</li>
      # ... nur, wenn ...
      wrap.override.if {
        # ... eine News-Kategorie bereits ausgewaehlt wurde und per GET/POST ermittelt werden kann
        value.data = GPvar:tx_ttnews|cat
        # und dieser ermittelte Wert der aktuellen uid gleicht
        equals.field = uid        
      }
 
      # zeig mir den Kategorie-Titel und mache einen Link daraus zur Kategorie-Detail-Uebersicht
      10 = TEXT
      10 {
        # das title-Feld soll als Text angezeigt werden (koennte man auch description... verwenden)
        field = title
        typolink {
          # verlinke zu der Seite mit der News-Auflistung (Listenansicht)
          parameter = 34
          title.field = title
          # fuege den GET-Parameter fuer die ausgewaehlte Kategorie hinzu
          additionalParams.dataWrap = &tx_ttnews[cat]={field:uid}
          # cHash mit uebergeben fuers Caching - Danke an ScubaBen fuer den Hinweis!
          useCacheHash = 1
        }
      }
 
      # zeig mir einen Counter aller News-Eintraege in dieser Kategorie
      20 = CONTENT
      20 {
        table = tt_news_cat
        select {
          # hier wieder der Sysordner aller News-Eintraege und -Kategorien
          pidInList = 3
          join = tt_news_cat_mm ON (tt_news_cat.uid = tt_news_cat_mm.uid_foreign) 
                   JOIN tt_news ON (tt_news.uid = tt_news_cat_mm.uid_local)
          # dieses Where sorgt dafuer, dass auch die News der Unterkategorien 1 Ebene unterhalb
          # gezaehlt werden - tiefere Ebenen koennen nicht beruecksichtigt werden
          # andWhere.dataWrap = (tt_news_cat.uid={field:uid} OR 
# tt_news_cat.parent_category={field:uid}) AND tt_news.deleted=0 AND tt_news.hidden=0
          # dieses Where zaehlt nur die News in dieser Kategorie
          andWhere.dataWrap = (tt_news_cat.uid={field:uid}) 
                                           AND tt_news.deleted=0 AND tt_news.hidden=0
                                           AND sys_language_uid={TSFE:sys_language_uid}
          # fuehre einen count durch und speichere das Ergebnis in "counter"
          selectFields = count(*) AS counter
        }
        renderObj = TEXT
        renderObj {
          # zeig mir nun das Ergebnis des Counters an und wrappe es
          field = counter
          wrap =  <span>(|)</span>
        }
      }
 
      # zeige mir alle Unterkategorien der aktuellen Kategorie an
      30 = CONTENT
      30 {
        stdWrap {
          # fuehre den Abschnitt nur aus, wenn in der Select-Abfrage ein Wert gefunden wurde
          required = 1
          wrap = <ul>|</ul>
        }
 
        table = tt_news_cat
        select {
          pidInList = 3
          orderBy = title
          andWhere.dataWrap = parent_category={field:uid} AND deleted=0 AND hidden=0
        }
        # vererbe die Einstellungen von lib.CatList.10.renderObj an dieses renderObj
        renderObj < lib.catList.10.renderObj
        renderObj = COA
        renderObj {
 
          # zeige den Titel mit Verlinkung an, genauso wie bei lib.catList.10.renderObj.10 (vererbt)
          10 < lib.catList.10.renderObj.10
 
          # zeige den News-Counter an, genauso wie bei lib.catList.10.renderObj.20 (vererbt)
          20 < lib.catList.10.renderObj.20
 
          # zeige die Unterkategorien an, genauso wie bei lib.catList.10.renderObj.30 (vererbt)
          30 < lib.catList.10.renderObj.30
          # wenn noch eine 4. und 5. Kategorien-Ebene abgebildet werden sollen,
          # dann die folgenden 6 Zeilen verwenden
          # 30.renderObj = COA
          # 30.renderObj {
          #   10 < lib.catList.10.renderObj.10
          #   20 < lib.catList.10.renderObj.20
          #   30 < lib.catList.10.renderObj.30
          # }
        }
      }
    }
  }
}

li.news-catmenu-ACT > a {
  font-weight: bold;
  color: red; 
}

...
// sucht diesen Abschnitt in der RealUrl-Config-Datei oder neu hinzufuegen
'fixedPostVars' => array(
  // hier muss nun eure SinglePid statt der 14 rein
  '14' => array(
    // der folgende Teil ist Standard und aus der tt_news-Doku entnommen
    array(
      'GETvar' => 'tx_ttnews[tt_news]',
      'lookUpTable' => array(
        'table' => 'tt_news',
        'id_field' => 'uid',
        'alias_field' => 'title',
        'addWhereClause' => ' AND NOT deleted',
        'useUniqueCache' => 1,
        'useUniqueCache_conf' => array(
          'strtolower' => 1,
          'spaceCharacter' => '-',
        ),
      ),
    ),
  ),
),
...