[Frage] textmedia Bild als Hintergrund in <div>

  • mimii mimii
    Jedi-Ratsmitglied
    0 x
    607 Beiträge
    1 Hilfreiche Beiträge
    27. 04. 2020, 11:15

    Hallo ins Forum,
    ich möchte aus bestimmen colPos die Bilder als Hintergrundbilder für ein <div> auslesen. Dazu möchte ich die lib.dynamicContent nutzen, die mir für alle anderen colPos auch die Inhalte ausliest.

    [code]lib.dynamicContent = COA
    lib.dynamicContent {
    10 = LOAD_REGISTER
    10 {
    colPos.cObject = TEXT
    colPos.cObject {
    field = colPos
    ifEmpty.cObject = TEXT
    ifEmpty.cObject {
    value.current = 1
    ifEmpty = 0
    }
    }
    pageUid.cObject = TEXT
    pageUid.cObject {
    field = pageUid
    ifEmpty.data = TSFE:id
    }

    contentFromPid.cObject = TEXT
    contentFromPid.cObject {
    data = DB:pages:{register:pageUid}:content_from_pid
    data.insertData = 1
    }
    }

    20 = CONTENT
    20 {
    table = tt_content
    select {
    includeRecordsWithoutDefaultTranslation = 1
    orderBy = sorting
    where = {#colPos}={register:colPos}
    where.insertData = 1
    pidInList.data = register:pageUid
    pidInList.override.data = register:contentFromPid
    }
    }
    30 = RESTORE_REGISTER
    }
    [/code]

    Ich wollte das im Fluid dann so mache, funktioniert aber nicht
    [code]<div class="col-md-6" style="background-image:url('{f:cObject(typoscriptObjectPath: 'lib.dynamicContent', data: '{pageUid: '{data.uid}', colPos: '60'}')}">
    </div>
    [/code]

    Irgendwie müsste es wohl mit {f:uri.image(src:mediaElement.uid, treatIdAsReference:1)}, wobei mir hier nicht ganz klar ist, wo das mediaElement herkommen soll, wenn es nicht vorher aus Seite und der colPos ausgelesen wurde.

    Wie kriegt man das hin?

    THX für Eure Hilfe und Gruß
    mimii


  • 1
  • Eumolp Eumolp
    TYPO3-Anwärter
    0 x
    5 Beiträge
    0 Hilfreiche Beiträge
    02. 01. 2021, 10:21

    Hi!

    Du liest hier ja Inhalte aus Spalte 60 aus und lässt die komplett rendern.
    So bekommst du das komplette HTML etc und da könntest du dann per JS das Bild rausfischen....#-\

    Eleganter kannst du das mit GridElements machen, weil du ja etwas um andere Inhalte herum wrappen willst
    [code]<div class="bgImage" style="background: url({bgimage})">
    die Inhalte auf dem HG Bild
    </div>
    [/code]

    Geh mal von den GridElements Beispielen aus baue einen 1-Spalter der nur Inhalte und ein Bild aufnimmt.

    Dann rennt das.

    Richtig sauber, wenn du die tt_contentTCA aufbohrst, dann könntest du bei jedem Element ein anderes Bild verwenden.
    Im Bootstrap-Paket (offizielle Basis Projekt) wird das sehr schon durchexerziert.
    An sich gar nicht so kompliziert.

    Für den Anfang nimm mal Grid-Elements.

    (ist zwar schon ein Weilchen her, aber das braucht bestimmt wieder mal jemand als Denkanstoß)

    Christian.

  • 1