Django static templatetag not displaying SVG - python

I'm trying to use django's static templatetag to display an SVG, but it doesn't seem to recognize the SVG as a valid image url. This is what I currently have:
settings.py
import mimetypes
mimetypes.add_type("images/svg+xml", ".svg", True)
landing.html
{% load staticfiles %}
<img src="{% static 'images/right-arrow.svg' %}" />
At least in my view.py, it recognizes the SVG mimetype:
views.py
print(mimetypes.guess_type(static('images/right-arrow.svg')))
# returns ('images/svg+xml', None)
The SVG does display in a non-django page, and it will download the SVG if I try to open the SVG path in a new browser tab.
I'm currently using python 3.4 and django 1.8.4.

I found the issue. In settings.py, it should be mimetypes.add_type('image/svg+xml', '.svg', True). image should be singular.

I faced a similar issue.I would recommend you to use :
src="{{ STATIC_URL }} images/right-arrow.svg" instead of src="{% static 'images/right-arrow.svg' %}"
svg format might not always identify django's method of obtaining staticfile contents.Hope this helps :)

Add this in your settings.py file.
import mimetypes
mimetypes.add_type("image/svg+xml", ".svg", True)
mimetypes.add_type("image/svg+xml", ".svgz", True)
In your cases you have added images in add_type which should be singular (image).

You are loading staticfiles and using static?
This is wrong.
Try changing {% load staticfiles %} <img src="{% static 'images/right-arrow.svg' %}" /> to
{% load static %} <img src="{% static 'images/right-arrow.svg' %}" /> and you also need to consider which app you should find your static files.

Related

Error loading image filepath from the database in django

i am starting to use django and i have a little mistake in some of my code but i dont know where is it.
I am trying to load a image from my database in a filepath.
This a part from my models.py that i am using to load the image:
class Articulo(models.Model):
...
nombre_imagen=models.CharField(max_length=64)
As you can see, i am loading the image from a filepath in my database.
And this is the part of the code that i am trying to do that:
{% if articulo %}
{% for articulo in articulo %}
....
<img class="card-img-top" img src="{% static '{{articulo.nombre_imagen}}'}" alt="">
.....
{% endif %}
The image is located in the static files:
STATIC_URL = '/static/'
I think there is a stupid problem, but as i said before. I am new at django.
I hope that anyone can help me, thank you!.
Your issue is that you aren't calling the image variable correctly.
src="{% static '{{articulo.nombre_imagen}}'}"
should be
src="{% static articulo.nombre_imagen %}"
Also, your image field should be models.ImageField().
nombre_imagen=models.CharField(max_length=64)
should be
nombre_imagen=models.ImageField(upload_to="images/", blank=True)

Static file in django without Using {% static "abc.jpg" %}

I had static files in django.
Project Structure Sample
I have project structure like above i want to use js and img from asset folder. How can i do this ? How i can avoid using {% static "abc.jpg" %} ?
First you need to keep this files in static folder
Keep these files out of templates like
project_main_folder/static/img/abc.jpg
The recommended way is to use static tag provided by django.
{% static "abc.jpg" %}
Without static tag you can do this like
<img src="host:port/static/img/abc.jpg" />
or
<img src="/static/img/abc.jpg" />
This is not recommend.

Django project not recognizing SCSS files

I've been struggling to get Django to recognize my SCSS files (I may be misusing SCSS/SASS/LESS terminology... their relationship confuses me). I'm using django-libsass and compress, both of which seem pretty straight-forward. My page is giving me the error "Resource interpreted as Stylesheet but transferred with MIME type application/octet-stream: ". It's loading the page but none of my styles are showing.
I'm not sure what people need to see. My template includes:
<link href="{% static 'css/blog.scss' %}" rel="stylesheet">
(this worked fine when it was css)
Settings:
COMPRESS_PRECOMPILERS = (
('text/x-scss', 'django_libsass.SassCompiler'),
)
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
# other finders..
'compressor.finders.CompressorFinder',
)
Try adding type="text/x-scss" to the link element along with the compress tag:
{% compress css %}
<link href="{% static 'css/blog.scss' %}" rel="stylesheet" type="text/x-scss">
{% endcompress %}
And make sure to load the compress tag before you use it:
{% load compress %}

django set image src path

I want to set an image as a submit button form:
<form action="/final" method="post">{% csrf_token %}
<input type="hidden" name="title" value="niloofar">
<input type="image" name="submit" src="cat.jpg">
</form>
The image is in the template directory and the image is not shown.
How should I manage it with STATIC_URL = '/static/'?
Should I make a directory called static and put the image there?
And how the form should be changed?
You need to properly configure your static files. More info can be found in Django docs
Additionally, make sure you are writing the correct path the image, as shown in the docs:
{% load staticfiles %}
<img src="{% static "my_app/myexample.jpg" %}" alt="My image"/>
Now some changes are there to be noted.
You should not load your static files with
{% load staticfiles %}
Instead you should write
{% load static%}
And in source (denoted as src), you should give path of image file from static folder located in your directory. Not from the local resources.

how to display images?

please help bring images into the template
in django1.6 I uploaded via the form in the database image. screenshot. ( checked that the images loaded in a specific directory ) . then imported into the template file settings.py variable BASE_DIR and to all records of a table . then tried in the template to display the image as follows:
{% for entrie in all_entries_carousel %}
<a href="{{ entrie.link }}" title="{{ entrie.title }}" target="_blank">
<img src="{{ BASE_DIR }}/{{ entrie.image }}" width="300" height="200" alt="{{ entrie.title }}" />
</a>
{% endfor %}
results in images that I have not loaded and displayed.
in the source path
c:\Python33\django_projects\proj1/carousel/media/images/img1.png
please tell me how can I still display the image. Sure , there is a path without importing BASE_DIR
ps this way does not work proj1/carousel/media/images/img1.png
You need to configure your static files.
From Django docs:
Make sure that django.contrib.staticfiles is included in your
INSTALLED_APPS.
In your settings file, define STATIC_URL, for example:
STATIC_URL = '/static/'
In your templates, either hardcode the url like
/static/my_app/myexample.jpg or, preferably, use the static template
tag to build the URL for the given relative path by using the
configured STATICFILES_STORAGE storage (this makes it much easier
when you want to switch to a content delivery network (CDN) for
serving static files).
{% load staticfiles %}
<img src="{% static "my_app/myexample.jpg" %}" alt="My image"/>
Store your static files in a folder called static in your app. For
example my_app/static/my_app/myimage.jpg.

Categories