I am watching beginner course on django . So basically i am running server from cmd and when i want to change anything on css file it doesnt change live . My css file is in static folder in root directory.
STATIC_URL = '/static/'
STATICFILES_DIRS = (os.path.join(BASE_DIR, 'static'),)
my html :
{% load static %}
<link type = "text/css" href="{% static 'style.css' %}" rel="stylesheet">
<h1>Hi welcome to my page </h1>
You have to reload the page and the server once you have made the changes. Stop the server after the changes and start it again and reload the page.
A quick way exist, the shortcut to reload cache:
Ctrl + Shift + R
Then just reload page
Related
I'm new on Django and I have some problems with the static folder.
I created a "static folder" on the project root and inside I put folders for each app.
Django admin page is charging correctly
But CSS, JS, images and others on my index isn't.
How can I avoid have this problems in the future? For your answers, thank you so much.
settings.py
I set the {% load static %} in my html document
and i write the static tag like this example:
<link rel="stylesheet" href="{% static 'principal/css/bootstrap.min.css' %}" type="text/css">
Yo haven't created STATIC_DIRS where the django will find CSS,javascript files and the create the STATIC_ROOT where the django will store all the files
then run python manage.py collectstatic to let setup all the files
I just started Django and I'm trying to import JavaScript Files from static directory. So basically I was working on a Flask project for some time, so to import javascript file I was always using - {{ url_for('.static', filename='js/js_file1.js' }}. Now I realized that I need to use other methods as - {% static 'main/js/js_file1.js' %}. So after some time, I was able to import my css files with - <link rel="stylesheet" href="{% static 'main/css/styles.css' %}">, they are in static/main/css/files..., although my js files are in static/main/js/files.... But for some reason, the JavaScript files won't import themselves. I'm importing them with - <link rel="application/javascript" href="{% static 'main/js/bootstrap.min.js' %}">.
Here are the network logs from Developer console, as I can see there are no JS files on their way to import themselves.
And here are the server Logs from the running server on cmd.
Developer Console Logs.
My settings.py file has this static_url, which I guess specifies the static folder.
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/3.0/howto/static-files/
STATIC_URL = '/static/'
My whole HTML File.
Firsteval, you have to do manage.py collectstatic, then on top of your template you have to import the static files with {% load static from staticfiles %}, finally you can import your file <script src="{% static 'js/myfile.js' %}"></script>
I'm trying to locate all bootstrap files in django project in only one folder and reference them. In order to do that I've added these lines to setting.py:
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
My base.html looks like this:
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Muplay</title>
<link rel="stylesheet" type="text/css" href="{% static'css/bootstrap.css' %}">
<script src="{% static 'js/bootstrap.js' %}"></script>
</head>
<body style="background-color: #F2F2F5">
{% include 'snippets/nav.html' %}
<div class="container">
{% block content %}{% endblock %}
</div>
</body>
</html>
When I extend this base.html to other html files css and js file is loaded successfully in browser. But, problem is that, in terminal, django returns 404 error as follows:
[10/Dec/2017 14:03:27] "GET /static/js/bootstrap.js HTTP/1.1" 404 1759
[10/Dec/2017 14:03:27] "GET /static/css/bootstrap.css HTTP/1.1" 404 1765
Why django returns 404 code while those static files are successfully loaded in browser?
Remove STATIC_ROOT Add STATICFILES_DIRS to the settings file.(Recommended during development)
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'static'),
)
STATICFILES_DIRS :
This setting defines the additional locations the staticfiles app will traverse if the FileSystemFinder finder is enabled, e.g. if you use the collectstatic or findstatic management command or use the static file serving view.
This should be set to a list of strings that contain full paths to your additional files directory
STATIC_ROOT :
The absolute path to the directory where collectstatic will collect static files for deployment.
If you want to use STATIC_ROOT, then run the command python manage.py collectstatic which will collect all the static files to the static directory mentioned in STATIC_ROOT. This is used during deployment.
Find the detailed documentation here.
I'm developing django website and am using bootstrap, I can see the styles on chrome browser but not firefox.
firefox inspection shows 404 error for the bootstrap and chrome doesn't. Thankful for any idea.
Code :-
#settings.py
# Build paths inside the project like this: os.path.join(BASE_DIR, ...)
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
PROJECT_DIR = os.path.dirname(os.path.abspath(__file__))
STATIC_URL = '/static/'
STATIC_ROOT = '%s/coffestatic/' % (BASE_DIR)
STATICFILES_DIRS = ['%s/website-static-default/'% (BASE_DIR),
("bootstrap", '%s/bootstrap' % (BASE_DIR)),]
HTTP file.html
<head>
{% load static %}
<link href="{% static'bootstrap/css/bootstrap.css'%}"rel="stylesheet">
</head>
Files structure
BASEDIR
|--ProjectFolder
|------Apps
|--BootstrapDir
|------css
Work flow
Define static files
python manage.py collectstatic
Define styles in html
run project
Thanks
I'm not sure if your settings.py files are correct as they are different from how I would set things up. That being said, I'm no expert and you may well be running a different version of django to me. What I did notice though is you don't have a file type on your link file. Maybe Chrome is fine without this but maybe Firefox is having a hissy fit without it. Try changing:
<link href="{% static'bootstrap/css/bootstrap.css'%}"rel="stylesheet">
to
<link href="{% static'bootstrap/css/bootstrap.css'%}"rel="stylesheet" type="text/css">
Just a guess....
Using bootstrap starter file in your html file will help; as I have done the same and it helped.
Add these files at the end in body section:
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRS
and add these files at the starting in head section:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
I'm a beginner at django so not sure about it but it worked for me.
In project folder create a directory with any name. Let's name __shared__ and put the css and jss folders inside the directory
and in settings.py
at bottom put this code
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "__shared__"),
]
Ok I am new to Python, I am using Django here.
I cannot get my Python to see the CSS file and use it. I have tried hardcoding the path, server restarts, nothing works. I can get it to read a Bootstrap CDN however, I am not sure what is wrong.
My File structure is like so:
-migrations
-static
--music
---images
---style.css (the file that i'm trying to get)
-templates
--music
---index.html (where my link attribute is)
I am trying to load the static CSS file in index.html like so:
{% load staticfiles %}
<link rel="stylesheet" type="text/css" href= "{% static 'music/style.css' %}"/>
Here is the CSS:
body {
background-color: red;
}
Thanks in advance!
Add following code in setting.py file
STATIC_ROOT = os.path.join(BASE_DIR,"deploy_to_server")
STATIC_URL = '/static/'
STATICFILES_DIRS = (
os.path.join(BASE_DIR, "static"),
)
And use in your template
<link rel="stylesheet" type="text/css" href= "{% static 'music/style.css' %}"/>
Create static folder in your project
==> static ==> music ==> style.css
==> manage.py
Hope this helps you