Zum Inhalt springen

Typoscript Bilder Silder rendert Bilder doppelt

Erstellt am 11. Juni 2015 · 6 Antworten · letzte Antwort am 16. Juni 2015

Tags: TYPO3 6.x, Frage

mattfer ·

Ich hab ein Bilder Karusell implementiert um mit Hilfe des Content Element "nur Bilder" im Frontend ein Bootstrap Bilder Karusell einzubinden. Dabei habe ich mich an folgende Anleitung gehalten http://www.ambranet.de/blogpost/cms/bootstrap-karussell-bilderslider-aus-typo3-contentelementen.html

Soweit funktioniet alles so wie es soll, mein Problem ist nur, dass die Bilder zweimal ausgegeben werden. Einmal wie gewünscht als Karusell und einmal im default modus, also wie wenn ich normal Bilder mit dem Content Element eingefügt hätte. Habe quasi doppelten Content.

Ich müsste also Typo3 sagen, dass wenn im Layoutmodus "Karusell" ausgewählt wurde, er die Defaultvariante nicht rendern soll.

Kann mir dabei evtl. jemand weiterhelfen??

Hier ist mein Code:

# Code 1 #################
lib.carousel = COA
 
##### 1. Zugriff auf die Bilder
lib.carousel.10 = FILES
lib.carousel.10.references {
  table = tt_content
  #####UID der Bilder
  uid.data=field:uid
  fieldName = image
}
 
##### 2. Ausgabeiteration der Buttons steuern
lib.carousel.10.renderObj = TEXT
lib.carousel.10.renderObj {
    value = {register:FILE_NUM_CURRENT}
    insertData = 1
    dataWrap = <li data-target="#carousel-example-generic{cObj:parentRecordNumber}" data-slide-to="|" class="active"></li>|*|<li data-target="#carousel-example-generic{cObj:parentRecordNumber}" data-slide-to="|" class="">
</li>|*|<li data-target="#carousel-example-generic{cObj:parentRecordNumber}" data-slide-to="|" class=""></li>
}
##### 3. Container um den gesamten lib.carousel.10
lib.carousel.10.stdWrap.wrap3 =  <ol class="carousel-indicators">|</ol>
lib.carousel.20 < lib.carousel.10
lib.carousel.20.renderObj = COA
##### 4 Das Bild wird geladen
lib.carousel.20.renderObj.10 = IMAGE
lib.carousel.20.renderObj.10 {
    file.import.data = file:current:publicUrl
    file.width.field = imagewidth
    file.height.field = imageheight
 
##### 4.1 Das Bild erhält Alt-Text und Titel aus den Bildeigenschaften
    altText.data = file:current:alternative
    altText.htmlSpecialChars = 1
    titleText.data = file:current:title
    titleText.htmlSpecialChars = 1
  }  

lib.carousel.20.renderObj.15 >
 
##### 4.2 Aus dem Feld "Description“ wird ein Caption-Text erzeugt, der einen Link mit der im Linkfeld eingetragenen Adresse erhält
lib.carousel.20.renderObj.20 = TEXT
lib.carousel.20.renderObj.20 {
    stdWrap.data = file:current:description
    stdWrap.removeBadHTML = 1
    stdWrap.typolink.parameter.data = file:current:link    
##### 4.3 Container um die Caption    
    dataWrap = <div class="carousel-caption active">|</div>|*|<div class="carousel-caption">|</div>|*|<div class="carousel-caption">|</div>
  }
##### 4.4 Container um die Bilder und Captions, das erste Element erhält eine andere Klasse als die anderen
lib.carousel.20.renderObj.wrap = <div class="item active">|</div>|*|<div class="item">|</div>|*|<div class="item">|</div>
 
##### 4.5 Container um den gesamten lib.carousel.20
lib.carousel.20.stdWrap.wrap3 =  <div class="carousel-inner">|</div> 
 
