css js and images are not loading on django p2 best method

css js and images are not loading on django p2 best method

If your css js and images are not loading on django website then you definitely need to go through this post thoroughly. So let’s get started. What If you made All the frontend files and want to create a Django backend for that website and getting errors which is generally happen, checkout this link to solve all other problems, so first go and see those solved problems from here: link frontend website with django backend p1.

First open your settings.py file ( if you don’t know what and where the folder is then first see the linked  frontend website with django backend p1 post first) and go at the bottom of the page, there you need to add two lines of code. Which is below:

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR,'static')

If you saw the first line on that file anywhere, you can only paste the second line of code, otherwise you can paste both of them. After press ctrl+s to save the file, and close the file. Now in your project folder and open urls.py file there you need to add the below highlighted section to the file:

from django.contrib import admin
from django.urls import path,include
from django.conf import settings
from django.conf.urls.static import static
 
urlpatterns = [
    path(admin/', admin.site.urls),
    path('',include(.urls')),
]+static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

Now go to your app folder ( if you don’t know what app folder is then first see the linked link frontend website with django backend p1 post first) and there make a new folder called static there you have to make three folders called css, js and images you have to paste all the css files in the css folder and all javascript files on js folder and all images to the images folder so that everything will be organized on each folder. 

Now go to your templates( html files ) and there on the top you need to provide a piece of code so that every thing of the static files can be accessible for the template. The code is {% load static %} this is a short django template code that will load static links on your template.

Now where you have loaded the link tag there you only have to provide the location as /static/css/.css/ and same in your javascript files as /static/js/.js/ you have to do the same on the images, in href you need to provide /static/images// this will load all of your css, js and images to your templates.

This will solve the problem of not loading those items on your template.

I you didn’t see the first part of Django backend problem solving link frontend website with django backend p1 then go and see that first.

other posts to check out: Beautiful Website Making Tip #2

django docs: https://docs.djangoproject.com/en/3.1/

Hope to see you on another post.