{"id":2427,"date":"2026-10-09T12:50:01","date_gmt":"2026-10-09T12:50:01","guid":{"rendered":"https:\/\/entri.app\/explore\/?post_type=curriculum&p=2427"},"modified":"2026-10-09T12:51:07","modified_gmt":"2026-10-09T12:51:07","slug":"python-django-static-files","status":"publish","type":"curriculum","link":"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/","title":{"rendered":"Python Django Static Files"},"content":{"rendered":"

What Are Static Files in Django? How to Add, Load and Collect Them<\/b><\/strong><\/h1>\n

Static files in Django are the CSS, JavaScript, images and fonts that are the same for every visitor. Django manages them with the built-in django.contrib.staticfiles\u00a0app. You store them in static\/\u00a0folders, reference them in templates with {% static %}, and run collectstatic\u00a0to gather them into one folder for production.<\/p>\n

Static files are different from media files<\/b><\/strong>. Media files are uploaded by users at runtime, such as profile photos or documents. Mixing the two up is the most common reason images and stylesheets fail to load.<\/p>\n

Static Files vs Media Files in Django<\/b><\/strong><\/h2>\n\n\n\n\n\n\n\n\n
<\/td>\nStatic files<\/b><\/strong><\/td>\nMedia files<\/b><\/strong><\/td>\n<\/tr>\n
Who creates them<\/td>\nDevelopers, as part of the code<\/td>\nUsers, by uploading at runtime<\/td>\n<\/tr>\n
Examples<\/td>\nstyle.css, app.js, logo.png, fonts<\/td>\nProfile photos, resumes, product images<\/td>\n<\/tr>\n
Settings<\/td>\nSTATIC_URL, STATICFILES_DIRS, STATIC_ROOT<\/td>\nMEDIA_URL, MEDIA_ROOT<\/td>\n<\/tr>\n
In templates<\/td>\n{% static ‘css\/style.css’ %}<\/td>\n{{ user.photo.url }}<\/td>\n<\/tr>\n
In Git?<\/td>\nYes (source folders)<\/td>\nNo<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

 <\/p>\n

How to Manage Static Files in Django: The Settings That Matter<\/b><\/strong><\/h2>\n\n\n\n\n\n\n\n
Setting<\/b><\/strong><\/td>\nPurpose<\/b><\/strong><\/td>\nExample<\/b><\/strong><\/td>\n<\/tr>\n
STATIC_URL<\/td>\nURL prefix for static files in the browser<\/td>\n“static\/”<\/td>\n<\/tr>\n
STATICFILES_DIRS<\/td>\nExtra source folders outside apps (for shared, project-wide assets)<\/td>\n[BASE_DIR \/ “static”]<\/td>\n<\/tr>\n
STATIC_ROOT<\/td>\nSingle folder where collectstatic copies everything for production<\/td>\nBASE_DIR \/ “staticfiles”<\/td>\n<\/tr>\n
STORAGES[“staticfiles”]<\/td>\nStorage backend, e.g. for hashed filenames or cloud storage<\/td>\nManifestStaticFilesStorage or WhiteNoise<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n

 <\/p>\n

Django also looks inside every installed app’s static\/\u00a0folder automatically. Namespace app files the same way as templates, as blog\/static\/blog\/css\/style.css, so two apps’ style.css\u00a0files don’t collide.<\/p>\n

Version note: since Django 4.2, the storage backend is configured with the <\/i><\/em>STORAGES<\/i><\/em>\u00a0setting. The older <\/i><\/em>STATICFILES_STORAGE<\/i><\/em>\u00a0setting was removed in Django 5.1, so older tutorials that use it will break on current versions.<\/i><\/em><\/p>\n

How to Load and Link Static Files in a Django Template<\/b><\/strong><\/h2>\n

Load the static tag library once at the top of each template that uses it, then link each file with {% static %}. Never hard-code \/static\/\u2026\u00a0paths; the tag builds the correct URL and picks up hashed filenames in production.<\/p>\n

{% load static %}<\/p>\n

<link rel=”stylesheet” href=”{% static ‘blog\/css\/style.css’ %}”><\/p>\n

<script src=”{% static ‘blog\/js\/app.js’ %}” defer><\/script><\/p>\n

<img src=”{% static ‘blog\/img\/logo.png’ %}” alt=”Blog logo”><\/p>\n

 <\/p>\n

How to Collect Static Files in Django for Production<\/b><\/strong><\/h2>\n

With DEBUG = True, runserver\u00a0serves static files straight from the app folders and STATICFILES_DIRS. With DEBUG = False, Django stops serving them, so before deploying you:<\/p>\n

    \n
  1. Set STATIC_ROOT, for example BASE_DIR \/ “staticfiles”.<\/li>\n
  2. Run python manage.py collectstatic. It copies every static file from apps and STATICFILES_DIRSinto STATIC_ROOT.<\/li>\n
  3. Serve STATIC_ROOTwith your web server (Nginx location \/static\/), a CDN or cloud storage, or with the WhiteNoise package directly from your Django\/Gunicorn process.<\/li>\n<\/ol>\n

    # settings.py (production with WhiteNoise)<\/p>\n

    STATIC_URL = “static\/”<\/p>\n

    STATIC_ROOT = BASE_DIR \/ “staticfiles”<\/p>\n

    MIDDLEWARE.insert(1, “whitenoise.middleware.WhiteNoiseMiddleware”)<\/p>\n

    STORAGES = {<\/p>\n

    “default”: {“BACKEND”: “django.core.files.storage.FileSystemStorage”},<\/p>\n

    “staticfiles”: {“BACKEND”: “whitenoise.storage.CompressedManifestStaticFilesStorage”},<\/p>\n

    }<\/p>\n

     <\/p>\n

    How to Add Static Files (CSS, JavaScript and Images) to a Django Project<\/b><\/strong><\/h2>\n

    You will create app-level and project-level static folders, link CSS, JavaScript and an image in a template, and prepare everything for production with collectstatic. It takes 7 steps and about 15 minutes.<\/p>\n

    Prerequisites<\/b><\/strong><\/h2>\n
      \n
    • A Django project with a blogapp and a template rendered by a view.<\/li>\n
    • contrib.staticfilesin INSTALLED_APPS\u00a0(included by default).<\/li>\n
    • DEBUG = Truewhile developing.<\/li>\n<\/ul>\n

      Steps<\/b><\/strong><\/h2>\n

      Step 1: Create a namespaced app static folder<\/b><\/strong><\/h3>\n

      Inside the app, create static\/blog\/\u00a0with css, js\u00a0and img\u00a0subfolders.<\/p>\n

      blog\/<\/p>\n

      \u2514\u2500\u2500 static\/<\/p>\n

      \u2514\u2500\u2500 blog\/<\/p>\n

      \u251c\u2500\u2500 css\/style.css<\/p>\n

      \u251c\u2500\u2500 js\/app.js<\/p>\n

      \u2514\u2500\u2500 img\/logo.png<\/p>\n

       <\/p>\n

      Step 2: Add some CSS and JavaScript<\/b><\/strong><\/h3>\n

      Put a visible rule in style.css\u00a0and a console message in app.js\u00a0so you can confirm both load.<\/p>\n

      \/* style.css *\/<\/p>\n

      body { background: #F5F8FF; }<\/p>\n

       <\/p>\n

      \/\/ app.js<\/p>\n

      console.log(“Static JS loaded”);<\/p>\n

       <\/p>\n

      Step 3: Add a project-level static folder (optional)<\/b><\/strong><\/h3>\n

      For assets shared across apps, create static\/\u00a0at the project root and register it.<\/p>\n

      # settings.py<\/p>\n

      STATIC_URL = “static\/”<\/p>\n

      STATICFILES_DIRS = [BASE_DIR \/ “static”]<\/p>\n

       <\/p>\n

      Step 4: Load and link the files in your template<\/b><\/strong><\/h3>\n

      At the top of the template, load the tag library, then link each file.<\/p>\n

      {% load static %}<\/p>\n

      <link rel=”stylesheet” href=”{% static ‘blog\/css\/style.css’ %}”><\/p>\n

      <script src=”{% static ‘blog\/js\/app.js’ %}” defer><\/script><\/p>\n

      <img src=”{% static ‘blog\/img\/logo.png’ %}” alt=”Logo” height=”40″><\/p>\n

       <\/p>\n

      Step 5: Check in the browser<\/b><\/strong><\/h3>\n

      Run python manage.py runserver, reload the page and open devtools. The Network tab should show 200 responses for all three files, and the console should print the message.<\/p>\n

      \"python_static_files\"<\/p>\n

      Step 6: Set STATIC_ROOT for deployment<\/b><\/strong><\/h3>\n

      Add an output folder that is separate from your source folders, and add it to .gitignore.<\/p>\n

      STATIC_ROOT = BASE_DIR \/ “staticfiles”<\/p>\n

       <\/p>\n

      Step 7: Run collectstatic<\/b><\/strong><\/h3>\n

      Copy all static files into STATIC_ROOT, ready to be served by Nginx, a CDN or WhiteNoise.<\/p>\n

      python manage.py collectstatic –noinput<\/p>\n

      \"django_static_run_collecstatic\"<\/p>\n","protected":false},"excerpt":{"rendered":"

      What Are Static Files in Django? How to Add, Load and Collect Them Static files in Django are the CSS, JavaScript, images and fonts that are the same for every visitor. Django manages them with the built-in django.contrib.staticfiles\u00a0app. You store them in static\/\u00a0folders, reference them in templates with {% static %}, and run collectstatic\u00a0to gather […]<\/p>\n","protected":false},"author":2,"featured_media":0,"template":"","meta":{"_acf_changed":false},"curriculum-category":[158,149],"custom_linking_tags":[161],"class_list":["post-2427","curriculum","type-curriculum","status-publish","hentry","curriculum-category-django","curriculum-category-python-tutorials","custom_linking_tags-django-mcqs"],"acf":[],"yoast_head":"\nPython Django Static Files - Entri Free Materials<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Python Django Static Files - Entri Free Materials\" \/>\n<meta property=\"og:description\" content=\"What Are Static Files in Django? How to Add, Load and Collect Them Static files in Django are the CSS, JavaScript, images and fonts that are the same for every visitor. Django manages them with the built-in django.contrib.staticfiles\u00a0app. You store them in static\/\u00a0folders, reference them in templates with {% static %}, and run collectstatic\u00a0to gather […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/\" \/>\n<meta property=\"og:site_name\" content=\"Entri Free Materials\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-09T12:51:07+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/wp-cdn.entri.app\/explore\/2026\/10\/python_static_files.webp\" \/>\n\t<meta property=\"og:image:width\" content=\"2080\" \/>\n\t<meta property=\"og:image:height\" content=\"1118\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/webp\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/\",\"url\":\"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/\",\"name\":\"Python Django Static Files - Entri Free Materials\",\"isPartOf\":{\"@id\":\"https:\/\/entri.app\/explore\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/wp-cdn.entri.app\/explore\/2026\/10\/python_static_files-300x161.webp\",\"datePublished\":\"2026-10-09T12:50:01+00:00\",\"dateModified\":\"2026-10-09T12:51:07+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/#primaryimage\",\"url\":\"https:\/\/wp-cdn.entri.app\/explore\/2026\/10\/python_static_files-300x161.webp\",\"contentUrl\":\"https:\/\/wp-cdn.entri.app\/explore\/2026\/10\/python_static_files-300x161.webp\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/entri.app\/explore\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Python Django Static Files\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/entri.app\/explore\/#website\",\"url\":\"https:\/\/entri.app\/explore\/\",\"name\":\"Entri Free Materials\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/entri.app\/explore\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/entri.app\/explore\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/entri.app\/explore\/#organization\",\"name\":\"Entri Free Materials\",\"url\":\"https:\/\/entri.app\/explore\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/entri.app\/explore\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/wp-cdn.entri.app\/explore\/2025\/03\/logo.svg\",\"contentUrl\":\"https:\/\/wp-cdn.entri.app\/explore\/2025\/03\/logo.svg\",\"caption\":\"Entri Free Materials\"},\"image\":{\"@id\":\"https:\/\/entri.app\/explore\/#\/schema\/logo\/image\/\"}}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Python Django Static Files - Entri Free Materials","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/","og_locale":"en_US","og_type":"article","og_title":"Python Django Static Files - Entri Free Materials","og_description":"What Are Static Files in Django? How to Add, Load and Collect Them Static files in Django are the CSS, JavaScript, images and fonts that are the same for every visitor. Django manages them with the built-in django.contrib.staticfiles\u00a0app. You store them in static\/\u00a0folders, reference them in templates with {% static %}, and run collectstatic\u00a0to gather […]","og_url":"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/","og_site_name":"Entri Free Materials","article_modified_time":"2026-10-09T12:51:07+00:00","og_image":[{"width":2080,"height":1118,"url":"https:\/\/wp-cdn.entri.app\/explore\/2026\/10\/python_static_files.webp","type":"image\/webp"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/","url":"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/","name":"Python Django Static Files - Entri Free Materials","isPartOf":{"@id":"https:\/\/entri.app\/explore\/#website"},"primaryImageOfPage":{"@id":"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/#primaryimage"},"image":{"@id":"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/#primaryimage"},"thumbnailUrl":"https:\/\/wp-cdn.entri.app\/explore\/2026\/10\/python_static_files-300x161.webp","datePublished":"2026-10-09T12:50:01+00:00","dateModified":"2026-10-09T12:51:07+00:00","breadcrumb":{"@id":"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/#primaryimage","url":"https:\/\/wp-cdn.entri.app\/explore\/2026\/10\/python_static_files-300x161.webp","contentUrl":"https:\/\/wp-cdn.entri.app\/explore\/2026\/10\/python_static_files-300x161.webp"},{"@type":"BreadcrumbList","@id":"https:\/\/entri.app\/explore\/python-programming\/python-django-static-files\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/entri.app\/explore\/"},{"@type":"ListItem","position":2,"name":"Python Django Static Files"}]},{"@type":"WebSite","@id":"https:\/\/entri.app\/explore\/#website","url":"https:\/\/entri.app\/explore\/","name":"Entri Free Materials","description":"","publisher":{"@id":"https:\/\/entri.app\/explore\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/entri.app\/explore\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/entri.app\/explore\/#organization","name":"Entri Free Materials","url":"https:\/\/entri.app\/explore\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/entri.app\/explore\/#\/schema\/logo\/image\/","url":"https:\/\/wp-cdn.entri.app\/explore\/2025\/03\/logo.svg","contentUrl":"https:\/\/wp-cdn.entri.app\/explore\/2025\/03\/logo.svg","caption":"Entri Free Materials"},"image":{"@id":"https:\/\/entri.app\/explore\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/entri.app\/explore\/wp-json\/wp\/v2\/curriculum\/2427","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/entri.app\/explore\/wp-json\/wp\/v2\/curriculum"}],"about":[{"href":"https:\/\/entri.app\/explore\/wp-json\/wp\/v2\/types\/curriculum"}],"author":[{"embeddable":true,"href":"https:\/\/entri.app\/explore\/wp-json\/wp\/v2\/users\/2"}],"wp:attachment":[{"href":"https:\/\/entri.app\/explore\/wp-json\/wp\/v2\/media?parent=2427"}],"wp:term":[{"taxonomy":"curriculum-category","embeddable":true,"href":"https:\/\/entri.app\/explore\/wp-json\/wp\/v2\/curriculum-category?post=2427"},{"taxonomy":"custom_linking_tags","embeddable":true,"href":"https:\/\/entri.app\/explore\/wp-json\/wp\/v2\/custom_linking_tags?post=2427"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}