How to load and use static files in Django? - GeeksforGeeks

16 Mar, 2021
Static Files such as Images, CSS or JS files are often loaded via a different app in production websites to avoid loading multiple stuff from the same server. This article revolves arouund, how you can setup static app in Django and server Static Files from the same.
 let’s create a new project first for that let’s create a virtual environment first. Download the package if you haven’t downloaded it
pip install virtualenv
virtualenv geeks
geeks\Scripts\Activate
This is how it will look
now install Django
pip install django
now we will create our django project with the name “checkstatic”
//django-admin startproject projectname (template code)
django-admin startproject  checkstatic
now enter your project
for windows “cd  checkstatic”
now we will create a new app name “showstatic” for the project
//python3 manage.py startapp appname (template code)
python3 manage.py startapp showstatic
now we will walk in the IDE, I am using Visual studio code if you are using same the type (code .) in cmd
the first thing we would do is in setting.py add your app in line 32 add like this (you will see this from the apps.py file of the app)
INSTALLED_APPS = [
'showstatic.apps.ShowstaticConfig',
'django.contrib.admin',
'django.contrib.auth,
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
]
now try to runserver once to confirm everything is working smoothly
python3 manage.py runserver
if you see this page the congrats you taken your first step successfully
Now we create a static folder inside the main folder (checkstatic) where we will keep our static files. One can add your files (pdf, images, text files, or anything you want)  in the static folder.
Folder structure – 
now you need to make Django know that you have created a static folder so now add this line in settings.py file,
in line 121 below STATIC_URL = ‘/static/’
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
Now tell django to look where for the static files you have added write this above STATIC_URL = ‘/static/’
STATICFILES_DIRS = [
   os.path.join(BASE_DIR, 'checkstatic/static/')
]
Now we will write a command that will bring/collect all the static files from our project and bring it to one single folder
python manage.py collectstatic
this is how it will look if everything was fine, most of the files are from admin we don’t need to worry about it,
in your project folder, you will see a new folder added named “static” and your file is inside it!!
Now to check just create the “templates” folder in showstatic and create a file name home.html to view our static files
{% load static %}
<img src = "{% static 'logo.png' %}" height="200" width="200" class="d-inline-block align-top">
<br>
<h1>Hi its working</h1>
now to view this page we need to give a route for it so now just add this in url.py of checkstatic
from django.contrib import admin
from django.urls import path
from showstatic import views
urlpatterns = [
   path('admin/', admin.site.urls),
   path('',views.home,name='home'),
]
 and in views.py of showstatic add this 
def home(request):
   return render(request,'home.html')
 now run the server and see
python3 manage.py runserver
Bingo its working!!
Python Django
Python
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Comments
Old Comments
How to Install PIP on Windows ?
How to drop one or multiple columns in Pandas Dataframe
How To Convert Python Dictionary To JSON?
Check if element exists in list in Python
Python | Pandas dataframe.groupby()
Python | Get unique values from a list
Defaultdict in Python
Python | os.path.join() method
Python Classes and Objects
Create a directory in Python