Important changes needed in settings.py file
INSTALLED_APPS = [
'store.apps.StoreConfig',
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
]
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'static')
]
Instructions for main.html file
<!DOCTYPE html>
<html lang="en">
{% load static %}
<head>
<title>Ecom</title>
<meta charset="UTF-8">
<!-- CSS only -->
<link href="https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="aac8c5c5ded9ded8cbdaea9f849a9ac2dc8b99">[email protected]</a>/dist/css/bootstrap.min.css"
rel="stylesheet" integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6"
crossorigin="anonymous">
<link rel="stylesheet" href="{% static 'css/main.css' %}">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<h2>main</h2>
(% block content %}
{% endblock %}
</body>
CSS rules in main.css file
body {
background: #FF0000; }
An alternative using !important (not recommended)
The template I was attempting to display, store.html
{% extends 'store/main.html' %}
{% load static %}
{% block content %}
<h1>color</h1>
{% endblock %}
Page preview available here
Project file structure,
src
-static
-css
-main.css
-store
-templates
-store
-main.html
-store.html
The issue lies in not being able to see the customized background color of the body. Is the problem related to bootstrap, my custom css properties, {% extend ...}, or a missing element in settings.py. As a Django novice, any guidance on resolving this bug would be greatly appreciated.