[TYPO3-german] Toggle Inhaltselement mit Gridelements (& FlexForm Konfig)

Martin martinstockffm at googlemail.com
Wed Mar 6 07:34:26 CET 2013


Hallo,

sollte dieser Beitrag nicht in diesen Forenbereich passen, dann bitte ich dies zu entschuldigen.

Ich möchte ein Toggle FCE mit der Extension Gridelements erstellen.

Dazu habe ich folgenden Beispielcode:

[CODE]<div class="toggles">
                <ul>
                    <li>
                        <a href="#" data-rel="toggle[first]" data-openimage="./images/minus.png" data-closedimage="./images/plus.png">
                        <img src="./images/plus.png" alt=""><h5>Duis autem vel eum iriure</h5></a>
                        <div id="first">
                        <p>Lorem ipsum dolor sit amet, consectetueruer adipiscing elit, sed diam nonummy
                        nibhhhitest euismod tincidunt ut laoreet dolore magnamus aliquam erat volutpat.
                        Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis
                        nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit
                        in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis
                        at vero</p>
                        </div>
                    </li>
                    <li>
                        <a href="#" data-rel="toggle[second]" data-openimage="./images/minus.png" data-closedimage="./images/plus.png">
                        <img src="./images/plus.png" alt=""><h4>Vel illum dolore eu feugiat</h4></a>
                        <div id="second">
                        <p>Lorem ipsum dolor sit amet, consectetueruer adipiscing elit, sed diam nonummy
                         nibhhhitest euismod tincidunt ut laoreet dolore magnamus aliquam erat volutpat.
                         Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit
                         lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor
                         in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat
                         nulla facilisis at vero</p>
                        </div>
                    </li>
                    <li>
                        <a href="#" data-rel="toggle[third]" data-openimage="./images/minus.png" data-closedimage="./images/plus.png">
                        <img src="./images/plus.png" alt=""><h4>Euismod tincidunt ut laoreet</h4></a>
                        <div id="third">
                        <p>
                        Rabbits are ground dwellers that live in environments ranging from desert
                        to tropical forest and wetland. Their natural geographic range encompasses the
                        middle latitudes of the Western Hemisphere. In the Eastern
                        Hemisphere rabbits are found in Europe,
                        portions of Central and Southern Africa, the Indian subcontinent, Sumatra, and Japan.</p>
                        </div>
                    </li>
                </ul>
            </div>[/CODE]

Ich habe im BE ein CE Gridelement mit einer Spalte erstellt:

[CODE]backend_layout {
	colCount = 1
	rowCount = 1
	rows {
		1 {
			columns {
				1 {
					name = Toggle-Inhalt
					colPos = 1
				}
			}
		}
	}
}[/CODE]

Nun möchte ich den Rest der Konfiguration mit einer FlexForm Konfiguration vornehmen. Ich habe mir mal als Beispiel eine von mir mit damals TemplaVoila erstellten Variante mal in die FlexForm Konfig des Gridelements CE eingegeben:

[CODE]<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
<T3DataStructure>
	<meta type="array">
		<langDisable>1</langDisable>
	</meta>
	<ROOT type="array">
		<tx_templavoila type="array">
			<title>ROOT</title>
			<description>Wählen Sie das HTML-Element der Seite, das Sie als übergeordnetes Container-Element der Vorlage möchten.</description>
		</tx_templavoila>
		<type>array</type>
		<el type="array">
			<field_title type="array">
				<tx_templavoila type="array">
					<title>Title</title>
					<sample_data type="array">
						<numIndex index="0"></numIndex>
					</sample_data>
					<eType>input</eType>
					<proc type="array">
						<HSC type="integer">1</HSC>
						<stdWrap></stdWrap>
					</proc>
					<preview></preview>
					<TypoScript type="NULL"></TypoScript>
				</tx_templavoila>
				<TCEforms type="array">
					<label>Title</label>
					<config type="array">
						<type>input</type>
						<size>48</size>
						<eval>trim</eval>
					</config>
				</TCEforms>
			</field_title>
			<field_inhalt type="array">
				<tx_templavoila type="array">
					<title>Inhalt</title>
					<sample_data type="array">
						<numIndex index="0"></numIndex>
					</sample_data>
					<eType>ce</eType>
					<TypoScript>
