Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Learn more about Collectives

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Learn more about Teams

I want to print an image by using a img src tag in a Django template file "base.html":

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en">
    <title>Foto</title>
</head>
    <h1>My helpful timestamp site</h1>
    <img src="google.png" / >
    <p>Made by ... </p>
</body>
</html>

In views.py I define:

def hello(request):
    return render_to_response('base.html')

But the image does not show up in the browser. If I open it as a simple html file, it shows up in the browser.

{% load static %} <img src="{% static 'path/to/image.ext' %}"/> Worked for me, thanks a ton! – WEshruth Apr 3, 2016 at 9:21 @WEshruth You should consider posting your comment as an answer. It answers the question definitively. – Anomitra Aug 22, 2017 at 12:50 Please check that the path to image inside the static directory is correct, I spent hours before realizing this silly mistake – Kewal Shah Mar 21, 2019 at 19:31 What if we have set image in preloader then? I have other images in same folder & they map correclty but except this one which i have placed as a preloader image. Please Help me! Thank you! – Vivek Vadoliya Jul 10, 2021 at 8:00

That happens because Django does not know the path to this image.
Make a folder named static/, and then a folder named images/ in your project root(where your settings.py file resides).

my_project/
    my_project/ 
        settings.py
        static/
           images/
             google.png

And then change it to:

<img src="{{STATIC_URL}}images/google.png" / >

More here.

Since I have only one image, I didn't want to use static files. I saw from the docs.djangoproject.com/en/1.0/ref/templates/builtins the example: <img src="bar.gif" height="10" width="{% widthratio this_value max_value 100 %}" /> – user1680859 Sep 18, 2012 at 17:20

You have got to add load static tag in the beginning of your Django template, best luck with below code.

{% load static %} 
<img src="{% static 'path/to/image.ext' %}"/>
        

Thanks for contributing an answer to Stack Overflow!

  • Please be sure to answer the question. Provide details and share your research!

But avoid

  • Asking for help, clarification, or responding to other answers.
  • Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.