Report this

What is the reason for this report?

Django Admin CSS Not Loading in App Platfrom

Posted on April 25, 2024

The rest of the site is working fine but the admin page isbroken since it can’t find the CSS. Works perfect in local but breaks after deploy

here is the static file config in settings.py

# Static files (CSS, JavaScript, Images)

#Application Level
STATIC_URL = 'static/'
STATIC_ROOT = os.path.join(BASE_DIR, "files")

#Global
STATICFILES_DIRS = [
    BASE_DIR / 'assets'
]

all my static files is in ‘assets’ folder in root.



This textbox defaults to using Markdown to format your answer.

You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!

These answers are provided by our Community. If you find them useful, show some love by clicking the heart. If you run into issues leave a comment, or add your own answer to help others.

Hey!

Did you run python manage.py collectstatic after you deployed your app?

One thing that you could try here would be to also set the STATICFILES_DIRS env in your settings file:

import os
from pathlib import Path

BASE_DIR = Path(__file__).resolve().parent.parent

# Static files
STATIC_URL = '/static/'  # Ensure this has a leading and trailing slash
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')

# Collect static files into a single directory
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'assets'),  # Ensure 'assets' folder exists
]

# Media files (if needed)
MEDIA_URL = '/media/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

If none of those help, what you could try is to set the DEBUG = True in your settings file to see if you would get some extra information. And also check your web console to see which folder are the files being loaded from exactly.

Let me know how it goes!

Best,

Bobby

Heya,

The issue explained, where the Django admin page breaks after deployment because it can’t find the CSS, typically occurs when static files are not properly collected or served in production.

1. Configuration Issues in settings.py

Your current settings.py configuration has some inconsistencies:

Correct Configuration for Static Files

  • The STATICFILES_DIRS should include your assets folder where your static files are stored.
  • The STATIC_ROOT directory should be used for collected static files via collectstatic.

Update your settings.py:

# Static files (CSS, JavaScript, Images)

# URL for serving static files
STATIC_URL = '/static/'

# Directory where Django collects static files during collectstatic
STATIC_ROOT = os.path.join(BASE_DIR, 'staticfiles')

# Additional directories to look for static files
STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'assets'),
]

2. Run collectstatic

In production (DEBUG=False), Django expects all static files to be collected in the STATIC_ROOT directory. Run the following command to collect static files:

python manage.py collectstatic

This command will copy all files from STATICFILES_DIRS and the static folders in your apps (like admin static files) into STATIC_ROOT.

The developer cloud

Scale up as you grow — whether you're running one virtual machine or ten thousand.

Get started for free

Sign up and get $200 in credit for your first 60 days with DigitalOcean.*

*This promotional offer applies to new accounts only.