Zum Inhalt springen

Nivo-Slider Integration/Div-Wrapper entfernen

Erstellt am 26. Juli 2013 · 3 Antworten · letzte Antwort am 30. Juli 2013

Tags: Inhaltselemente, Bilder, TYPO3 6.x, Frage

falk07 ·

Hallo liebe Experten,

ich setze gerade mein erstes typo3-Projekt um, wobei (wenig überraschend 🙂) die ein oder andere Frage auftaucht.

Auf meiner Seite soll ein Slider eingebunden werden, dessen HTML-Code am Ende so aussieht (aussehen soll):

<div class="slider-wrapper theme-dark">
        		<div class="nivo-slider" id="slider-2" title="">
                	<!-- ###SLIDER_1### -->
                	<img src="fileadmin/templates/images/s1.jpg" />
                   
                	<img src="fileadmin/templates/images/s2.jpg" />
                   
                    <img src="fileadmin/templates/images/s3.jpg" />
                   <!-- ###SLIDER_1### -->
                </div>
            </div>

Die Bilder sollen im BE idealerweise über das "standard > nur Bilder"-Element eingefügt werden.
Leider werden die Bilder von einer Menge Div-Wrappern umschlossen, die dafür sorgen, dass der Slider nicht mehr funktionert. Das Ergebnis sieht ungefähr so aus:

<div class="csc-textpic-imagewrap"><div class="csc-textpic-center-outer"><div class="csc-textpic-center-inner"><div class="csc-textpic-imagerow"><div class="csc-textpic-imagecolumn csc-textpic-firstcol"><div class="csc-textpic-image"><a href="index.php?id=73" ><img src="fileadmin/user_upload/images/ls1.jpg" width="620" height="325" border="0"  alt=""></a></div></div>

Ich habe hier im Forum schon die Lösung gefunden, Div-Wrapper generell zu entfernen:

tt_content.stdWrap.innerWrap.cObject >
tt_content.stdWrap.innerWrap2 >
tt_content.dataWrap >
tt_content.prepend >
tt_content.textpic.20.text.10.10.stdWrap.dataWrap >
tt_content.image.20.imageStdWrap.dataWrap >
tt_content.image.20.imageStdWrapNoWidth.wrap >
tt_content.image.20.imageColumnStdWrap.dataWrap >
tt_content.image.20.layout.default.value = ###IMAGES######TEXT###
tt_content.image.20.layout.1.value < tt_content.image.20.layout.default.value
tt_content.image.20.layout.2.value < tt_content.image.20.layout.default.value
tt_content.image.20.layout.8.value < tt_content.image.20.layout.default.value
tt_content.image.20.layout.9.value < tt_content.image.20.layout.default.value
tt_content.image.20.layout.10.value < tt_content.image.20.layout.default.value
tt_content.image.20.layout.17.value < tt_content.image.20.layout.default.value
tt_content.image.20.layout.18.value < tt_content.image.20.layout.default.value
tt_content.image.20.layout.25.value < tt_content.image.20.layout.default.value
tt_content.image.20.layout.26.value < tt_content.image.20.layout.default.value
tt_content.image.20.rendering.dl.imageRowStdWrap.dataWrap >
tt_content.image.20.rendering.dl.oneImageStdWrap.dataWrap >
tt_content.image.20.rendering.dl.imgTagStdWrap.wrap >
tt_content.image.20.rendering.dl.editIconsStdWrap.wrap >
tt_content.image.20.rendering.dl.caption.wrap >
tt_content.textpic.20.text.10.10.stdWrap.dataWrap >
tt_content.textpic.20.text.wrap >

Aber das wirkt sich irgendwie nur auf die Text/Bild-Elemente aus. Außerdem wäre es mir lieber, diese divs nur für die Bilder im Slider loszuwerden, da sie ansonsten für die Formatierung von Fließtext/Bild ja ganz hilfreich sind.

Ich hoffe, ich konnte mich halbwegs verständlich machen... 🙂

Oder sollte ich das Problem vielleicht ganz anders angehen? Dann brauche ich vielleicht nur einen "Schubs" in die richtige Richtung?

Danke im voraus,
falk07

falk07 ·

Ok,

nach ein wenig Forscherei kann ich die Frage vielleicht etwas präzisieren:

Wie kann ich die Ausgabe der Bilder, die ich über das Inhaltselement "Nur Bilder" eingegeben habe, beeinflussen?
Der code oben wirkt sich nur auf Inhalte, die ich über das Element "Text und Bilder" eingefügt habe, aus.

etux ·
falk07 schrieb

Ich habe hier im Forum schon die Lösung gefunden

Die Lösung solltest Du in der Setup-Datei von „css_styled_content“ suchen. Und zwar in der in Deiner Installation aktivierten Version - was Du im INet gefunden hast, ist ziemlich alt.
Hier ein Beispiel für einen anderen Slider:
http://www.typo3forum.net/forum/gmenu-hmenu-tmenu-co/60547-slider-ohne-ext-erstellen-3.html#post193884

falk07 schrieb

Wie kann ich die Ausgabe der Bilder, die ich über das Inhaltselement "Nur Bilder" eingegeben habe, beeinflussen?

Auch das kannst Du der „css_styled_content“-Datei entnehmen.

falk07 ·

wow, vielen Dank!

Ohne alles wirklich komplett verstanden zu haben (B-)), habe ich mir dein Beispiel aus dem verlinkten thread genommen und nach meinen Bedürfnissen angepasst. (Bestimmt hätte man das auch viel einfacher lösen können...)
Nun ist es (für mich) nahezu perfekt, nur eine Frage noch:

Das TS sieht jetzt bei mir so aus:

SLIDER_SMALL_1 = CONTENT
		SLIDER_SMALL_1 < styles.content.get
		SLIDER_SMALL_1 {
			table = tt_content
			select {
			  where = colPos=3
			  orderBy = sorting
			}
			wrap = |
			tt_content.stdWrap.innerWrap = |
			renderObj < tt_content.image.20
			renderObj {
				1 {
				  file.import.current = 1
				  stdWrap.cObject = COA
				  stdWrap.cObject {
					wrap = |
					5 = TEXT
					5 {
						field = image_link
						required = 1
						parseFunc =< lib.parseFunc
						split {
						  token {
							char = 10
						  }
						  returnKey.data = register : IMAGE_NUM_CURRENT
						}
					wrap = &lt;a href="|"> 					  
					}
					10 = TEXT
					10 {
					  wrap = &lt;img src="|">
					  data = TSFE:lastImageInfo|origFile
					}
					20 = TEXT
					20.value = </a>
				  }
				}			
			rendering >
			layout {
			  default.value = ###IMAGES###
			  1 < .default
			  2 < .default
			  8 < .default
			  9 < .default
			  10 < .default
			  17 < .default
			  18 < .default
			  25 < .default
			  26 < .default
			}
		}

Und als Ergbnis bekomme ich tatsächlich nur die Bilder und die Links:

<!--  Image block: [begin] -->
			<a href="link"><img src="fileadmin/templates/images/nemo_small.jpg"></a>
<a href="link2"><img src="fileadmin/templates/images/toystory_small.jpg"></a>
<a href="link3"><img src="fileadmin/templates/img/s1small.jpg"></a>
&nbsp;
		<!--  Image block: [end] -->

Das einzig Störende ist das geschützte Leerzeichen am Ende. Hast du eine Idee, wo das herkommen könnte? Aus der Vorlagendatei kommt es nicht - das habe ich überprüft.

Danke nochmal,
falk07