Using a readymade Template for django frontend - django

Question

I tried using a readymade HTML5 template for my Django Project and updated the static links and all but it fails to load the CSS and js and other static files too.
My folder structure :
**MyProject
apps
templates
MyProject
static
MyProject
css
js
etc**
My Settings for static :
STATIC_URL = '/static/'
STATICFILES_DIRS = [os.path.join(BASE_DIR, "static")]
TEMPLATES = [
......
'DIRS': [os.path.join(BASE_DIR, 'templates'),
os.path.join(BASE_DIR,'static') .
..... ]
I have tried
using the collectstatic command.
Adding STATICFILES_DIRS.
Adding this code snippet to urls.py
Trace from terminal:
[04/Apr/2020 13:04:51] "GET /static/css/owl.theme.default.min.css HTTP/1.1" 404 1814
[04/Apr/2020 13:04:51] "GET /static/css/animate.css HTTP/1.1" 404 1772
[04/Apr/2020 13:04:51] "GET /static/css/magnific-popup.css HTTP/1.1" 404 1793
[04/Apr/2020 13:04:51] "GET /static/css/aos.css HTTP/1.1" 404 1760
[04/Apr/2020 13:04:51] "GET /static/css/owl.carousel.min.css HTTP/1.1" 404 1799

Answer 1

collectstatic will collect static resources that you have placed in your individual apps and copy them to an app directory within the project static directory. So, if you have an app static directory like this:
my_app
static
my_app
css
js
etc
your project static dir will look like this after collectstatic:
static
my_app
css
js
etc
You can also manually place static resources in the project static directory. This is a good place for your project wide css, js, and image files.
static
css
images
js
From the 404 errors you posted, the server is looking for your css files in the static/css/ directory and you have your css directory inside the MyProject directory. Move your css directory out one level and place your css files there and it should work.

Answer 2

static
MyProject
css
js
Your Error:
"GET /static/css/owl.theme.default.min.css HTTP/1.1" 404 1814
according to your error server is looking your file in static folder and then in css while your files is in static/MyProject/css
so, update your code in your html file
{% static 'MyProject/css/owl.theme.default.min.css' %}