Verschiedene Maximalbreiten für Bilder in verschiedenen Spalten und Rahmen

  • MajPay MajPay
    Jedi-Meister
    0 x
    345 Beiträge
    2 Hilfreiche Beiträge
    14. 06. 2012, 16:13

    Hallo schonwieder,

    Ich möchte bei meinem aktuellen Typo3 Projekt tt_content so konfigurieren, dass die maximale Bildbreite immer richtig kalkuliert wird.
    Ich nutze 2 Spalten, left und normal. Dazu habe ich einige Frames angelegt um den Inhalt links oder rechts fließen zu lassen.

    Es kann also in der Spalte links ein Bild eingestellt werden mit max. 200px Breite und in der Spalte normal mit 749px Breite.

    Soweit sogut, das habe ich mit etwas Recherche geschafft.

    In der Spalte normal kann man aber seine Inhaltselemente als "Linke Spalte" oder "Rechte Spalte" oder "Drittel links" etc definieren. Es sollen nun auch nach dieser Auswahl alle Breiten korrekt berechnet werden.

    Soweit sogut - nun ja, eben nicht ganz.

    Mein TS:

    1. temp.tt_content.image < tt_content.image
    2. tt_content.image = CASE
    3. tt_content.image {
    4. key.field=colPos
    5. 1 < temp.tt_content.image
    6.  
    7. default = CASE
    8. default {
    9. key.field = section_frame
    10. 0 < temp.tt_content.image
    11. 30 < temp.tt_content.image
    12. 31 < temp.tt_content.image
    13.  
    14. 0.20.maxW = 749
    15. 30.20.maxW = 360
    16. 31.20.maxW = 360
    17. }
    18.  
    19. 1.20.maxW = 200
    20. }
    21.  
    22. tt_content.textpic.20 < tt_content.image.20

    Mein Problem ist nun, dass auf diese Art bei Textpic der Text nicht mehr gerendert wird. Wo habe ich den Denkfehler?


  • 1
  • Julian.Hofmann Julian.Ho...
    Flash Gordon
    0 x
    3083 Beiträge
    132 Hilfreiche Beiträge
    15. 06. 2012, 10:17

    Hallo.

    Die Erklärung ist eigentlich einfach. Ein Blick in die "CSS styled content":

    1. # *****************
    2. # CType: textpic
    3. # *****************
    4. tt_content.textpic = COA
    5. tt_content.textpic {
    6. 10 = COA
    7. 10.if.value = 25
    8. 10.if.isLessThan.field = imageorient
    9. 10.10 = < lib.stdheader
    10.  
    11. 20 = < tt_content.image.20
    12. 20 {
    13. text.10 = COA
    14. text.10 {
    15. if.value = 24
    16. if.isGreaterThan.field = imageorient
    17. 10 = < lib.stdheader
    18. 10.stdWrap.dataWrap = <div class="csc-textpicHeader csc-textpicHeader-{field:imageorient}">|</div>
    19. }
    20. text.20 = < tt_content.text.20
    21. text.wrap = <div class="csc-textpic-text"> | </div>
    22. }
    23. }

    [i]tt_content.image.20[/i] ist eigentlich ein [i]USER[/i]-Objekt, wird von Dir jedoch in ein [i]CASE[/i]-Objekt umgebaut. Bei textpic wird diesem [i]USER[/i]-Objekt noch via [i]text[/i] einiges zugewiesen. Dies scheitert bei Dir, weil dann die text-Eigenschaften nicht dem [i]USER[/i]-Objekt, sondern Deinem zwischengeschobenen [i]CASE[/i]-Objekt zugeordnet werden.

    Viele Grüße
    Julian

  • MajPay MajPay
    Jedi-Meister
    0 x
    345 Beiträge
    2 Hilfreiche Beiträge
    18. 06. 2012, 15:18

    Perfekt, ich danke dir!

    So sieht mein TS nun aus, wenns eine elegantere Lösung hierfür gibt her damit :)

    1. temp.tt_content.image < tt_content.image
    2. tt_content.image = CASE
    3. tt_content.image {
    4. key.field=colPos
    5. 1 < temp.tt_content.image
    6.  
    7. default = CASE
    8. default {
    9. key.field = section_frame
    10. 0 < temp.tt_content.image
    11. 30 < temp.tt_content.image
    12. 31 < temp.tt_content.image
    13.  
    14. 0.20.maxW = 749
    15. 30.20.maxW = 360
    16. 31.20.maxW = 360
    17. }
    18.  
    19. 1.20.maxW = 200
    20. }
    21.  
    22. temp.textpictext < tt_content.textpic.20.text
    23.  
    24. tt_content.textpic = CASE
    25. tt_content.textpic {
    26. key.field=colpos
    27. 1 < temp.tt_content.image
    28.  
    29. default = CASE
    30. default {
    31. key.field = section_frame
    32. 0 < temp.tt_content.image
    33. 30 < temp.tt_content.image
    34. 31 < temp.tt_content.image
    35.  
    36. 0.20.maxW = 749
    37. 0.20.text < temp.textpictext
    38. 30.20.maxW = 360
    39. 30.20.text < temp.textpictext
    40. 31.20.maxW = 360
    41. 31.20.text < temp.textpictext
    42. }
    43.  
    44. 1.20.maxW = 200
    45. 1.20.text = temp.textpictext
    46. }

  • MajPay MajPay
    Jedi-Meister
    0 x
    345 Beiträge
    2 Hilfreiche Beiträge
    25. 06. 2012, 16:49

    Der Vollständigkeit wegen sollte noch erwähnt sein, dass es Sinn macht die TS Objekte per > Operator zu leeren bevor man sie als CASE Objekt definiert, sonst können mit diesem Lösungsansatz Dinge wie doppelte Headlines das Bild etwas kaputt machen.

  • 1