Forums

css not loading

Hello, my css is not loading, it is located in a "static" folder inside my app folder, and in the TEMPLATE_DIRS I put "templates" in which I have the html pages calling that css, in my pc version of the project it worked but on python anywhere I don't know why it is not working anymore. thank yo

Which folder contains the HTML file(s)? Which folder contains the CSS file(s)? What is the HTML line where you refer to the CSS file? i.e. the line with something like "<link rel="stylesheet" href=".

On your own PC static files will be served by the django dev server. In a production setting like PythonAnywhere, you need to

  • set the STATIC_ROOT in your settings.py, to, eg, /home/yourusername/myproject/static
  • run manage.py collectstatic which will collect static files from your app folders and put them in there
  • set up a static files mapping on the web tab, from /static/ to /home/yourusername/myproject/static

Bonus points for setting up STATIC_URL and using the Django {% static %} template tag, but that's optional.

More info in the Django docs

thank you :D

hi how do I undo collect static?

thanks!

I dont think there is a way. (If you want to take stuff out of static, you could just manually delete it)

Thanks.

I had added a new css file and it did not load. I followed the steps mentioned above. Set Static Root, run collect static etc. When I did that, none of the css was loaded.

It was my mistake. I had changed STATIC_URL. Now put it back to /static/. The old css files loaded and website displayed. But the new one I added today isn't still rendering. Any idea?

Have you tried reloading the webapp?

Yes, I have pressed the reload button at least a dozen times.

Lets walk through two items of your error log to help you debug:

2015-02-11 10:40:05 Not Found: /static/css/font.css
2015-02-11 10:40:05 Not Found: /static/js/jquery-2.0.3.min.js
  1. Let's look at the second one first. In your static files settings for your webapp, you have set the url /static/ to serve files/folders from /home/amritha/costtool/costool/static/.

    However, there is no jquery-2.0.3 file in your folder /home/amritha/costtool/costool/static/js/, so that's why there is an error when you send out a web request for the url /static/js/jquery-2.0.3.min.js.

  2. Now lets take a look at the first problem. My advice here is basically delete all the other two static file settings, namely:

    /css/ --> /home/amritha/costtool/costtool/static/css/
    /static/ --> /home/amritha/.virtualenvs/costtool/lib/python2.7/site-packages/django/contrib/admin/static

    The first setting implies that you want to get served font.css when you send a web request to the url /css/font.css, and not the url /static/css/font.css. It makes more sense to do that latter, and this is already included when you set /static/ in the first part, so your /css/ setting is extraneous.

    There is a similar problem with your admin stuff- it should be, if anything, /static/admin/, but again, you don't actually need it after you have run collectstatic once.

So you may have noticed that I implied just now that setting /static/ is smart enough to serve the subfoler /static/css/- so why hasn't it served it already in this case?

This is because you have two paths set to the /static/ url, and they are clashing.

An interesting hacky feature about PythonAnywhere is that the two paths would actually merge to both serve /static/- ie. a request to /static/file_1/ would try to get the file from path_1/file_1 or path_2/file_1. However, note that if both paths had file_1, the path higher up in your settings would dominate/overwrite. Here, your admin static url is higher up than your actual correct static url, and since it also has a css folder, that css folder is overriding your intended css folder.

I wrote a quick guide to "Django admin CSS not loading!" which points at our more general Guide to using static files with Django on PythonAnywhere

I deleted the two static file settings given below and ran collect static again.

/css/ --> /home/amritha/costtool/costtool/static/css/ /static/ --> /home/amritha/.virtualenvs/costtool/lib/python2.7/site-packages/django/contrib/admin/static

I still get the Not Found error for font.css. jquery-2.0.3.min.js is not there in js folder so that is a valid error but font.css exists.

2015-02-12 08:52:22,989 :Not Found: /static/css/font.css 2015-02-12 08:52:22,990 :Not Found: /static/js/jquery-2.0.3.min.js

Thanks!

/home/amritha/costtool/costool/static/

you misspelt costtool...

Oh no! Thank you. It is working now.

It is most likely cached, so to force re-loading on your browser hit CTRL+F5

u r my hero! thx!!

If someone read this - I still have this problem. The css is working on localhost, but not in the server.

STATIC_URL = '/static/'
STATIC_ROOT = '/home/QwantisheKU/qwantisheku.pythonanywhere.com/static'
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'static'),
]

Started collectstatic million times and no result. In pythonanywhere URL='/static/', DIRECTORY='/home/QwantisheKU/qwantisheku.pythonanywhere.com/static'. Does somebody know how to fix this?

