Linking my CSS file to my Django Project - css

I am trying to link my css files to my Django Project. Not sure where the error is.
This is how my settings file look like:
STATICFILES_FINDERS = (
'/Users/IMAC/work3/Blog/Blog/polls/static',
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
# 'django.contrib.staticfiles.finders.DefaultStorageFinder',
)
STATIC_ROOT = ''
STATIC_URL = '/Users/IMAC/work3/Blog/Blog/polls/static'
This is how my html file looks like:
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="{{ STATIC_URL }}gameserver.css">
This is how my css file looks like:
#tuna{color:red;}
body {background-color:blue;}
Must i change anything else? Why might be my error? Not sure where I am making my mistake...
Where should my static folder be? inside the app or inside the same folder as the app?

Remove '/Users/IMAC/work3/Blog/Blog/polls/static' from STATICFILES_FINDERS = (
And your STATIC_ROOT should be
STATIC_ROOT = '/Users/IMAC/work3/Blog/Blog/polls/static/'
and
STATIC_URL = '/static/'

You've misunderstood what the various settings do:
STATIC_FILES_FINDERS is a list of Python classes which Django uses to search for static files, it is not a list of places where static files are stored.
STATIC_ROOT is the directory where the static files are stored.
STATIC_URL is the URL that should point to the static files.
In your case you want something like this:
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
# 'django.contrib.staticfiles.finders.DefaultStorageFinder',
)
STATIC_ROOT = '/Users/IMAC/work3/Blog/Blog/polls/static'
STATIC_URL = '/static/'

My mistake is i forgot context_instance=RequestContext(request).
If {{ STATIC_URL }} isn't working in your template, you're probably not using RequestContext when rendering the template

Related

How to write django code inside css style tag to link images from static directory

I want to write Django code into CSS style tag in HTML elements in order to get images from static directory. here is my original code
i tried with the below code
but this isn't worked for me, how can i solve this problem?
NB: i used {% load static %} to load all static files, css and js works fine but i became failed to do this.
First Add These Code In Your settings.py
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'myproject/static')
]
# Media settings
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'
Then Add These Code In Your project urls.py
urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
Then add this line to your html
style="background-image: url({%static 'images/person_1.jpg' %});"
You can check if in your root project/settings.py has something like this:
STATIC_ROOT = ''
STATIC_URL = '/static/'
STATICFILES_DIRS = (os.path.join(BASE_DIR, 'static'),)
and then, in your root project/urls.py:
from django.conf import settings
from django.conf.urls.static import static
urlpatterns = [...] + static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
To be sure, make sure you restart your server after these changes.
In settings.py add this
STATIC_URL = 'static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'static')
]
try to convert style tags in this manner
style ="background-image:url(images/image_1.jpg)"
TO
style ="background-image:url('/static/images/image_1.jpg')"

How can see where my site is looking for css and media

I have implemented wagtail on my site and when I put it into production it is not finding the css or any images. I have run
python manage.py collectstatic
and all of my css is in a directory called static_files in the same directory as manage.py.
In base.py I have:
PROJECT_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
BASE_DIR = os.path.dirname(PROJECT_DIR)
....
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static_files')
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, "static_media")
On my development site BASE_DIR is the directory with static_files, but it does not seem to pick it up on the production site.
Is there any way that I can test to see where the production version is looking for the css, e.g in the HTML?
[Edit]
I have looked at the answers to this question and it does not address the core of my problem which is that certain essential code was not being called when DEBUG is set to False
You need to include the following code in urls.py in your project directory:
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
from django.conf.urls.static import static
...
urlpatterns += staticfiles_urlpatterns()
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
For some reason this was in an if section under:
if setting.DEBUG = True
and I had DEBUG set to False. If I move it to the main body of the module, it works perfectly
In the references to the static assets in templates, be sure to use the {% static ... %} template tag (reference). In the references to media files in templates, be sure to prefix with {% get_media_prefix %} (reference). Also, I typically use the same final designator for both STATIC_URL and STATIC_ROOT (i.e. /static/, not /static/ for one and static_files for the other). Here is how I declare these variables:
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, STATIC_URL.replace('/', ''))
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, MEDIA_URL.replace('/', ''))

STATIC_ROOT doesn't find my static files