10= RECORDS
10.source.current=1
10.tables = tt_content</TypoScript>
					<preview></preview>
					<enableDragDrop type="integer">1</enableDragDrop>
				</tx_templavoila>
				<TCEforms type="array">
					<label>Inhalt</label>
					<config type="array">
						<type>group</type>
						<internal_type>db</internal_type>
						<allowed>tt_content</allowed>
						<size>5</size>
						<maxitems>200</maxitems>
						<minitems>0</minitems>
						<multiple>1</multiple>
						<show_thumbs>1</show_thumbs>
					</config>
				</TCEforms>
			</field_inhalt>
			<field_title1 type="array">
				<tx_templavoila type="array">
					<title>Title1</title>
					<sample_data type="array">
						<numIndex index="0"></numIndex>
					</sample_data>
					<eType>input</eType>
					<proc type="array">
						<HSC type="integer">1</HSC>
						<stdWrap></stdWrap>
					</proc>
					<preview></preview>
				</tx_templavoila>
				<TCEforms type="array">
					<label>Title1</label>
					<config type="array">
						<type>input</type>
						<size>48</size>
						<eval>trim</eval>
					</config>
				</TCEforms>
			</field_title1>
			<field_inhalt1 type="array">
				<tx_templavoila type="array">
					<title>Inhalt1</title>
					<sample_data type="array">
						<numIndex index="0"></numIndex>
					</sample_data>
					<eType>ce</eType>
					<TypoScript>
10= RECORDS
10.source.current=1
10.tables = tt_content</TypoScript>
					<preview></preview>
					<enableDragDrop type="integer">1</enableDragDrop>
				</tx_templavoila>
				<TCEforms type="array">
					<label>Inhalt1</label>
					<config type="array">
						<type>group</type>
						<internal_type>db</internal_type>
						<allowed>tt_content</allowed>
						<size>5</size>
						<maxitems>200</maxitems>
						<minitems>0</minitems>
						<multiple>1</multiple>
						<show_thumbs>1</show_thumbs>
					</config>
				</TCEforms>
			</field_inhalt1>
			<field_title2 type="array">
				<tx_templavoila type="array">
					<title>Title2</title>
					<sample_data type="array">
						<numIndex index="0"></numIndex>
					</sample_data>
					<eType>input</eType>
					<proc type="array">
						<HSC type="integer">1</HSC>
						<stdWrap></stdWrap>
					</proc>
					<preview></preview>
				</tx_templavoila>
				<TCEforms type="array">
					<label>Title2</label>
					<config type="array">
						<type>input</type>
						<size>48</size>
						<eval>trim</eval>
					</config>
				</TCEforms>
			</field_title2>
			<field_inhalt2 type="array">
				<tx_templavoila type="array">
					<title>Inhalt2</title>
					<sample_data type="array">
						<numIndex index="0"></numIndex>
					</sample_data>
					<eType>ce</eType>
					<TypoScript>
10= RECORDS
10.source.current=1
10.tables = tt_content</TypoScript>
					<preview></preview>
					<enableDragDrop type="integer">1</enableDragDrop>
				</tx_templavoila>
				<TCEforms type="array">
					<label>Inhalt2</label>
					<config type="array">
						<type>group</type>
						<internal_type>db</internal_type>
						<allowed>tt_content</allowed>
						<size>5</size>
						<maxitems>200</maxitems>
						<minitems>0</minitems>
						<multiple>1</multiple>
						<show_thumbs>1</show_thumbs>
					</config>
				</TCEforms>
			</field_inhalt2>
		</el>
	</ROOT>
</T3DataStructure>[/CODE]

Im BE wird dies nun eigentlich einwandfrei dargestellt. Zuerst kommt die Eingabe des Titels und das Feld für die Inhaltselemente.

So sollte es in etwa aussehen.

ABER: Wie kann ich die Flexform Konfig so ändern, dass ich beliebig viele Toggle Elemente haben kann, mit nen Plus Zeichen oder so.

Und wie verbinde ich eine fertige Konfiguration mit dem oben genannten Beispiel Quellcode der Frontendausgabe? 


More information about the TYPO3-german mailing list