I am trying to include my gallery.html and gallery.css files within my base.html. After running the collectstatic and runserver commands, I am unable to locate the gallery.css and html files when inspecting with Chrome Dev Tools. Only the base.html and its associated css file are showing up.
This is the project structure:
/proj
/gallery
/static
/css
gallery.css
/templates
gallery.html
/proj
/templates
base.html
/static
/css
base.css
Contents of base.html:
{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Bootstrap 101 Template</title>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap-theme.min.css">
<!-- Base css -->
<link rel="stylesheet" type="text/css" href="{% static "css/base.css" %}">
</head>
<body class="background">
<div class="wrapper">
{% block content %}
<!-- Content goes here-->
{% endblock %}
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
</body>
</html>
Contents of gallery.html:
{% extends "base.html" %}
{% block content %}
<!-- Container for photos-->
<script type="text/javascript" src="{% static "js/masonry.pkgd.minjs" %}"></script>
<link rel="stylesheet" type="text/css" href="{% static "css/gallery.css" %}">
<div class="gallery-container">
dsfsdfdsfdsf
</div>
{% endblock %}
Contents of gallery.css:
.gallery-container {
background-color: red;
width: 50%;
height: 50%;
margin: 0px;
padding: 0px;
}
Contents of base.css:
html, body {
width: 100%;
height: 100%;
margin: 0px;
padding: 0px;
}
.background {
background-color:#b0a0e6;
}
.wrapper {
background-color: grey;
height: 100%;
width: 75%;
margin-left: auto;
margin-right: auto;
overflow:auto;
}
settings.py configuration:
STATIC_URL = '/static/'
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
)
STATICFILES_STORAGE = (
'django.contrib.staticfiles.storage.StaticFilesStorage'
)
STATIC_ROOT = os.path.realpath(os.path.join(BASE_DIR, '..', 'websiteAssets'))
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'static'),
)
TEMPLATE_DIRS = (
os.path.join(BASE_DIR,'templates'),
os.path.join(BASE_DIR,'home/templates'),
os.path.join(BASE_DIR,'gallery/templates'),
os.path.join(BASE_DIR,'contact/templates'),
os.path.join(BASE_DIR,'aboutme/templates'),
)