I'm newbie in Django and I'm trying to find a way to load my css files in my project. Here is my settings.py file
STATICFILES_STORAGE = 'whitenoise.django.GzipManifestStaticFilesStorage'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
STATIC_URL = '/static/'
STATICFILES_FINDERS = (
"django.contrib.staticfiles.finders.FileSystemFinder",
#"django.contrib.staticfiles.finders.AppDirectoriesFinder"
)
AUTHENTICATION_BACKENDS = (
# Uncomment the following to make Django tests pass:
'django.contrib.auth.backends.ModelBackend',
'allauth.account.auth_backends.AuthenticationBackend',
)
I got a way to do it using the variable STATICFILES_DIRS, but it won't work together with the others similars variables.
What should I do to fix it?
EXTRA INFORMATIONS:
My base.html file static files call:
<link rel="stylesheet" type="text/css" href="{% static 'style.css' %}" />
<link rel="stylesheet" type="text/css" href="{% static 'icomoon_style.css' %}" />
<link rel="stylesheet" type="text/css" href="{% static 'css/bootstrap.min.css' %}" />
My folders disposal:
OntoLogica (main folder)
Ontologica (project folder)
static folder
icomoon_style.css
style.css
css folder
bootstrap.min.css
I found a way that solved my case. It was found in this site: https://devcenter.heroku.com/articles/django-assets
What I've to do:
Add the line PROJECT_ROOT and the change the line STATIC_ROOT to:
PROJECT_ROOT = os.path.dirname(os.path.abspath(__file__))
STATIC_ROOT = os.path.join(PROJECT_ROOT, 'staticfiles')
With this I could add the line STATICFILES_DIRS without any trouble:
STATICFILES_DIRS = (
os.path.join(PROJECT_ROOT, 'static'),
)
It worked perfectly for me and I hope it helps someone else too. Thanks
set static path in a correct way. Get an idea from my project.
settings.py
import os
import sys
from os.path import abspath, dirname, join
sys.path.append(join(dirname(__file__), "../applications"))
PROJECT_ROOT = abspath(dirname(__file__))
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
MEDIA_ROOT = join(PROJECT_ROOT, '../media/')
MEDIA_URL = '/media/'
STATIC_ROOT = join(PROJECT_ROOT, '../static/')
STATIC_URL = '/static/'
My structure of files:
Main directory
project dir
settings.py
urls.py
media
static folder.
As it says in the "Warning" section of the docs
This [STATIC_ROOT] should be an initially empty destination directory for collecting your static files from their permanent locations into one directory for ease of deployment; it is not a place to store your static files permanently.
So you should use STATICFILES_DIRS to point to your static files.
And lastly make sure that you use {% load staticfiles %} in your templates to load your static files.

Use CSS in Django

I have a Django project structure like this
Project
app
media
static
style.css
templates
base.html
and in settings
PROJECT_ROOT = os.path.join(os.path.dirname(__file__), '..')
SITE_ROOT = PROJECT_ROOT
STATIC_ROOT = os.path.join(SITE_ROOT, 'static')
STATIC_URL = '/static/'
STATICFILES_DIRS = (
os.path.join(SITE_ROOT,'static')
)
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
)
and in base.html reference to the css file :
<link href="{{STATIC_URL}}/style.css" rel="stylesheet" type="text/css" />
and it gives an error :
"The STATICFILES_DIRS setting should "
ImproperlyConfigured: The STATICFILES_DIRS setting should not contain the STATIC_ROOT setting
the browser shows html files in no-css style , what can be the problem?
This line should be the culprit:
<link href="{{STATIC_URL}}/style.css" rel="stylesheet" type="text/css" />
Remove the trailing slash after {{STATIC_URL}}
You should say
<link href="{{STATIC_URL}}style.css" rel="stylesheet" type="text/css" />
Can you make sure STATICFILES_DIRS refer to your static directory.
from django.conf import settings
print settings.STATICFILES_DIRS

css in django templates

I have a problem using css in my django template,
In my settings.py i have this :
BASE_DIR = os.path.abspath(os.path.dirname(__file__) + '/')
STATIC_URL = BASE_DIR + '/static/'
In my paths I have the folder "static/css/home_css.css"
In my template home.html I have the link tag :
<link rel="stylesheet" type="text/css" href="{{ STATIC_URL }}css/home_css.css" media="all" />
but it doens't work in order to render de css.
If anybody knows what happens please
STATIC_URL shouldn't point to the path in the filesystem. STATIC_ROOT should.
import os
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
STATIC_URL = "/static/"
In your settings.py add 'django.core.context_processors.static', at TEMPLATE_CONTEXT_PROCESSORS like in this example:
TEMPLATE_CONTEXT_PROCESSORS = (
'django.contrib.auth.context_processors.auth',
'django.core.context_processors.debug',
'django.core.context_processors.i18n',
'django.core.context_processors.media',
'django.core.context_processors.static',
'django.core.context_processors.request',
'django.contrib.messages.context_processors.messages',
)
EDIT
And if you're working with the local dev-server you'll need something like this in your urls.py:
(r'static/(?P<path>.*)$', 'django.views.static.serve', {'document_root': '%s' % os.path.join(os.path.dirname(os.path.abspath(__file__)), 'static')}),
I solved it!
I put my directory static into aplication root path, and set
STATIC_URL = '/static/'
thanks

Resources