dynamic background image style url

1.2k views Asked by At

I would like to in fluid dynamically change background image url through content "image only" input. I've tried this

But it is not exactly what I need. This is my code:

<div class="jumbotron" style="background-image: url('img/subpageHeader.jpg');">
    <div class="menu-trigger"><i class="fa fa-bars"></i></div>
    <p class="headerText"><f:format.raw>{header}</f:format.raw></p>
    <p class="logo pull-right">Sitename</p>
</div>

Can I make background-image url parameter dynamic without a complete new wrap?

Thanks

RESOLVED

Get image URL from resourses:

lib.headerimage = IMG_RESOURCE
lib.headerimage {
  file {
    import.data = levelmedia:-1, slide
    treatIdAsReference = 1
    import.listNum = 0
  }
}

Include in style:

<div class="jumbotron" style="background-image: url('<f:cObject typoscriptObjectPath="lib.headerimage" />');">

I've put image in resources instead in content with image only.

0

There are 0 answers