1

My Problem is quite simple and yet I'm finding it so hard to solve it. The problem is I am not able to load the CSS File and image which are on the static folder located on the root folder of the project. The static folder is not under the app name.

My project name is "ecommerce" and my app name is "store".

This is my file hierarchy for my project.

enter image description here

This is my settings.py

enter image description here

I have added my app too.

enter image description here

Yes, the STATICFILES_DIRS too.

enter image description here

Tried the other one too.

STATICFILES_DIRS = [
BASE_DIR / "static",

]

I used temp.html for showing the demo and here is my code.

enter image description here

And the CSS file which is named main.css

enter image description here

After doing all the things properly, the CSS file and image won't load.

enter image description here

Errors That I got in my terminal

enter image description here

And in developer mode in Chrome

enter image description here

As I know this is quite a rookie mistake and I am a beginner. I can't continue forward till this problem is solved. I'd be grateful if someone could come forward and assist me in resolving the issue.

yugahang
  • 27
  • 4

1 Answers1

0

First of all move your static folder in app directory that is store here

Now make another store folder inside the static

static/store

Now make all folders like css, js and img in static/store directory. Then Replace your css link in this link

<link rel="stylesheet" href="{% static 'css/main.css' %}">

And img tag link.

<img src="{% static 'images/cart.png' %}" alt="My image">

Tariq Ahmed
  • 471
  • 3
  • 14