Hi @ElineTribes,
there are some different ways that will get this to work.
In my opinion the easiest(and cleanest) one would be to “write” a custom module. It’s easier than it sounds 
Simply create a new module and give it to widgets/modules
- an image one
and
- a (rich)text one
the image snippet looks something like this:
{% if module.image_field.src %}
<img src="{{ module.image_field.src }}" alt="{{ module.image_field.alt }}" width="{{ module.image_field.width }}" height="{{ module.image_field.height }}">
{% endif %}
and the text one something like this:
{% inline_text field="text_field" value="{{ module.text_field }}" %}
to get the image “behind” the text you should add the image snippet to an inline background-image style. Since a background-image doesn’t need an alt-tag or sizes your code should look like this:
<div class="row" id="my-pretty-background-image-wrapper" style="{% if module.image_field.src %}background-image:url({ module.image_field.src }});{% endif %}">
<div class="container">
<div class="span12">
<div class="my-pretty-headline">
<p>{{ module.text_field }}</p>
</div>
</div>
</div>
</div>
also should consider to style the image via CSS and give it a cover-size
#my-pretty-background-image-wrapper{
background-size:cover;
background-position:center center;
}
regards
Anton
| 
| Did my post help answer your query? Help the Community by marking it as a solution |
| — | — |