The command `python3 manage.py findstatic` is unable to locate the static file

I have been struggling to incorporate static files into my project, but the CSS is not loading. I tried using findstatic but Django is unable to locate any static directory: https://i.sstatic.net/jRgzx.png https://i.sstatic.net/7VG0x.png

In a different project, Django is able to find the static folder without any issues: https://i.sstatic.net/IsLlr.png

https://i.sstatic.net/HKR8P.png

Here are snippets of my settings.py:

STATIC_URL = '/static/'

This is how my base.html looks like:

{% load static %}
<!DOCTYPE html>
<html>
<head>
    <meta charset = "utf-8">
    <link href = "{% static 'css/base.css' %}" rel = 'stylesheet'>
    <title>{% block title %}Educa{% endblock %}</title>
</head>
<body>
<div id = 'header'>
    <a href = "/" class = 'logo'>EDUCATION</a>
    <ul class = 'menu'>
        {% if request.user.is_authenticated %}
            <li><a href = "{% url 'logout' %}">Logout</a></li>
        {% else %}
            <li><a href = "{% url 'login'%}">Login</a></li>
        {% endif %}
    </ul>
</div id ='content'>
{% block content %}{% endblock %}
<script src = 'https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/
jquery.min.js'></script>
<script>
    $(document).ready(function(){
        {% block domready %}
        {% endblock %}
    });
</script>
</body>
</html>

Any help would be appreciated! Thank you

Answer №1

Surprisingly, I discovered a strange issue while attempting to rename my static folder. There was an unexpected space after 'static', causing the CSS not to load properly for this project. To resolve it, I renamed the file from base.css to main.css and updated the link reference as follows:

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

After making these changes, everything started working perfectly. Thanks to everyone for the assistance and apologies for the confusion!

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Decrease the interactive area for an image

I have successfully designed a left navigation bar using buttons. Currently, I am facing two main issues that I need assistance with. Firstly, I am trying to limit the hyperlink area to just the background image. Secondly, the elements that are overlaying ...

PyCharm does not support certain options for projects that are not pure Python, such as Django projects

I'm currently working on setting up a Django project. The tutorial I'm following indicates that when creating a new project, I should see possible selections like the image below: https://i.sstatic.net/oPSDd.png However, when I tried to create ...

What is the best way to add pictures (such as ones from my desktop) to my django-tinymce formField?

I am working on an HTML page (not Django admin) that features a WYSIWYG TinyMCE field. I am able to write text with it, but experiencing trouble when trying to upload images to complement the text. Additionally, I would like to assign a specific class to t ...

How can I automatically direct my NodeJS application to the login screen?

Here is the setup of my project structure: There is a simple folder called static, within which I have: index.html (the homepage for user registration) login.html (the login page) In the parent folder, there is a file named server.js: // NodeJS code for ...

Initiating a troubleshooting session for Django within the PyCharm environment

While working on a Django site in PyCharm, I have noticed that starting the internal Django server is easy by simply clicking the green Run arrow. However, once it's running, there doesn't seem to be a clear way to stop it. In a shell environment ...

Navigate to the element and retrieve a null offset

Currently, I am attempting to retrieve an element's ID from a select box and then scroll to that specific element using the following code snippet: // move to services $(function () { $("select.jump").change(function() { var selected = $( ...

What is the method for selectively applying a "fade to black" mask to an input field?

For my current project, I need to incorporate a design feature where a "fade to black" mask gradually appears on the left side of an input field once the text content reaches the maximum visible width of the input box. The image below provides a visual re ...

Having trouble with aligning the wrapper div

I am looking to create a div with text inside it. Within that div, I also want another div that matches the same position and size. I have searched on various forums for a solution, but none of them seem to work when even a small detail is different. Curr ...

Implement a click event using jQuery specifically for Internet Explorer version 7

How can I add an onclick attribute using jQuery that is compatible with IE7? So far, the following code works in browsers other than IE8 and Mozilla: idLink = Removelst(); var newClick = new Function(idLink); $(test1).attr('onclick', null).clic ...

Transforming the content of a <div> into a variable in PHP

There is a website where you can place orders for various products. The titles of the products available to order are embedded in the HTML code like this: <div class="whatever"> Title </div> I am trying to extract this "title" and assi ...

Attempting to showcase extensive content based on the selection made in a drop-down menu

As a newcomer to anything beyond basic HTML, I am seeking guidance and assistance (preferably explained at a beginner level) for the following issue. If I have overlooked any crucial rules or concepts in my query, I apologize. I aim to have each selection ...

"The combination of Windows, @font-face, and Cyrillic characters presents a

I am encountering an issue with font-face and Cyrillic characters. The fonts display properly in any browser on OS X, but fail to render on a Windows 7 machine (chrome, ie etc). Even after putting the fonts through Font Squirrel and testing the demo files ...

When adjusting the month/year, the Material Date Picker extends beyond its container

Currently, I have an Angular 18 application with a page that includes a material date picker component. When I open the Date Picker, everything displays correctly. However, when I try to change the month using the left/right arrow or the year, the data co ...

Persist the checkbox value in the database and update the status of the label accordingly

I need a checkbox for user preference selection that is stored in a MySQL database for constant availability. The label should change to "Enabled" when the checkbox is selected and vice versa. Upon saving (submitting) the page, an alert message should disp ...

Ways to show dynamic text according to slider adjustments

I am struggling with adding an if condition to my form that includes a horizontal slider. My goal is to display text based on the position of the slider. Can someone offer some guidance on this, please? Here's my HTML code snippet: <form method=" ...

Steps to activate a particular Bootstrap tab upon clicking a hyperlink

Trying to implement a Bootstrap tab panel in the following manner: <ul class="nav nav-tabs" role="tablist"> <li class="nav-item"> <a class="nav-link active" data-toggle="tab" href ...

retrieving data in tabular form from a website

Looking to extract a table from this website by clicking on the "National Data" option. While I could easily download it, my interest lies in learning web scraping techniques. Previously, I utilized Python's Selenium package to automate the process of ...

PHP form - The issue with validation not functioning properly

I'm having trouble validating a simple PHP form with HTML code and it's not working as expected. Here is the HTML code: <form action="expresscontactform.php" method="post" name="form1" id="form1"> <label>Name </label>< ...

Utilizing combined selectors in styled-components: A comprehensive guide

My existing CSS code is structured like this: .btn_1 { color: #fff; background: #004dda; display: inline-block; } .btn_1:hover { background-color: #FFC107; color: #222 !important; } .btn_1.full-width { display: block; width: 100%; } I ...

When a user scrolls over an element with a data-attribute,

Looking to create a dynamic header effect on scroll? I have two headers, menu1 by default and menu2 hidden with display:none. In specific sections of my website, I've added a special attribute (data-ix="change-header") to trigger the header change. T ...