I can load my HTML templates but can't load css. When I view the source code in my browser and access the css file from there it shows the error "Page not found (404)" 'css\index.css' could not be found
I have tried all the things from doc but I don't know what I'm missing. Does anyone know what changes I need to make so that the css loads properly?
Here are relevant files:
settings.py
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
TEMPLATES_DIR = os.path.join(BASE_DIR, "templates")
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'parking',
'DIRS': [TEMPLATES_DIR, ],
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "static"),
]
app urls.py
from django.urls import path
from . import views
urlpatterns = [
path('', views.index)
]
urls.py
from django.contrib import admin
from django.urls import path, include
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns = [
path('admin/', admin.site.urls),
path('', include('parking.urls'))
]
urlpatterns +=staticfiles_urlpatterns()
this is my HTML file
<!DOCTYPE html>
{% load staticfiles %}
<html class="nojs html css_verticalspacer" lang="en-US">
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8"/>
<!-- CSS -->
<link rel="stylesheet" type="text/css" href="{% static 'css/site_global.css' %}"/>
<link rel="stylesheet" type="text/css" href="{% static 'css/master_a-master.css' %}"/>
<link rel="stylesheet" type="text/css" href="{% static 'css/index.css' %}" id="pagesheet"/>
<!-- IE-only CSS -->
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" href="{% static 'css/nomq_preview_master_a-master.css' %}"/>
<link rel="stylesheet" type="text/css" href="{% static 'css/nomq_index.css' %}" id="nomq_pagesheet"/>
<![endif]-->
<!-- Other scripts -->
<script type="text/javascript">
var __adobewebfontsappname__ = "muse";
</script>
Related
<meta charset="utf-8">
<title>Exam Page</title>
<link rel="stylesheet" href="../../../static/css/teststyle.css">
</head>
Im using this code in exam folder and i wanted to go to parent directory so i used ../../ but it is showing the below error
Not Found: /exam/static/css/teststyle.css
At the top of your template add {% load static %} and to add your css you can use {% static 'css/teststyle.css' %}.
{% load static %}
<meta charset="utf-8">
<title>Exam Page</title>
<link rel="stylesheet" href="{% static 'css/teststyle.css' %}">
</head>
In your main urls.py add
from django.conf import settings
from django.conf.urls.static import static
urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
and in your settings.py add
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
I created a simple project in Django but static files(CSS) not working.
settings.py
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "static"),
]
urls.py
urlpatterns = [
path('admin/', admin.site.urls),
path('',views.portfolio),
]+ static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
HTML file
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="{% static 'portfolio.css' %}">
</head>
<body>
<h1>hello world</h1>
</body>
</html>
picture of the project directory
blog is app and my_site is a project.
try adding
os.path.join(BASE_DIR, "my_site/static")
to STATICFILES_DIRS
STATICFILES_DIRS = [
os.path.join(BASE_DIR, "static"),
os.path.join(BASE_DIR, "my_site/static")
]
OR
place the static folder in the root my_site folder
I am learning Django and while I was trying to load static CSS files, it did not show any output. When I run server I only get HTML as my output.
Here is my code
settings.py code
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/3.0/howto/static-files/
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'static'),
'bloodnepal/bloodnepal/static',
]
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')
HTML
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
{% load static %}
<meta charset="utf-8">
<title>Bloodnepal</title>
<link rel="stylesheet" href="{% static 'css_files/style.css' %}">
<link rel="stylesheet" href='{% static "css_files/link.css" %}'>
<link href='https://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Fira Sans Extra Condensed' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Nanum Myeongjo' rel='stylesheet' type='text/css'>
</head>
</html>
url.py
from django.contrib import admin
from django.urls import path
from . import views #imported the views.py files here for our pipeline
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns = [
path('admin/', admin.site.urls),
path('home/',views.home,name="Homepage"),
path('donate/',views.donate,name="Donatepage"),
path('organization/',views.organization,name="Organizationpage"),
path('getinvolved/',views.getinvolved,name="Getinvolvedpage"),
path('about/',views.about,name="AboutUspage"),
]
urlpatterns += staticfiles_urlpatterns()
If you store your CSS inside your project folder under "static" directory then the following code for settings.py should work:
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
PROJECT_PATH = os.path.realpath(os.path.dirname(__file__))
....
STATIC_URL = '/static/'
STATICFILES_FINDERS = [
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder'
]
Try as I might, and after trying to read through and follow these (and others):
How do I serve CSS to Django in development?
Django not loading CSS?
I still can't get any staticfiles served by django. at this point, I have a project called limbo, with a yet-to-be-dev'd app called limbo (that was a bad idea, I no realize...name confusion), and a separate app called polls, where I followed well-known django tutorial to build out the app, then added a little session variable passing to pass the name to a stupid output on the target of the form. It's all served on EC2 linux AMI, with django v1.10, I'm viewing it with chrome v53.
some code excertps are below, but the repos are public (one for the bulk of the django, the other for the html templates)
~/limbo/limbo/settings.py:
ROOT_URLCONF = 'limbo.urls'
TEMPLATES = [
{
'BACKEND': 'django.template.backends.django.DjangoTemplates',
'DIRS': [
'/var/www/html/',
'/var/www/html/polls/',
],
'APP_DIRS': True,
'OPTIONS': {
'context_processors': [
'django.template.context_processors.debug',
'django.template.context_processors.request',
'django.contrib.auth.context_processors.auth',
'django.contrib.messages.context_processors.messages',
],
},
},
]
...
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/1.10/howto/static-files/
#STATIC_URL = '/static/'
#STATIC_ROOT = os.path.join(BASE_DIR, "/var/www/html/static/")
STATIC_ROOT = ''
STATIC_URL = '/static/'
STATICFILES_DIRS = [
# "/home/ec2-user/limbo/limbo/static/",
]
STATICFILES_FINDERS = [
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
]
~/limbo/limbo/urls.py:
from django.conf.urls import include, url
from django.contrib import admin
urlpatterns = [
url(r'^polls/', include('polls.urls')),
url(r'^admin/', admin.site.urls),
]
entire ~/limbo/polls/urls.py
from django.conf.urls import url
from . import views
urlpatterns = [
url(r'^index.html$', views.index, name='index'),
url(r'^formTest$', views.testForm, name='testForm'),
url(r'^name-test.html$', views.get_name, name='getName'),
url(r'^testFormResults/',
# <string>[\w\-]+)/$',
views.testFormResults,
name='showFormResults'),
]
excerpt from /var/www/html/polls/name.html (which shows fine, but without any css nor img), it does show both when viewing local on my win8.1 surface, but not remotely from the server (note I now have {% load static %} instead and it didn't change anything that I can see):
<!DOCTYPE html>
<html>
{% load staticfiles %}
<head>
<!--this group for local use w/o django-->
<link rel="stylesheet" type="text/css" href="../static/polls/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="../static/polls/css/bootstrap-theme.min.css">
<link rel="stylesheet" type="text/css" href="../static/polls/css/limbo.css">
<!--this group for use w/ django-->
<link rel="stylesheet" type="text/css" href="{% static 'polls/css/bootstrap.min.css' %}" />
<link rel="stylesheet" type="text/css" href="{% static 'polls/css/bootstrap-theme.min.css' %}" />
<link rel="stylesheet" type="text/css" href="{% static 'polls/css/limbo.css' %}" />
</head>
<div class="navbar navbar-default navbar-fixed-top">
<div class=container>
<img class="top-bar" src="static/polls/limbo-clipart-1.jpg" alt="limbo graphic"/>
<img src="{% static 'polls/static/limbo-clipart-1.jpg' %}" alt="limbo graphic"/>
<h1>This is a heading</h1>
</div>
</div>
Try as I might, I just can't get past this. I'm excited about getting django up and running as I think it'll be a fantastic way to build the api I need and the little bit of browser-based UI the project needs, but I need a little css to make the browser-UI.
please help sort out.
my problem is that it is impossible to add django1.6 css-file in html-template. my project directory structure is as follows:
proj1(catalog)
manage.py(file)
proj1(catalog)
wsgi.py(file)
urls.py(file)
settings.py(file)
__init__.py(file)
views(catalog)
templates(catalog)
index.html(file)
static(catalog)
css(catalog)
styles.css(file)
urls.py:
from django.conf.urls import patterns, include, url
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
import proj1.views.views
urlpatterns = patterns('',
url('^$', proj1.views.views.hello),
url('^datetime$', proj1.views.views.current_datetime),
url('^dt$', proj1.views.views.current_datetime),
url('^dt/(\d{0,2})$', proj1.views.views.current_datetime2),
url('^dynamic$', proj1.views.views.dynamic),
)
urlpatterns += staticfiles_urlpatterns()
in settings.py prescribed the following (excerpt):
BASE_DIR = os.path.dirname(os.path.dirname(__file__))
TEMPLATE_DIRS = (
os.path.join(BASE_DIR, 'proj1/templates/'),
)
STATIC_URL = '/static/'
STATICFILES_DIRS = (os.path.join(BASE_DIR, "static"),)
index.html following content:
<!DOCTYPE html>
{% load static %}
<html>
<head>
<meta charset="utf-8" />
<title>qwerty</title>
<link rel="stylesheet" href="{% static 'css/style.css' %}" />
</head>
<body>
<div class="wrap">
<span class='text'>hello,</span> <span class='name'>{{name}}</span>
</div>
</body>
</html>
as a result of all this themselves for certain pages appear url (html true), but does not connect css-
ps
windows7
Change your BASE_DIR as the following
os.path.dirname(os.path.dirname(os.path.realpath(__file__)))
then use href as
href="/static/css/style.css"