Bootstrap3 Carousel mit Grid Elements für TYPO3. http://www.merec.org/typo3/bootstrap3-carousel-mit-grid-elements-fuer-typo3

bootstrap3_carousel_container.xml

<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
<T3DataStructure>
    <meta type="array">
        <langDisable>1</langDisable>
    </meta>
    <sheets>
        <general>
            <ROOT type="array">
                <TCEforms>
                    <sheetTitle>Einstellungen</sheetTitle>
                </TCEforms>
                <el type="array">
                    <auto>
                        <TCEforms type="array">
                            <config type="array">
                                <type>check</type>
                                <items>
                                    <numIndex index="0">
                                        <numIndex index="0">Automatischer Durchlauf</numIndex>
                                        <numIndex index="1">1</numIndex>
                                    </numIndex>
                                </items>
                                <default>1</default>
                            </config>
                        </TCEforms>
                    </auto>
                    <interval type="array">
                        <TCEforms type="array">
                            <label>Geschwindigkeit (in Sekunden)</label>
                            <config>
                                <type>input</type>
                                <size>6</size>
                                <max>4</max>
                                <eval>trim,number</eval>
                                <default>5</default>
                            </config>
                        </TCEforms>
                    </interval>
                    <loop>
                        <TCEforms type="array">
                            <config type="array">
                                <type>check</type>
                                <items>
                                    <numIndex index="0">
                                        <numIndex index="0">Endlosschleife</numIndex>
                                        <numIndex index="1">1</numIndex>
                                    </numIndex>
                                </items>
                                <default>1</default>
                            </config>
                        </TCEforms>
                    </loop>
                </el>
            </ROOT>
        </general>
    </sheets>
</T3DataStructure>

bootstrap3_carousel_container_template.html

<div id="carousel-generic-{data.uid}" class="carousel slide" data-ride="carousel" data-interval="{f:if(condition: "{data.flexform_auto}", then: "{f:cObject(typoscriptObjectPath: 'lib.math', data: '{data.flexform_interval}*1000')}", else: "0")}" data-wrap="{data.flexform_loop}">
	<ol class="carousel-indicators">
		<f:for each="{data.tx_gridelements_view_raw_columns.0}" as="tab" iteration="tab_iteration">
			<li data-target="carousel-generic-{data.uid}" data-slide-to="{tab_iteration.cycle}" class="{f:if(condition:'{tab_iteration.isFirst}',then:'active')}"></li>
		</f:for>
	</ol>

	<div class="carousel-inner">
		<f:format.raw>{data.tx_gridelements_view_column_0}</f:format.raw>
	</div>

	<a class="left carousel-control" href="#carousel-generic-{data.uid}" role="button" data-slide="prev">
		<span class="glyphicon glyphicon-chevron-left"></span>
	</a>
	<a class="right carousel-control" href="#carousel-generic-{data.uid}" role="button" data-slide="next">
		<span class="glyphicon glyphicon-chevron-right"></span>
	</a>
</div>

page_ts.txt

# Carousel Container
tx_gridelements.setup.uebb_bootstrap_carousel_container {
	title = Carousel Container
	description = Ein Element, dass mehrere Carousel Elemente enthält
	flexformDS = FILE:fileadmin/templates/gridelements/bootstrap3_carousel/bootstrap3_carousel_container.xml

	config {
		colCount = 1
		rowCount = 1

		rows {
			1 {
				columns {
					1 {
						name = Carousel Container
						colPos = 0
						allowed = gridelements_pi1
					}
				}
			}
		}
	}
}

# Carousel Element
tx_gridelements.setup.uebb_bootstrap_carousel_item {
	title = Carousel Element
	description = Ein Element für ein Carousel-Container

	config {
		colCount = 4
		rowCount = 1
		rows {
			1 {
				columns {
					1 {
						name = Bild (max. 1)
						colPos = 0
						allowed = image
					}
					2 {
						name = Inhalt
						colspan = 3
						colPos = 1
						allowed = header,text
					}
				}
			}
		}
	}
}

setup.txt

# Carousel Item
# First define the carousel item cObject, we want this in the container
tt_content.gridelements_pi1.20.10.setup.uebb_bootstrap_carousel_item {
	# item wrap, first item has active flag
	stdWrap {
		outerWrap = <div class="item">|</div>
		outerWrap.override = <div class="item active">|</div>
		outerWrap.override.if {
			value = 1
			equals.data = cObj:parentRecordNumber
			equals.prioriCalc = 1
		}
	}

	columns.0 {
		renderObj = COA
		renderObj {
			5 = FILES
			5 {
				references {
					table = tt_content
					uid.field = uid
					fieldName = image
				}
				renderObj = IMAGE
				renderObj {
					file.import.data = file:current:publicUrl
					titleText.data = file:current:title
					altText.data = file:current:alternative
					stdWrap.typolink.parameter.data = file:current:link
				}
			}
		}
	}

	columns.1 {
		wrap = <div class="carousel-caption">|</div>

		renderObj = COA
		renderObj {
			# Header
			10 = TEXT
			10 {
				field = header
				wrap = <h3>|</h3>
				if.isTrue.field = header
			}

			20 = TEXT
			20 {
				field = bodytext
				parseFunc < lib.parseFunc_RTE
			}
		}
	}
}

# We need this to calculate the interval (s -> ms)
lib.math = TEXT
lib.math {
	current = 1
	prioriCalc = 1
}

# Carousel Container
tt_content.gridelements_pi1.20.10.setup.uebb_bootstrap_carousel_container {
	cObject = FLUIDTEMPLATE
	cObject {
		file = fileadmin/templates/gridelements/bootstrap3_carousel/bootstrap3_carousel_container_template.html
	}

	columns.0 {
		renderObj < tt_content.gridelements_pi1
	}
}