##### 5. Container um des gesamte Element
lib.carousel.stdWrap.dataWrap (
  <div id="carousel-example-generic{cObj:parentRecordNumber}" data-interval="false" class="carousel slide" data-ride="carousel">
|
  <a class="left carousel-control" href="#carousel-example-generic{cObj:parentRecordNumber}" data-slide="prev">
  <span class="glyphicon glyphicon-chevron-left"></span>
  </a>
  <a class="right carousel-control" href="#carousel-example-generic{cObj:parentRecordNumber}" data-slide="next">
  <span class="glyphicon glyphicon-chevron-right"></span>
  </a>
  </div>        
)
  
# Code 3 #####################
# Das Standard-Imagerenderung wird in einer Variablen gespeichert.
 
lib.imagerendering < tt_content.image.30

#Das Imagerendering wird zum CASE-Objekt. Wenn im Feld Section Frame die Option #Slider angewählt wird, werden die Bilder als Slider ausgelesen. Ansonsten wird #das Imagerendering in den Standardzustand zurückversetzt. 
 
tt_content.image.30 = CASE 
tt_content.image.30  {
    key.field = layout
    100 < lib.carousel
    default < lib.imagerendering
}
# Stellt bei "Text mit Bild"  die Textausgabe wieder her. 
  tt_content.textpic.30  =< lib.imagerendering

Dankeschön schon mal...:-)

casi-g ·

Doppelt hast du das ganze weil das eigentlich rendering bei tt_content.image.20 stattfindet.

lib.slider = TEXT
lib.slider.value = Hallo Welt

lib.default < tt_content.image.20 

tt_content.image.20 = CASE
tt_content.image.20 {
	key.field = layout
	1 < lib.slider
	default < lib.default
}

So funktioniert das

mattfer ·

Hi, erstmal Dankeschön für deine Antwort.

Aber bei mir klappt das leider immer noch nicht.

Ich muss auch ehrlich sagen, dass ich nicht ganz verstehe warum du dem lib.slider einen Text zuweist?
Wenn ich das so eingebe, dann werden sowohl die Bilder ohne Slider als auch der "Hallo Welt" text ausgegeben.
Was ich ja eben nicht haben möchte.

casi-g ·

okay das habe ich nur als Beispiel gemacht, weil ich jetzt nicht deinen ganzes Typoscript reinkopieren wollte.

ebenso habe ich bei dem "CASE" den Wert 1 genommen, den musst du natürlich durch deinen gewünschten ersetzen.

So:

lib.carousel = COA
lib.carousel.10 = FILES
# DEIN GANZES TYPOSCRIPT VON DEM BEITRAG EINFÜGEN!
[...]

 
lib.default < tt_content.image.20 
 
tt_content.image.20 = CASE
tt_content.image.20 {
	key.field = layout
	100 < lib.carousel
	default < lib.default
}
mattfer ·

Ja die Werte hatte ich schon an mein Beispiel angepasst.

Aber jetzt bin ich darauf gestoßen, wo das Problem lag... Und jetzt versteh ich auch was du gemeint hast.

Mein Fehler war dass ich im oberen Abschnitt tt_content.image.20 hatte und unten dann tt_content.image.30 verwendet habe.

Warum ich das so gemacht habe, kann ich mir jetzt gerade gar nicht erklären.

Es sieht so aufjedenfall so aus als würde es funktionieren...:-)

Vielen Dank für deine Hilfe!

mattfer ·

Das Problem ist wohl doch noch nicht gelöst.

Jetzt wird nämlich der Text eines Content-Elements (Bilder und Text) auf den restlichen Seiten der Website nicht mehr angezeigt.

Ich weiß jetzt warum ich in meinem ersten Beispiel tt_content.image.30 verwendet hatte. Weil ich tt_content.image.20 schon bei einem anderen Skript verwende. Die Nummer hinter dem tt_content.image dürfte ja keine Rolle spielen solange sie in einer Situation immer die Gleiche verwendet wird oder?

casi-g ·

ah okay. Was machst du denn mit dem

tt_content.image.20

noch? Dann wird sich das ja in die Quere kommen. Natürlich kannst du 30, 40, 50 (oder was auch immer) verwenden, das Problem ist halt nur, dass du dann wieder eine doppelte Ausgabe hast, weil er dann 20 und 30 rendert.

Text mit Bild verweist für das rendern der Bilder auch auf die

tt_content.image.20

.
Also mit irgendeinem Typoscript musst du dir das da irgendwie zerhauen.