Image in static couldnt be found without using CSS under Django frame - django

I want to input an image in the .html so I put the image in the static files and I don't want to apply CSS. But it says it can't find that pic I wanna use.
In the .html file, I wrote like this
<img src="images/background.jpg alt="It is an img">
So, can anybody tell me what to do or anything I should change in other files like settings.py?
My files context is what the image shows.

Please add some code for better understanding of your question, and you can add image directly in your question without sharing external links.
For static file you can use,
{% load static %}
<img src="{% static 'your image location' %}" alt=image>
# in your case location is 'lemonade/images/background.jpg'
Here is the official document,
Django Static Files

Related

I uploaded my website to Github and it isn't reading any of the other files associated with the website

The CSS stylesheet isn't loading, nor are any of the pictures loading.
The site, Github folder
It is because the mentioned URL is mismatching with the original one.
The name of the folder which contains the images is Image and not image, the difference is the letter I, it should be in capital.
As: You have used <img class="mountain" src="images/mountain.png" alt="mountain-img">, which gives an Error 404. Use <img class="mountain" src="Images/mountain.png" alt="mountain-img"> instead and it will work well.

Embed PDF media file in Django template

The question is that I want to embed a PDF file through <embed>, <iframe> tag, or similar in a Django template using {{ object.file.url }}, which is presumed to be a file saved in the /MEDIA/ folder by a Django model.
The fact is that if I embed a PDF file coming from /STATIC/ folder, everything goes well. However, if I try the same with the {{ object.file.url }}, it does not work.
The curious thing is that if I simply display the {% static 'path/pdf.pdf' %} and {{ object.file.url }}, they both give me a valid link like this:
/static/img/111.pdf
/media/projects/phases-guide/111.pdf
If I try to open them separately, they work perfectly. But at the moment of embedding them in a HTML tag, it only works with the static url file.
Can someone tell me any idea why this is happening?
Anyway, is there any alternative to "EMBED FILE COMING FROM MEDIA FOLDER ROOT"?
I tried to enable read media files, but anyway it is not working.
The problem is that clickjack protection is being enabled on the MEDIA files that you are trying to embed.
You can see in the error console in your browser’s developer mode that ”X-Frame-Options” is set to ”Deny” for MEDIA files but not for STATIC files.
There are several ways of changing this per view using method or class decorators, but that didn’t work in my code, so I did a generic change in SETTINGS.py like this:
X_FRAME_OPTIONS = ”SAMEORIGIN”
Then it worked for me.

Why is {% load static %} a dependency for {% get_media_prefix %}?

I've been using {% get_media_prefix %} for a very long time. I was explaining this to someone when he pointed this out.
Why do I need to declare {% load static %} in order to use it?
It even uses in the documentation's example code here.
To an extent I understand that static files and media files are similar in nature. Even when we use them with combination of nginx+gunicorn, nginx handles both of them(we let everything else proxy, but not these).
But still we have a separate MEDIA_URL and STATIC_URL as well as MEDIA_ROOT and STATIC_ROOT defined for these files.
Then why {% load static %} needs to be declared in order to use {% get_media_prefix %} ?
Thanks in advance.
In order to use a template tag in your HTML you must first load the module that contains it.
So, accorrding to the source code of get_media_prefix template tag, this template tag lives inside django/templatetags/static.py.
That's why you have to load it every time you use it, in every HTML template.
This, of course, applies to every template tag usage. At the top of every HTML file you load the template tags and then you use them. Just like you import a function in your python code.
UPDATE: From the Django 1.3 release notes:
In previous versions of Django, it was common to place static assets in MEDIA_ROOT along with user-uploaded files, and serve them both at MEDIA_URL. Part of the purpose of introducing the staticfiles app is to make it easier to keep static files separate from user-uploaded files. Static assets should now go in static/ subdirectories of your apps or in other static assets directories listed in STATICFILES_DIRS, and will be served at STATIC_URL.
As you can see, Django used to treat both static and media the same. Since Django 1.3 this changed, but the template tag not. No big deal. It's just a convention.

Reference to static image in django using template

for fun I am monitoring the free disk space on my linux box. I have indexed the mount points and store the contents in a MySQL database. Now I want to display this info using django.
A cron job automatically creates plots of the free space for the last 24 hours. They are named "graph_day_drive_1.png" to "graph_day_drive_3.png", where the number stands for the id of the mount point. I have put these images in the static directory of my app.
Now, I want to display them when showing a details view for a selected mount point.
I've read that the usual way to access an image is:
<img src="{% static "diskspace/graph_day_drive_1.png" %}" alt="last 24h"/><br>
which, of course, displays the same image regardless of which drive I select. I've tried using the following (drive refers to the model I read from the database):
<img src="{% static "diskspace/graph_day_drive_{{ drive.id }}.png" %}" alt="last 24h"/><br>
but it doesnt work as it creates the following html code:
<img src="/static/diskspace/graph_day_drive_%7B%7B%20drive.id%20%7D%7D.png" alt="letzte 24h"/>
which, obviously, doesn't work.
Can anyone tell me the proper way to access these images?

Referencing images from template

I want to insert an image into my template. The image resides in the same folder as the template.
I tried:
<img src = "imageName.png" />
but for some reason, this wouldn't work.
Does anyone have an idea why that is?
Don't put images in the same folder as templates. Images are a part of static content. You should read about managing static files in django.
Hope that helps.
I'm guessing you're new to the whole django scene, so don't be afraid to hit a few boulders on the way. In fact, this is a problem that I faced too, since I just usually put everything on a web-server, with an index.php file (yes, the horror), and everything was just relative.
So, let me give you a little context, what you are trying to embed on a page is called a static file. What that basically means is a file that does not change, a file that is not dynamic. Now, since these static files require no processing, they are treated specially, and are put inside a static folder. You can see where your static folder is when you check your main settings.py file.
Now often, people make a lot of mistakes with static files, because there are so many variables that have a STATIC infront of them. I know, its totally counter-intuitive, but there are reasons why they're there. So, let me direct you to something that can be a little help in understanding this whole fiasco.
When using static files, you usually use a few special tags. You can learn more about them here. But, I'll just show you how you would embed your image into your html, just as a sample.
{% load staticfiles %}
<img src="{% static "images/myphoto.png" %}"/>
So, how should your directory look like? Well, what you would have is something like this
STATIC_FILES_FOLDER > IMAGES > myphoto.png
Hope that helps.