Zum Inhalt springen

FCE: Image target

Erstellt am 4. August 2010 · 5 Antworten · letzte Antwort am 10. August 2010

Tags: Frage

Lord_Sinclair ·

Hallo zusammen,

folgendes Problem stellt sich mir:
Ich möchte ein img folgendermaßen taggen:

<img src="" alt=""/>

"alt" wird als Attribut des img tags gemappt und kann durch ein inputfield befüllt werden.

"src" soll ebenso als Attribut des img tags gemappt werden und soll ferner durch ein linkfield eine URL zum Bild bekommen.

Letzteres funktioniert nicht - was muss in der DS geändert werden, damit der Link nach Auswahl linkfield korrekt in src eingesetzt wird?

Vielen Dank für Eure Hilfe!

Grüße

rrudorfer ·

Hi!

Link ist hier das falsche Element... Naja, ich denke es müsste auch mit einem Link-Feld gehen, aber ich würde ein Image-Feld verwenden...

Ändere dann einfach im erzeugten TypoScript (im XML der DS) IMAGE auf IMG_RESOURCE und schon wird dir der Pfad zum Bild zurück geliefert, welchen du dann in das src mappen kannst...

Mit einem Image hast du dann auch mehr Möglichkeiten auf das Bild einzugreifen (Größe, Qualität, Datentyp, ...)

Ciao,
Roman

Lord_Sinclair ·

Hi,

erstmal vielen Dank für deine Hilfe!

Grundsätzlich verstehe ich, welche Lösung du vorschlägst. Nur sind mir die Schritte nicht ganz klar.

Ich erzeuge ein Image-Feld und mappe das dann auf die src property des img tags?
Du sagtest ja schon, dass die erzeuge DS angepasst werden muss, wie genau sieht diese dann aus?

Sorry, wenn ich so genau nachfrage - aber so lange beschäftige ich mich noch nicht mit fce's.

Schonmal vielen Dank für Deine Hilfe!

Viele Grüße
Matthias

rrudorfer ·

Genau... Du erstellst ein Image-Feld als Attribut, so wie du es vorhin schon gemacht hast... Dann wechselst du in das XML der DS und passt das darin enthaltene TypoScript deinen Bedürfnissen an...

Schick mal das XML der DS durch, dann kann man besser helfen... ;-)

Lord_Sinclair ·

Hi, vielen Dank für die Mühe - hier ist der Ausschnitt aus der DS:

<imagefield type="array">
<type>array</type>
<tx_templavoila type="array">
<title>Bildbereich</title>
<eType>input</eType>
<preview></preview>
</tx_templavoila>
<el type="array">
<image type="array">
<type>array</type>
<tx_templavoila type="array">
<title>Bild</title>
<eType>input</eType>
<TypoScript></TypoScript>
<proc type="array">
<int>0</int>
<HSC>0</HSC><stdWrap></stdWrap>
</proc>
<preview></preview>
</tx_templavoila>
<TCEforms type="array">
<label></label>
<config type="array">
</config>
</TCEforms>
<el type="array">
<imagesource type="array">
	<tx_templavoila type="array">
		<title>Bildquelle</title>
		<sample_data type="array">
			<numIndex index="0"></numIndex>
		</sample_data>
		<eType>imagefixed</eType>
		<TypoScript><![CDATA[10 = IMAGE
				10 = IMAGE
				10 {
					#format = jpg
					file.import = uploads/tx_templavoila/
					file.import.current = 1
					file.import.listNum = 0
					file.maxH = 90
10.file.minH = 90
					file.maxW = 120
					10.file.minW = 120
					
				}
				10.imageLinkWrap = 1
				10.imageLinkWrap {
					enable = 1
					bodyTag = <body style="margin:0;">
					wrap = <a href="javascript:close();">|</a>
					width = 800m
					height = 600m
					JSwindow = 1
					JSwindow {
						newWindow = 0
					}
					typolink {
						parameter.override.cObject = IMG_RESOURCE
						parameter.override.cObject.file.import.data = TSFE:lastImageInfo|origFile
						parameter.override.cObject.file.maxW = {$plugin.perfectlightbox.lightBoxMaxW}
						parameter.override.cObject.file.maxH = {$plugin.perfectlightbox.lightBoxMaxH}
						ATagParams = rel="lightbox"
						title.field = field_product_image_alttext
					}
				}
			

]]></TypoScript>
		<proc type="array">
			<int>0</int>
			<HSC>0</HSC>
			<stdWrap></stdWrap>
		</proc>
		<preview></preview>
	</tx_templavoila>
	<TCEforms type="array">
		<label>Bildquelle</label>
		<config type="array">
			<type>group</type>
			<internal_type>file</internal_type>
			<allowed>gif,png,jpg,jpeg</allowed>
			<max_size>1000</max_size>
<uploadfolder>uploads/tx_templavoila</uploadfolder>
			<show_thumbs>1</show_thumbs>
			<size>1</size>
										<maxitems>1</maxitems>
										<minitems>0</minitems>
									</config>	</TCEforms>
<type>attr</type></imagesource>
</el>
</image>
</el>
<section>1</section>
</imagefield>
rrudorfer ·

Natürlich führen wie immer viele Wege zum Ziel... Hier ist jetzt die Möglichkeit, wie sie in diesem Thread im Gespräch ist (alt & src extra als Attribut mappen)...

<imagesource type="array">
	<tx_templavoila type="array">
		<title>Bildquelle</title>
		<sample_data type="array">
			<numIndex index="0"></numIndex>
		</sample_data>
		<eType>imagefixed</eType>
		<TypoScript><![CDATA[
				10 = IMG_RESOURCE
				10 {
					#format = jpg
					file.import = uploads/tx_templavoila/
					file.import.current = 1
					file.import.listNum = 0
					file.maxH = 90
					file.minH = 90
					file.maxW = 120
					file.minW = 120
				}
]]></TypoScript>
		<proc type="array">
			<int>0</int>
			<HSC>0</HSC>
			<stdWrap></stdWrap>
		</proc>
		<preview></preview>
	</tx_templavoila>
	<TCEforms type="array">
		<label>Bildquelle</label>
		<config type="array">
			<type>group</type>
			<internal_type>file</internal_type>
			<allowed>gif,png,jpg,jpeg</allowed>
			<max_size>1000</max_size>
<uploadfolder>uploads/tx_templavoila</uploadfolder>
			<show_thumbs>1</show_thumbs>
			<size>1</size>
										<maxitems>1</maxitems>
										<minitems>0</minitems>
									</config>	</TCEforms>
<type>attr</type></imagesource>

Die Angaben im TypoScript musst du natürlich deinen Wünschen entsprechend anpassen...

Du kannst natürlich auch das ganze <img>-Tag mappen und den Alt-Text in die Image-Generierung mitaufnehmen... Dazu brauchst du dann 10 = IMAGE statt IMG-RESOURCE...

Diese Variante hätte den Vorteil, dass du das ganze Bild dann mit typolink optional verlinken könntest...

Siehe:
https://docs.typo3.org/m/typo3/reference-typoscript/main/en-us/ContentObjects/Index.html
und
https://docs.typo3.org/m/typo3/reference-typoscript/main/en-us/Functions/Index.html

Wie gesagt - je nach Anforderung von Vorliebe gibt es mehrere Möglichkeiten...

Ciao,
Roman