[TYPO3-german] Extension gesucht. Wie realisiere ich einen Bilder-Slider?

[Axel Wüstemann]

bei uns war es noch etwas komplizierter, außer den Bildern haben wir 
noch 1-2 Text-Bild-Teaser (Überschrift, Text, Bild und Link-Button) auf 
den Bildern liegen.

Diese Felder musst Du erst einmal im DCE anlegen.
- Hintergrundbild (das eigentliche Slider-Bild)
- Hauptüberschrift
- Teaset1Überschrift
- Teaser1Text
- Teaser1Bild
- Teaser1Link
- Teaset2Überschrift
- Teaser2Text
- Teaser2Bild
- Teaser2Link


Das Fluid-Template ist so:

{namespace dce=Tx_Dce_ViewHelpers}
<f:layout name="None" />

<f:section name="main">
     <div id="slider-outer">
     <div id="slider">
         <div class="container fill">
             <div id="myCarousel" class="carousel slide">
                     <ol class="carousel-indicators">
                         <f:for each="{field.slides}" as="oneSlide" 
iteration="i" key="slideNum">
                             <li data-target="#myCarousel" 
data-slide-to="{i.index}" {f:if(condition: '{i.index} == 0', then: 
'class="active"', else: '')}></li>
                         </f:for>
                     </ol>
					 <div class="carousel-inner">
                     <f:for each="{field.slides}" as="oneSlide" 
key="slideNumber">

                             <div class="item{f:if(condition: 
'{0:i.index} == {0:slideNumber}', then: ' active', else: '')}">
                                 <div class="fill" 
style="background-image:url('fileadmin{oneSlide.slideImage.0.identifier}');">
                                     <div class="container">
                                         <div class="row">
                                             <div class="col-md-12">
 
<h1><f:format.raw>{oneSlide.headline}</f:format.raw></h1>
                                             </div>
                                         </div>
                                         <div class="row">
											<f:if condition="{oneSlide.teaserOneText}">
                                             <div class="col-sm-6">
                                                 <div class="slider-teaser">
                                                     <f:image 
src="fileadmin{oneSlide.teaserOneImage.0.identifier}" 
alt="{oneSlide.teaserOneImage.0.alternative}" width="500c" height="180c" 
treatIdAsReference="1" />
                                                     <h2><f:link.page 
pageUid="{oneSlide.teaserOneLink}" 
 >{oneSlide.teaserOneHeadline}</f:link.page></h2>
 
<p><f:format.raw>{oneSlide.teaserOneText}</f:format.raw></p>
                                                     <f:link.page 
pageUid="{oneSlide.teaserOneLink}" class="btn btn-default 
btn-blue">mehr</f:link.page>
                                                 </div>
                                             </div>
											</f:if>
											<f:if condition="{oneSlide.teaserTwoText}">
                                             <div class="col-sm-6">
                                                 <div class="slider-teaser">
                                                     <f:image 
src="fileadmin{oneSlide.teaserTwoImage.0.identifier}" 
alt="{oneSlide.teaserTwoImage.0.alternative}" width="500c" height="180c" 
treatIdAsReference="1" />
                                                     <h2><f:link.page 
pageUid="{oneSlide.teaserTwoLink}" 
 >{oneSlide.teaserTwoHeadline}</f:link.page></h2>
 
<p><f:format.raw>{oneSlide.teaserTwoText}</f:format.raw></p>
                                                     <f:link.page 
pageUid="{oneSlide.teaserTwoLink}" class="btn btn-default 
btn-blue">mehr</f:link.page>
                                                 </div>
                                             </div>
											</f:if>
                                         </div>
                                     </div>
                                 </div>
                             </div>
                     </f:for>
                  </div>
				 <div class="pull-center">
                     <a class="carousel-control left" href="#myCarousel" 
data-slide="prev"><i class="fa fa-angle-left"></i></a>
                     <a class="carousel-control right" 
href="#myCarousel" data-slide="next"><i class="fa fa-angle-right"></i></a>
                 </div>
             </div>
         </div>
     </div>
</div>

</f:section>

Viel Erfolg
Axel