I have a Django project with a static/img folder I want to get this image loaded but since it's in a variable and static points to my static folder, not static/img I'm not sure how to get it in. I tried f'img/{project.image}'
I'm iterating through projects so
project.image is set to equal "some_image_for_this_project.jpg" in my database
<img class="card-img-top" src="{% static project.image %}">
Probably not the most elegant solution, but this is how it should work:
<img src="{% static 'images/' %}{{ project.image }}>
Maybe it will help
1.) Youre template.html
{% load static %}
{% static 'img/name_img.jpg' %}
*This solution works for the directory structure
app
/__pycache__
/migrations
/templates
/static/img/[YOURE_FILES...]
__init__.py
[...]
Related
code example
tooltip file
searching for the correct path
FILES:
settings.py
STATICFILES_DIRS = [
BASE_DIR / "static" ,
]
base.html
{% load static %}
How do I reference my static files in the following line of html code?...
<li class="ftco-animate"><span class="ion-logo-facebook"></span></li>
i.e. {% static 'website/...' %}
As described in the docs, assuming your filepath is BASE_DIR/static/sub_dir/example.pdf you can reference it like this:
<li class="ftco-animate">
<a href="{% static 'sub_dir/example.pdf' %}" data-toggle="tooltip" data-placement="top" title="Facebook">
<span class="ion-logo-facebook"></span>
</a>
</li>
It is good practice to place your static files in a sub-directory named same as your app name. That way, it will be much easier to reference the files from different apps later on. That is why the example in the docs says {% static 'my_app/example.jpg' %}.
Also please make sure you go through the documentations and follow all the steps mentioned there.
I am unable to upload
style="background-image:url(images/home_slider.jpg)"
file in django. I have made two changes in settings .That is as follows:
STATIC_URL = '/static/'
STATICFILES_DIRS=[ os.path.join(BASE_DIR,'static')]
STATIC_ROOT=os.path.join(BASE_DIR,'assets')
I also tried this
style=" {% static'background-image:url(images/home_slider.jpg)' %}"
But unable to remove error.
Adding more details:
load static files in your template
{% load staticfiles %}
Usage of img tag:
<img src="{% static 'images/image.jpg'%}" alt="">
In your case:
style="background-image: url('{% static "images/image.jpg" %}');"
Add static only where you use the path of the file. So:
style="background-image: url({% static 'images/home_slider.jpg' %});"
Don't forget to place {% load static %} at the top.
I try to display all images from a directory that is in the project.
In the views.py
def showimages(request):
path='C:\\Users\Peter\PycharmProjects\displayimages\displayimages\display\static'
img_list = os.listdir(path)
return render(request, 'displayphotos.html', {'images':img_list})
In the html file
{% for image in images %}
<p>{{image}}</p>
<img src="{% static '{{image}}' %}">
{% endfor %}
But the display is
<p>DSC_5390.jpg</p>
<img src="/static/%7B%7Bimage%7D%7D">
<p>DSC_5392.jpg</p>
<img src="/static/%7B%7Bimage%7D%7D">
If I print them in paragraph tag, all file names are correct, but all wrong in img tag. How can I fix it?
you have an easy issue, just write
<img src="{% static {{image}} %}">
insead of
<img src="{% static '{{image}}' %}">
remove the simple quotes
if you have the image inside you static folder than you first need to load the static folder in setting file.
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'static'),
]
and than just load the image with the correct path in your template. if you have a folder for your images than
<img src="{% static 'images/grad-hat.png' %}">
else the image name
<img src="{% static 'grad-hat.png' %}">
I am using Django and i want to import an image to my about.html file
Both the picture and the about.html are in the same file, see the picture down
i am trying to insert the image like this, but i get a broken picture icon
<img src="templates/WebApp/rolomatik_logo_crna_verzija.png"
Any suggestions please?
You cannot insert an image in that way. You need to keep that in a static folder.
Create a folder named static and place your image inside it.
Then use {% load static %} at the top of your template.
Your img tag should look like this: <img src="{% static "rolomatik_logo_crna_verzija.png" %}" />
For more details refer: https://docs.djangoproject.com/en/1.11/howto/static-files/
You should create a folder static in your app. Inside that you have to create another folder with name same as your app name. In your case it should be SmartApp/static/SmartApp/ and put your image in the folder.
After this use {% load static %} at the top of your template,inside your <head> tag. After this you can use the image like this:
<img src="{% static 'SmartApp/rolomatik_logo_crna_verzija.png' %}" >
I am trying to use the following code to link to the correct image based on the rating. However the server interprets as http://127.0.0.1:8000/static/images/rating-%7B%7Bfeedback.reception_courtesy%7D%7D.gif instead of http://127.0.0.1:8000/static/images/rating-1.gif
<img src="{% static 'images/rating-{{feedback.reception_courtesy}}.gif' %}" alt="My image"/>
I am not sure where I am running wrong here.
The problem is that variables are not interpolated within the url parameter of {% static 'url' %}, so {{feedback.reception_courtesy}} is taken literally.
Do it like this:
<img src="{% static 'images' %}/rating-{{feedback.reception_courtesy}}.gif" alt="My image"/>
This works fine because the variable is now outside of {% static ... %}, and because {% static 'one/two/three' %} is equivalent to {% static 'one/two' %}/three