Zum Inhalt springen

CSS Eigenschaft bedingt anwenden mit Datenbankabfrage

Erstellt am 31. August 2011 · 7 Antworten · letzte Antwort am 8. September 2011

Tags: Bilder, Frage

merendo ·

Hallo Gemeinde,

ich bin neu hier, daher erst mal ein herzliches Hallo zusammen.

Und gleich mein Problem. Bitte um Verständnis dafür, dass ich bin mit TypoScript noch nicht allzu sehr routiniert bin.

Meine Aufgabenstellung ist die, dass ich für ein div-Element in einer Website ein Hintergrundbild laden möchte (CSS-Eigenschaft mit Platzhalter, sieht so aus: <div style="background: url(###BACKGROUND_IMG_LOCATION###);">) , und dieses soll im Backend für jede Seite einzeln definiert werden können - ist kein Bild definiert, soll eine Standard-Datei verwendet werden. Im Backend soll diese Datei einfach als Image in der Spalte 'Rand' eingefügt werden können, eine Datenbankabfrage holt sich den Namen des Bildes dann im TypoScript heraus.

Sogut soweit. Hier mein Ansatz mit TypoScript:

## Standard-Bild:
temp.BGIMG = ./fileadmin/images/Zertifizierung.png

## Datenbankabfrage
temp.BGIMGQUERY = CONTENT
temp.BGIMGQUERY {
  table = tt_content
  select.selectFields = image
  select.where = colPos = 3 AND CType = image
  renderObj = TEXT
  renderObj.field = image
}

## Wurde ein passendes Objekt in der DB gefunden?
[temp.BGIMGQUERY.renderObj]
  ## Wenn ja, dann verwende dieses. Ansonsten nicht.
  temp.BGIMG < temp.BGIMGQUERY.renderObj
[global]


page.10 = TEMPLATE
page.10 {
  template = FILE
  template.file = fileadmin/vorlage.html
  
  marks {
    ...

    ## Bild-Name in die CSS-Eigenschaft einfügen.
    BACKGROUND_IMG_LOCATION = HTML
    BACKGROUND_IMG_LOCATION.value < temp.BGIMG

    ...
  }

Vermutlich habe ich einen ganz trivialen Newbie-Fehler gemacht, aber trotz Onkel Google und Abgrasens sämtlicher Typo3-Foren die ich finde, komm ich nicht weiter. Bitte um Hilfe!

Vielen Dank! merendo

Chrissli ·

Hallo merendo,

also ich würde hier einfach in IMAGE benutzen!?

#deine abfrage wie gehabt
renderObj = IMAGE
renderObj {
  file = fileadmin/standard.jpg # das default-bild
  file.import = uploads/pics/ # pfad zu den Bilduploads
  file.import.field = images # datenbankfeld
  file.import.listNum = 0 # nimm das erste hinterlegte bild im feld
  file.width.field = imagewidth # die breite des bildes die du im rte angegeben hast
  file.height.field = imageheight # das selbe mit der hoehe
}
merendo ·

Also, funktionieren tut es immer noch nicht. Ich habe nun stdWrap, required und wrap eingefügt wo es nur geht, aber es wird nach wie vor ein leerer String zurückgeliefert.

Stimmt das denn, dass ich mit temp.BGIMGQUERY.renderObj auf das Ergebnis der Abfrage zugreifen kann?!

Hier mal die Abfrage, wie sie nun dasteht:

## Datenbankabfrage
temp.BGIMGQUERY = CONTENT
temp.BGIMGQUERY {
  table = tt_content
  select.selectFields = image
  select.where = colPos = 3 AND CType = image
  wrap = |
  stdWrap.wrap = |
 
  
  renderObj = TEXT
  renderObj.field = image
  renderObj.required = 1
  renderObj.wrap = |
  renderObj.stdWrap = |
}

@Chrissli: Habs so versucht wie du vorgeschlagen hast, ging leider auch nicht (hab natürlich die Kommentare entfernt). Im HTML-Code, den mir Typo3 dann zurückliefert, steht an der Stelle, wo der Pfad zur Bilddatei stehen sollte, nur "IMAGE".

Chrissli ·

*vorkau* .... muuuuuh.... *weiterkau*

temp.BGIMGQUERY = CONTENT
temp.BGIMGQUERY {
  table = tt_content
  select.selectFields = image
  select.where = colPos = 3
  select.andWhere = CType = 'image'
  renderObj = IMAGE
  renderObj {
    file = fileadmin/standard.jpg
    file.import = uploads/pics/
    file.import.field = image
    file.import.listNum = 0
    file.width.field = imagewidth
    file.height.field = imageheight

  } 
}

Dann sollte das auch mit dem Nachbarn klappen

merendo ·

Besten Dank fürs Vorkauen *noch mehr weiterkau*

Nun wird mir, so wie es sich wohl für ein IMAGE Objekt auch gehört, ein schöner, vollständiger HTML-Tag mit allem Drum und Dran ausgegeben

Kann ich diesem Ding allerdings auch irgendwie sagen, dass es mir nur den Dateipfad+namen mit sonst jar Nüschts ausgeben soll? Weil genau das brauch ich ja, das Drumherum steht im CSS.... (Doku ist gecheckt - hilft nicht weiter)

Chrissli ·

Hallo merendo,

hab' bei meinem Beispiel leider vergessen,
das du es Bild als css-Hintergrund willst.

Es war ein harter Kampf, denn das Fleisch das es zu kauen
galt war sehr zäh, aber ich denke ich bin zu einem Ergebnis
gekommen:

temp.BGIMGQUERY = CONTENT
temp.BGIMGQUERY {
  table = tt_content
  select.selectFields = image
  select.where = colPos = 3
  select.andWhere = CType = 'image'
  renderObj = TEXT
  renderObj {
    field = image
    listNum = 0
    wrap = uploads/pics/|         
  }
  stdWrap.ifEmpty {
    cObject = TEXT
    cObject.value = ./fileadmin/images/Zertifizierung.png
  }
}

Das fügst du dann in deinen Marker ein, et voilá

merendo ·

Besten Dank, es funktioniert nun.

Wenn du sagst, dass es Fleisch war, dass es vorzukauen galt, liegt es wohl daran - bin nämlich Vegetarier :p Vielen Dank nochmal für deine Mühen.