I recently started a basic django project, i want to load an already made default template. This template has an assets folder with all the CSS, JS files etc
This folder, is later called in the templates, so for example i can have:
<base href="../">
// And a lot of static files being called like this:
<link href="./assets/scrollbar/css/scrollbar.css" rel="stylesheet" type="text/css" />
<link href="./assets/somecss.css" rel="stylesheet" type="text/css" />
// And so on..
<script src="./assets/somejsfile.js" type="text/javascript"></script>
The problem with this is that none of the files in the assets are being retrieved. I know that the problem depends on where i put the assets folder, but i don't know how to solve that. I tried to add it to different parts of my project's structure but it doesn't work, since i only get a lot of errors like this:
http://127.0.0.1:8000/assets/somecss.css net::ERR_ABORTED 404 (Not Found)
Here is my settings.py:
STATIC_URL = '/static/'
In this static folder, there is a basic css file i tested before trying this.
And here is the structure of my project:
//MAIN FOLDER
migrations
ASSETS
templates -> INDEX.HTML (where the assets folder is called)
views, forms etc
Have you read the documentation on this?
It is recommended to use the static template tag to make the filesystem location of your static files independent from your URLs. Using this tag, your URLs would have to be defined like this:
{% load static %}
<link href="{% static 'assets/scrollbar/css/scrollbar.css' %}"
rel="stylesheet" type="text/css" />
<link href="{% static 'assets/somecss.css' %}"
rel="stylesheet" type="text/css" />
You also need to define the setting STATICFILES_DIRS because it looks like your static assets are not inside a default location inside an app of your project.
Related
I looked at some other questions here and followed them but my app is still not loading CSS and I do not know what is wrong. My directory is as follows.
(index.html and edit.html here)/static/css (style.css and animate.css here)
mainfolder/templates
my HTML code to load the CSS is
<link rel="stylesheet"
href="{{ url_for('static', filename='css/style.css') }}">
and
<link
rel="stylesheet"
href="{{ url_for('static', filename='css/animate.css') }}">
In Flask, static files such as JavaScript files or CSS files are served from the static folder in your package or next to your module and it will be available at /static in the application.
A special endpoint static is used to generate URLs for static files. For example:
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename = 'style.css') }}">
<script type = "text/javascript" src = "{{ url_for('static', filename = 'bootstrap.js') }}" ></script>
You need to enter the type of static file when providing the URL of this files. For example:
For CSS: type="text/css"
For JavaScript: type = "text/javascript"
If it still doesn't load, try hard reloading the page. The shortcut keys for different browsers for hard reloading the browser can be found on this page. The shortcut in Chrome (for Windows) to hard-reload is Ctrl+Shift+R
I am trying to install a new template on my Mezzanine website. My Mezzanine is on version 4.2.2 and Django on 1.9.7 . Here is what I did:
With
DEBUG = true
I created a new app call "template_app" and loaded in settings.py:
INSTALLED_APPS = (
"template_app",
...
)
I created the directory structure, and copied over the default mezzanine files (base, index...) like:
template_app
static
css
img
js
templates
base.html
index.html
includes
footer_scripts.html
I downloaded a bootstrap template and replaced the above css js img folder and index.html with the ones found in the template. (The template I used: https://startbootstrap.com/template-overviews/business-casual/ ) Then link the css and javascript in base.html:
(All css)
{% compress css %}
<link rel="stylesheet" href="{% static "css/bootstrap.css" %}">
<link rel="stylesheet" href="{% static "css/bootstrap.min.css" %}">
<link rel="stylesheet" href="{% static "css/business-casual.css" %}">
<link rel="stylesheet" href="{% static "css/mezzanine.css" %}">
<link rel="stylesheet" href="{% static "css/bootstrap-theme.css" %}">
(All js)
{% compress js %}
<script src="{% static "mezzanine/js/"|add:settings.JQUERY_FILENAME %}"></script>
<script src="{% static "js/bootstrap.js" %}"></script>
<script src="{% static "js/bootstrap.min.js" %}"></script>
<script src="{% static "js/jquery.js" %}"></script>
<script src="{% static "js/bootstrap-extras.js" %}"></script>
I'm not sure where I did wrong, or what I am missing. My website can't find the css and javascript file in the app:
Not Found: /css/bootstrap.min.css/
Not Found: /css/business-casual.css/
[07/Jan/2017 08:12:30] "GET /css/bootstrap.min.css/ HTTP/1.1" 404 1716
[07/Jan/2017 08:12:30] "GET /css/business-casual.css/ HTTP/1.1" 404 1720
Not Found: /js/jquery.js/
...
I tried modify urls.py and other parts of setting.py based on other's solutions, but they don't seems to be working. What am I doing wrong?
-- added 2017-01-09 --
Checking with findstatic linked me to the right path. Except bootstrap.css which linked me both the css file in my downloaded template and the mezzanine template.
I had the same issue with static files, but it did require that I set the "STATIC_ROOT" setting since my paths were off course.
Since I was using a custom theme I had to change the "STATIC_ROOT" path in settings.py to point to my app static files rather than it pointing to the default PROJECT_ROOT.
So I added something like this...
## Custom Theme Path (For Static Files)
THEME_URL = "template_app/"
And Changed "STATIC_ROOT" to...
STATIC_URL = "/static/"
STATIC_ROOT = os.path.join(PROJECT_ROOT, THEME_URL, STATIC_URL.strip("/"))
Make sure you restart the test server again (manually if need be), the autorestart doesnt recognise changes to the static/ directories.
I found this question on Google while looking for a solution for the same issue. I managed to work around with these steps:
First of all, double check that template_app is listed on INSTALLED_APPS above all Mezzanine apps;
Re-run findstatic;
If you still don't find it, run collectstatic. While findstatic wouldn't find the theme I wanted (but would find other themes), collectstatic managed to find it and link its static files.
I know there has been a lot of questions on this, but none of them seemed to help me at all. Here's the scenario.
I have a website using the Django Web Framework on IIS on Windows I've been working on. In order to deploy static files, I've been using the collectstatic functionality of the framework to collect the static files. This aspect of it works fine. From my settings.py:
STATIC_ROOT = os.path.abspath(os.path.join(os.path.dirname(__file__), 'static'))
# URL prefix for static files.
# Example: "http://media.lawrence.com/static/"
STATIC_URL = '/static/'
# Additional locations of static files
STATICFILES_DIRS = (
# Put strings here, like "/home/html/static" or "C:/www/django/static".
# Always use forward slashes, even on Windows.
# Don't forget to use absolute paths, not relative paths.
'C:/work/wincrash/dev/dev/analysis/static',
)
Running collect static successfully pulls all my static files from C:/work/wincrash/dev/dev/analysis/static and puts them in the /static/ folder in the root directory of the site.
My problem occurs when I'm trying to load the static files on the webpage. Here's a snippet from my base.html page that loads on every page. None of the following static files are loading, failing with the 404 error:
<link type="text/css" href="{{ STATIC_URL }}media/css/custom-theme/jquery-ui-1.8.22.custom.css" rel="Stylesheet" />
<script type="text/javascript" src="{{ STATIC_URL }}media/js/jquery/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="{{ STATIC_URL }}media/js/jquery/jquery-ui-1.8.22.custom.min.js"></script>
<!-- Base css sheet -->
<link rel="stylesheet" href="{{ STATIC_URL }}media/css/base.css" type="text/css" media="all" />
Which ends up like this when the HTML is rendered:
<link type="text/css" href="/static/media/css/custom-theme/jquery-ui-1.8.22.custom.css" rel="Stylesheet">
<script type="text/javascript" src="/static/media/js/jquery/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="/static/media/js/jquery/jquery-ui-1.8.22.custom.min.js"></script>
<!-- Base css sheet -->
<link rel="stylesheet" href="/static/media/css/base.css" type="text/css" media="all">
So I guess what I'm asking is what is preventing these files from being loaded? Is it the Django Framework? Is it IIS? The IIS logs are showing the 404 not found for all the static files. Why is this? How does IIS know where to look, and how can I help point it in the right direction?
Thanks for all in advance for your help. I know this might seem like a duplicate question but all the other questions I found on here weren't much help. I've been at this for a while and just would like to move past it.
I figured it out.
I guess you need a web.config file in your static folder in order for IIS to find the static folder from which to service the static files. When I put a web.config file with the following content in the static folder where I had all the static files, it worked immediately.
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<handlers>
<!--
This removes Helicon Zoo handler and makes IIS processing static files.
-->
<remove name="django.project#x64" />
<remove name="django.project#x86" />
</handlers>
</system.webServer>
</configuration>
try adding {% load staticfiles %} to your template
https://docs.djangoproject.com/en/dev/howto/static-files/#configuring-static-files
I am new to Django and am trying to learn how to serve static files in local deployment. I have read this and many other possible related problems from stackoverflow but i cant seem to be able to find solve my problem.
This is my settings , I cant figure out what is the reason Django isnt serving my static files
STATIC_ROOT = ''
STATIC_URL = '/html/'
STATICFILES_DIRS=('C:/Users/RayLim/Desktop/project/home/username/djcode/mysite/mysite/templates/html',)
In my templates I refer to them as
<link rel="stylesheet" href="css/style.css" type="text/css" media="all" />
The structure of my html file which is located at C:/Users/RayLim/Desktop/project/home/username/djcode/mysite/mysite/templates
html
/css
/images
/style.css
/js
/jquery.jcarousel.pack
/jquery-1.4.1.min
/jquery-func
This is the server response
"GET /home/css/images/big1.jpg HTTP 1.1" 404 3782
First, static files and templates are usually in separate directories but I don't think there would be any problem (that I'm aware of...)
Next, you want to make sure that you use a template tag to represent the static file location instead of using css/.. which expects there to be a css directory relative to whatever url you are currently viewing.
There are a couple template tags you can use, I use {{ STATIC_URL }}
So replace
<link rel="stylesheet" href="css/style.css" type="text/css" media="all" />
with
<link rel="stylesheet" href="{{ STATIC_URL }}css/style.css" type="text/css" media="all" />
And you should be all set...
You should avoid hard linking to your static directories. It can cause confusion and potential problems as your project gets bigger
Please refer to this, it has everything you need.
Django staticfiles app help
I'm using django 1.3
I'm using a base.html template which my pages inherit from. Everything works fine except for one page (which has a form on it).
That page is trying to call the CSS from /links/addlink/css/site.css but this is the wrong location. It is in /static/css/site.css
In my base.html I have <link rel="stylesheet" href="{{ STATIC_URL }}css/site.css" type="text/css" charset="utf-8" />
If I create a completely seperate template and use the full path like <link rel="stylesheet" href="http://127.0.0.1:8000/static/css/site.css" type="text/css" charset="utf-8" /> then my page renders correctly.
What is wrong?
You are not using RequestContextin your view.
See here: Referring to static files in templates