CODEWITHSUNDEEP
htmldjangojinja2
Murray
Murray

Reputation: 57

How to add an image to a jinja html page

I'm just learning the basics of django and jinja. I've extended my header file and now I want to add an image to the page, but I don't know the jinja syntax for doing that. Please assist.

{% extends "media/header.html" %}
{% block content %}
This is where I would like to insert my image.
{% endblock %}

Upvotes: 2

Views: 12267

Answers (2)

Rajesh Panda
Rajesh Panda

Reputation: 646

May be this is too late to reply, but this is how I use for rendering images using jinja syntax. I have successfully rendered images on pdf from html.

 <div class="img-div" style="background-image: url('{{ element.image }}');">
 </div>

element.image could be a any resolvable url.

Upvotes: 1

uedemir
uedemir

Reputation: 1714

Just use html img tag for that. If you pass your image in context as variable;

{% extends "media/header.html" %}
{% block content %}
    <img src="{{ variable }}" alt="image alt text" />
{% endblock %}

If you just have static path;

{% extends "media/header.html" %}
{% block content %}
    <img src="{{ static('path/to/image.png') }}" alt="image alt text" />
{% endblock %}

Upvotes: 6

Related Questions