Einen Bild-Slider im Portal-Kopf integrieren

Wenn Sie in einem Ihrer Ordner eine Datei namens "bild-slider.html" hinterlegen (mit untenstehendem Beispiel-Code), so wird diese als Slideshow im Kopf aller Seiten des Ordners angezeigt.

Normaler Kopfbild-Slider

Quellcode für bild-slider.html:

<ul id="portal-slider">

  <li><img alt="" class="foto" src="/images/homepage_2012/kopffotos/home_halle1.jpg" /></li>

  <li><img alt="" class="foto" src="/images/homepage_2012/kopffotos/Imagebroschuere_0009_neu.jpg" /></li>

  <li><img alt="" class="foto" src="/images/homepage_2012/kopffotos/Cafete_0003_neu.jpg" /></li>

</ul>

Weitere Funktionalitäten

Kopfbild-Slider mit zufälligem Startbild

Quellcode für bild-slider.html:

<ul id="portal-slider-random">

  <li><img alt="" class="foto" src="/images/homepage_2012/kopffotos/home_halle1.jpg" /></li>

  <li><img alt="" class="foto" src="/images/homepage_2012/kopffotos/Imagebroschuere_0009_neu.jpg" /></li>

  <li><img alt="" class="foto" src="/images/homepage_2012/kopffotos/Cafete_0003_neu.jpg" /></li>

</ul>

Verlinkung von Bildern

Sie können innerhalb der li-Tags das jeweilige Bild verlinken und so auf weitere Inhalte Ihres Portals verweisen.

Quellcode für bild-slider.html:

<ul id="portal-slider">

  <li><a href="#"><img alt="" class="foto" src="/images/homepage_2012/kopffotos/home_halle1.jpg" /></a></li>

  <li><a href="#"><img alt="" class="foto" src="/images/homepage_2012/kopffotos/Imagebroschuere_0009_neu.jpg" /></a></li>

  <li><a href="#"><img alt="" class="foto" src="/images/homepage_2012/kopffotos/Cafete_0003_neu.jpg" /></a></li>

</ul>

Kopfbild-Slider mit Text

Dieser Kopfbild-Slider ist momentan nur für das Kopfdesign Nr.1 angepasst (Fakultäten).

Hier finden Sie eine Vorschau:
Fakultät für Biologie

Quellcode für bild-slider.html:

<ul id="portal-slider" class="mit-text">

  <li>
    <img alt="" class="foto" src="/images/homepage_2012/kopffotos/home_halle1.jpg" />
    <div class="slider-text">"Dies ist ein Typoblindtext. An ihm kann man sehen, ob alle Buchstaben da sind und wie sie aussehen."<br /> <b>Blindtext</b></div>
  </li>

  <li>
    <img alt="" class="foto" src="/images/homepage_2012/kopffotos/Imagebroschuere_0009_neu.jpg" />
    <div class="slider-text">"Manchmal benutzt man Worte wie Hamburgefonts, Rafgenduks oder Handgloves, um Schriften zu testen."<br /> <b>Blindtext</b></div>
  </li>

  <li>
    <img alt="" class="foto" src="/images/homepage_2012/kopffotos/Cafete_0003_neu.jpg" />
    <div class="slider-text">"Manchmal Sätze, die alle Buchstaben des Alphabets enthalten - man nennt diese Sätze »Pangrams«."<br /> <b>Blindtext</b></div>
  </li>

</ul>

Slider-Pagination ändern (in config.xsl)

Die Slider-Pagination wird standardmäßig mit farbigen Punkten angedeutet. Haben Sie aber sehr viele Bilder, die Sie in dem Kopfbild-Slider abbilden möchten (mehr als beispielsweise 7 Bilder), so sollten Sie in Ihrer Config-Datei als Pagination die Pfeile auswählen. So können sich Ihre Seiten-Besucher trotzdem noch durch die Bilder durchklicken, werden aber nicht erschlagen von 15 farbigen Punkten..

Variable in der Config-Datei:

<xsl:variable name="slider-pagination" select="'pfeile'" /> <!-- (default = punkte) -->

Diese Variable kann folgende Werte annehmen: "punkte", "pfeile" und "keine"