[edit by admin: formatting]

Could you give an example of some CSS that is not working? When I go to your site, there's no CSS in use on the front page, and the Django admin's CSS is working OK. Perhaps you fixed the problem after posting this message?

Yeah, that's it, I have just changed the path to static_root, where all the collected were situated (I didn't notice it before and used static folder to access try.css)

OK, glad to hear you worked it out!

thanks, it worked

Help me please: My js files loads from static but css no

I do not see any reference to css on your page.

Hi - I seemed the same problem here. Two of my CSS styles are not working

STATIC_URL = '/static/'
STATIC_ROOT = '/home/jesseapss2018/PycharmProjects/Django/meeting_planner/static'

I did the python manage.py collectstatic to my /home/jesseapss2018/PycharmProjects/Django/meeting_planner directory

and even deleted the original static folder.

It works on my local machine but for some reason it does not work in pythonanywhere.

Please help :)

[formatted by admin]

Hi, did you check error logs for your web app? You'll find them in the "Log files" section on the Web page.

Hi -

This is the latest error log. It is the right path to get static files so I am really stuck.

Error running WSGI application
2021-01-21 09:24:13,590: NameError: name 'meeting_planner' is not defined
2021-01-21 09:24:13,590:   File "/var/www/jesseapss2018_pythonanywhere_com_wsgi.py", line 22, in <module>
2021-01-21 09:24:13,590:     application = get_wsgi_application()
2021-01-21 09:24:13,590: 
2021-01-21 09:24:13,590:   File "/home/jesseapss2018/.virtualenvs/myenv/lib/python3.8/site-packages/django/core/wsgi.py", line 12, in get_wsgi_application
2021-01-21 09:24:13,590:     django.setup(set_prefix=False)
2021-01-21 09:24:13,590: 
2021-01-21 09:24:13,590:   File "/home/jesseapss2018/.virtualenvs/myenv/lib/python3.8/site-packages/django/__init__.py", line 19, in setup
2021-01-21 09:24:13,591:     configure_logging(settings.LOGGING_CONFIG, settings.LOGGING)
2021-01-21 09:24:13,591: 
2021-01-21 09:24:13,591:   File "/home/jesseapss2018/.virtualenvs/myenv/lib/python3.8/site-packages/django/conf/__init__.py", line 82, in __getattr__
2021-01-21 09:24:13,591:     self._setup(name)
2021-01-21 09:24:13,591: 
2021-01-21 09:24:13,591:   File "/home/jesseapss2018/.virtualenvs/myenv/lib/python3.8/site-packages/django/conf/__init__.py", line 69, in _setup
2021-01-21 09:24:13,592:     self._wrapped = Settings(settings_module)
2021-01-21 09:24:13,592: 
2021-01-21 09:24:13,592:   File "/home/jesseapss2018/.virtualenvs/myenv/lib/python3.8/site-packages/django/conf/__init__.py", line 170, in __init__
2021-01-21 09:24:13,592:     mod = importlib.import_module(self.SETTINGS_MODULE)
2021-01-21 09:24:13,592: 
2021-01-21 09:24:13,593:   File "/home/jesseapss2018/PycharmProjects/Django/meeting_planner/meeting_planner/settings.py", line 124, in <module>
2021-01-21 09:24:13,593:     meeting_planner/ "static",

[edited by admin: formatting]

do you have some variable called meeting_planner somewhere?

Its my main app folder

It looks like the error that you pasted is not the most recent one as it does not match the code that you provided above. The most recent error is on the bottom of the error log. What do you see there?

Hi - this should be the latest error.

Not sure what happened, but it seems to be fixed now.

I wonder if there is a delayed latency with the server. I made the changes late at night and checked the next day in the afternoon - and it works as it should be... weird..

Maybe you have not reloaded your web app after making changes to the code, and it got reloaded when we were doing some maintenance.

That's probably it. Hope I dont get the same error again :)

If you do, just reload the site using the green button on the "Web" tab.

HI there. I have the same problem: my css files are not loading. I have set up STATIC_ROOT and STATIC_URL. So, my admin page loads. Inside of my static folder there are four folders: admin, images, css, js. It loads assets from images folder, but does not load anything from css folder :/. Although, when I go to mysite.com/static/css/main.css on my browser, I can see css. Anything you can advice?

2022-03-14 06:59:54,459: OSError: write error

After the error above, images started to load but not css

Check if the url is being constructed properly -- what kind of errors do you see in the error log?