I have a webpage which includes an image. I wish to cache bust that image using the ? technique. However, staticfiles encodes questionmarks as '%3F', so the path is no longer correct.
{% load staticfiles %}
<img src="{% static 'poll/img/test.jpg?v2' %}">
Gets compiled as.
<img src="/static/poll/img/test.jpg%3Fv2">
There is no test.jpg%3Fv2 file. So it doesn't show. Using static it works fine.
{% load static %}
<img src="{% static 'poll/img/test.jpg?v2' %}">
Get's compiled as expected. I want to use staticfiles rather than static as I serve my static files from a cloud service. Is there a way to prevent the encoding of my string path or a workaround of the problem?
To solve the encoding either write your own version of the static tag or simply move the parameters beyond the tag.
{% load staticfiles %}
<img src="{% static 'poll/img/test.jpg' %}?v2">
Related
I've been working on a simple Django project for myself and I came into a little problem.
When first developing the blog, I didn't make templates, I just made sure things were working properly, but now, I dived into making the templates and everything is working besides my header background-image.
Before the templates, I was doing it like this:
<header class="masthead" style="background-image: url({% static 'img/home-tech-bg.jpg' %})">
This was working just fine, but now that I'm trying to do the same as a template it doesn't work. It doesn't return me any errors, but the image doesn't display.
What I did was the following:
template base.html
<header class="masthead" style="background-image: url({% block headerimage %} {% endblock %})">
blog.html
{% load static %}
{% block headerimage %}
{% static 'image/image.jpg' %}
{% endblock %}
What is a better way to do this?
Well first off move your static directory to your root directory and write the path in the template like this:
{% load static %}
<img src="{% static 'img/home-tech-bg.jpg' %}" alt="/">
Also make sure your settings.py file is properly configured to serve static files, add this line if you havent yet:
STATIC_URL = '/static/'
If I structure the first two lines of my HTML doc like this:
{% load static %}
<!DOCTYPE html>
It appears that none of the javascript or CSS run properly, and the webpage displays like this:
However, if I put any character after the {% load static %} expression,
For example, if I structure the first two lines of my HTML doc like this:
{% load static %}.
<!DOCTYPE html>
Then the scripts and CSS components run properly and the webpage displays as it should. Why is this?
Figured it out. For some reason, the content security policy that I had implemented was causing this issue. After removing the CSP, the static files began to behave in-line with expectations regardless of the presence/absence of a character after {% load static %}.
{% load static %}
<!DOCTYPE html>
You did it right but you have load the static files too like i did below.
<!-- js -->
<script type="text/javascript" src="{% static 'js/jquery.min.js' %}"></script>
<!-- js -->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="{% static 'js/bootstrap.min.js' %}"></script>
<script src="{% static 'js/bootstrap-select.js' %}"></script>
You have to use this tag to load static files in template "{% static %}" this is the syntax for load static files.
#And give it the path in settings.py
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "static"),
]
And store css and js in static folder in your project too.Than its gonna work.
Make sure that the STATIC_URL of your settings is correct.
Hey everybody i have a problem with this code which i try to run on local host server , in this situation im followin an online project over youtube and he is trying to make an online resume, at the start we tried to make a simple home template which i stock in it so if u can help me to fix the problem in which cause to rise this error
'Static' is not a registered tag library. Must be one of:
admin_list
admin_modify
admin_urls
cache
i18n
l10n
log
static
tz
and this the code itself:
{% load Static %}
<link href="{% static '/css/main.css' %}" rel= "stylesheet" type="text/css">
<h3> Hello world! <h3>
<img src="{% static 'images/me.profile.jpg'%}"
this is the setting.py by the way:
STATIC_URL = '/static/'
MEDIA_URL = '/Images/'
STATIC_DIRS= [
os.path.join(BASE_DIR, 'static')
]
The tag is {% load static %} without the capital S.
it's a recommended way or templating engine rules first make folder template or static folder then in template make a new folder app_name.
then in app_name work on static files.
in your app make a folder name static in it you make another folder name of your app_name init you work on your static files
e.g
static/app_name/images/me.profile.jpg
maybe problem also in this name me.profile.jpg please change it to
profile.jpg.
you don't need to change anything in setting.py because static root default set .
{% load static %}
<link href="{% static 'app_name/css/main.css' %}" rel= "stylesheet" type="text/css">
<h3> Hello world! <h3>
<img src="{% static 'app_name/images/me.profile.jpg'%}" >
For example to load a static image, I need to do that in template in two lines, like this:
{% load staticfiles %}
<img src="{% static "img/pro_pic.png" %}">
Is there any way to do that in one line?
<img src="{% staticLoad( "img/pro_pic.png" ) %}">
and a function somewhere that checks {% load staticfiles %} is there or not, if not it loads and all that? I also encourage time complexity discussion if it can be done!
By default the django.core.context_processors.static context process is included in the TEMPLATE_CONTEXT_PROCESSORS setting so you can just write in your template:
<img src="{{ STATIC_URL }}img/pro_pic.png">
All of my user's have the option to link a profile picture. There are several templates that need to load this profile picture. If the user has not uploaded a picture, we use a default. When I want to display this profile picture, my code looks like this
<img src="{% if user.profile_picture.search_thumbnail.url %}{{ user.profile_picture.search_thumbnail.url }}{% else %}{% static "alternate.jpg" %}{% endif %}">
This is way too verbose for me, especially considering I need to repeat it out in multiple templates. I could use {% with %} blocks to store user.profile_picture.search_thumbnail.url, but that won't help me too much.
My solution was to write a function attached to the user model that returns the url of the static file. Unfortunately, the {% static %} is a template function. {% url %} has an equivalent function on the server called django.core.urlresolvers.reverse(). Does the alternative thing exist for the {% static %} tag?
In case anyone asks, I want to use the static function because my static files are stored in different places depending on the environment. My dev machine serves files locally, while my PRD machine serves static files from s3.
Thank you,
Nick
why not write a filter so you can do this.
<img src="{{ user.profile_picture.search_thumbnail.url|custom_filter }}">
and in the custom_filter you read from the settings.STATIC_URL to return the correct URL the user one is not set.
you could make the filter even shorter like this
<img src="{{ user|user_pic_url }}">
and in the filter pull out the .profile_picture.search_thumbnail.url /checks
This is what the static templatetag does underneath, and you can use it just fine in your own code:
from django.contrib.staticfiles.storage import staticfiles_storage
def static(path):
return staticfiles_storage.url(path)