How to render a background image in my index.html to make it dynamic using Django?

Question

I'm trying to make a template dynamic. I added the jinja pattern wherever required and it worked except for the background images of the page.

I tried this:

    <div class="background_image" style="background-image:url({% static 'images/travello.jpg' %})"></div>

I expected to see the bg_image on the page, but i get nothing except blank white space. I get other images in the same folder using:

    <img src="{% static 'images/destination_4.jpg' %}" alt="">

you need to enclose the url in single quotes to obtain url('/static/path/to/images/im.jpg'). If you look at the source code in your browser inspector you'll see the quotes are missing. — dirkgroten
– dirkgroten, Commented May 27, 2019 at 14:39

Akm Kawser · Accepted Answer · 2020-07-02 03:29:51Z

1

Just add static in front of the image url such as the following

<div class="background_image" style="background-image:url(static/images/travello.jpg)"></div>

answered Jul 2, 2020 at 3:24

Akm Kawser

1531 gold badge1 silver badge8 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1