# Correct way to upload image to website

**URL:** <https://forum.djangoproject.com/t/correct-way-to-upload-image-to-website/4742>\
**Category:** Using Django\
**Created:** [October 11, 2020, 1:18pm UTC](https://forum.djangoproject.com/t/correct-way-to-upload-image-to-website/4742 "2020-10-11T13:18:33Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![krupis](https://avatars.discourse-cdn.com/v4/letter/k/b5a626/32.png) [@krupis](https://forum.djangoproject.com/u/krupis)\
**Post date:** [October 11, 2020, 1:18pm UTC](https://forum.djangoproject.com/t/correct-way-to-upload-image-to-website/4742/1 "2020-10-11T13:18:33Z")

</div>

Hey. I am new to Django and web development. Slowly learning how to build my website. In my app project, I have created a static folder where I keep my css and images. I want to know what is the correct way to upload images:

 ![image](https://us1.discourse-cdn.com/flex026/uploads/djangoproject/original/2X/c/c3e7f637c6bf3506610c5fb01171f2765ed891cb.png)

See the image above. I am able to upload image using 2 methods. One using the static method and the other one just providing the full path which in this case is static/baltu\_vila\_logo.png

What are the differences of these 2 methods and which one to use?

---

<div class="post-metadata">

**Author:** ![KenWhitesell](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.djangoproject.com/kenwhitesell/32/280_2.png) [@KenWhitesell](https://forum.djangoproject.com/u/KenWhitesell)\
**Post date:** [October 11, 2020, 2:15pm UTC](https://forum.djangoproject.com/t/correct-way-to-upload-image-to-website/4742/2 "2020-10-11T14:15:50Z")

</div>

I’m a bit confused by what you’re trying to ask.

Generally speaking, the term “upload” is describing the process of sending files from the client to the server, neither of which involve either of the forms you’ve presented here.

Either of those two methods you’ve shown are ways to display images already existing on the server, on a web page. Of those two options, using the `{% static ...` method is far superior than trying to code full paths. (It gives you a lot more flexibility when deploying your project to a production environment.)

Ken

---

<div class="post-metadata">

**Author:** ![krupis](https://avatars.discourse-cdn.com/v4/letter/k/b5a626/32.png) [@krupis](https://forum.djangoproject.com/u/krupis)\
**Post date:** [October 11, 2020, 2:22pm UTC](https://forum.djangoproject.com/t/correct-way-to-upload-image-to-website/4742/3 "2020-10-11T14:22:17Z")

</div>

Thanks for the reply. Yes I have meant just displaying the images on the website. The tutorial that I have seen initially said that I need to use :  
{% load static %}

at the beggining of my index.html to use static images and etc. I have commented out that line of code and my image still displays without any problems. Could you explain me a little bit what {% load static %} is used for?

---

<div class="post-metadata">

**Author:** ![KenWhitesell](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.djangoproject.com/kenwhitesell/32/280_2.png) [@KenWhitesell](https://forum.djangoproject.com/u/KenWhitesell)\
**Post date:** [October 11, 2020, 2:29pm UTC](https://forum.djangoproject.com/t/correct-way-to-upload-image-to-website/4742/4 "2020-10-11T14:29:37Z")

</div>

[Documentation for the static tag](https://docs.djangoproject.com/en/3.1/ref/templates/builtins/#static)

When you’re posting code here, please do not post images. They’re not readable on every device. Post the actual code, between lines consisting of three backtick (`) characters. (That means you’ll have a line of ```, your code, and then another line of ```. Make sure you use the backtick - `, and not the apostrophe - '.)

Ken

---

<div class="post-metadata">

**Author:** ![krupis](https://avatars.discourse-cdn.com/v4/letter/k/b5a626/32.png) [@krupis](https://forum.djangoproject.com/u/krupis)\
**Post date:** [October 11, 2020, 2:34pm UTC](https://forum.djangoproject.com/t/correct-way-to-upload-image-to-website/4742/5 "2020-10-11T14:34:35Z")

</div>

```auto
{% load static %}
<img src="{% static "images/hi.jpg" %}" alt="Hi!">

```

I am able to display my static image without

```auto
{% load static %}

```

---

<div class="post-metadata">

**Author:** ![KenWhitesell](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.djangoproject.com/kenwhitesell/32/280_2.png) [@KenWhitesell](https://forum.djangoproject.com/u/KenWhitesell)\
**Post date:** [October 11, 2020, 2:51pm UTC](https://forum.djangoproject.com/t/correct-way-to-upload-image-to-website/4742/6 "2020-10-11T14:51:43Z")

</div>

Please post the complete template.

---

<div class="post-metadata">

**Author:** ![krupis](https://avatars.discourse-cdn.com/v4/letter/k/b5a626/32.png) [@krupis](https://forum.djangoproject.com/u/krupis)\
**Post date:** [October 11, 2020, 3:00pm UTC](https://forum.djangoproject.com/t/correct-way-to-upload-image-to-website/4742/7 "2020-10-11T15:00:47Z")

</div>

What do you refer to as a template?  
My project structure is :

 ![image](https://us1.discourse-cdn.com/flex026/uploads/djangoproject/original/2X/b/bb08ebf7a72b6d6939ecf7f0e5660e4f844686ca.png)

I have started an app named “hello”. Inside hello I have created a “static” fodler where I keep the css and images

my index.html:

```auto
<!DOCTYPE html>
<!--{% load static %}-->

<link rel="stylesheet" href="{%static 'css/main.css' %}">
<html>
	<head>	
		<title>Baltu vila</title>
	</head>
	<body>
	<div class="hero-image">
	 	<div class="hero-text">
	    	<h1>test</h1>
	    	<p>test</p>
	  	</div>
	</div>
	<img src="{% static "baltu_vila_logo.png" %}" >
	<h1> hello world12</h1>

	</body>

</html>

```

In my settings.py project folder I have added a line:

```auto
STATICFILES_DIRS = ["C:/Users/Lukas/Desktop/dev/django/django_app/hello/static",
]

```

---

<div class="post-metadata">

**Author:** ![KenWhitesell](https://sea2.discourse-cdn.com/flex026/user_avatar/forum.djangoproject.com/kenwhitesell/32/280_2.png) [@KenWhitesell](https://forum.djangoproject.com/u/KenWhitesell)\
**Post date:** [October 11, 2020, 4:07pm UTC](https://forum.djangoproject.com/t/correct-way-to-upload-image-to-website/4742/8 "2020-10-11T16:07:01Z")

</div>

Your index.html file _is_ a [Django template](https://docs.djangoproject.com/en/3.1/topics/templates/#module-django.template). It’s not sent to the browser as-is, it’s processed by a template engine to convert it to the html that is actually sent to the browser.

As a result:

> [@krupis](#):
>
> `<!--{% load static %}-->`

does **_not_** comment out the load static. The template engine is still interpreting that line, and using it to load the static templates.  
What you’ve done is place it within an html comment, which doesn’t really “mean” anything in the context of the rendering engine.

If you wish to comment out that line for the rendering engine, you either need to use the [comment](https://docs.djangoproject.com/en/3.1/topics/templates/#comments) syntax or the [multiline comment](https://docs.djangoproject.com/en/3.1/ref/templates/builtins/#comment) format.