We Keep Coding

My website was showing CSS fine until I did collectstatic - Django

My website was doing everything well and showing all the CSS until I ran collectstatic on it. Now everything is how it would look if CSS didn't exist. Is there any solution to this? Or is there some way I can delete the collectstatic to get back the previous thing?
I followed this tutorial to host this website: https://www.digitalocean.com/community/tutorials/how-to-set-up-django-with-postgres-nginx-and-gunicorn-on-ubuntu-16-04
Here's my settings.py(only the last bit where I set the static and the media stuff):
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static/')
STATICFILES_DIRS = []
MEDIA_ROOT = os.path.join(BASE_DIR, 'media')
MEDIA_URL = '/media/'
LOGIN_URL = '/main/user_login/'

Okay, so as you mentioned it stopped working after you ran collectstatic command.
collectstatic command makes Django looks for all static files in your apps and collects them in a single directory which is STATIC_ROOT. (In production it needs a single directory for all the static files)
Put the directories containing your static files into the STATICFILES_DIRS.
You also have to include your static urls in your urls.py
from django.contrib.staticfiles.urls import staticfiles_urlpatterns
urlpatterns = [your paths go here]
urlpatterns += staticfiles_urlpatterns()
After including your static directories into the STATICFILES_DIRS array and including the static urls in your urls.py, use the command collectstatic and then it should work.

In Django, which directory should static files be?

I have my static files in sub_app directory. I will name the folder sub_app where view.py, model.py are located. And when I run python manage.py findstatic it returns sub_app\static folder.
I have another folder name as main_app, where settings.py file is located. These two folders and manage.py file is located in a root folder.
I have no issue when DEBUG=True, but when I run DEBUG=False, I got following warning
venv\lib\site-packages\whitenoise\base.py:115: UserWarning: No directory at: root\static\
warnings.warn(u"No directory at: {}".format(root))
Here are static files settings
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
STATICFILES_STORAGE = 'whitenoise.storage.CompressedManifestStaticFilesStorage'
Where should my static files?

You can put your static files anywhere, as long as you let your application know where they are. You have it configured that
STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
but you say that you have your static files in sub_app\static. The error is telling you that it's checking the root folder. You need to change your configuration to
STATIC_URL = '/sub_app/static/'
STATIC_ROOT = '/sub_app/static'

Create a directory named static inside the app directory where the "view.py, model.py are located."
Inside static you need to create another directory with the same name as of the app.
Inside that folder you can create your static files which include anything like your css files
Just add this line in the settings.py of your app
STATIC_URL = '/static/'
As you mentioned sub_app
you should create sub_app/static/sub_app directory.

trouble with media folder pythonanywhere

pythonanywhere cant find files in me media folder
But I have this file!
roots in my settings.py
STATIC_URL = '/static/'
STATIC_ROOT = '/home/dimabytes/my-first-blog/static'
MEDIA_ROOT = '/home/dimabytes/my-first-blog/media'
MEDIA_URL = '/media/'
me web page at pythonanywhere

The problem was that I automatically displayed the working directory in the folder with my name. It was necessary to finish the path of the project

It's because you have your path configured incorrectly, either when you call for the media or your MEDIA_ROOT and MEDIA_URL, most likely the former. If you look at your pythonanywhere file storage and your error output, it's looking for the file in media/static/<file_here>. Your targeted file is in /media/file/<file_here>.

Django: static files returning 404 error

I want to be able to load my static files on my local server, but when I request them, the browser returns 404 for every resource.
From what I can understand, STATIC_URL is the url in which my static files will be served. And STATICFILES_FINDERS specifies how my static files will be discovered. I set STATICFILES_DIRS to search for the static directory at the project root, but it doesn't seem to be be finding it.
On my settings.py,
# Python 2.7.5, Django 1.6
import os
BASE_DIR = os.path.dirname(os.path.dirname(__file__))
STATIC_URL = '/static/'
STATICFILES_FINDERS = (
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
)
STATICFILES_DIRS = (os.path.join(BASE_DIR, 'static'),)
This is my directory structure:
.
|-- myapp
|-- settings.py
|-- ...
static
|-- images
|-- javascript
|-- stylesheets

Here are a couple of ideas:
You need a server for your static files. Are you using Apache HTTP server? The easiest way to serve your static files is to alias them in the httpd.conf file:
Alias /static/ /path/to/static/
<Directory /path/to/static>
Require all granted
</Directory>
You need to specify a STATIC_ROOT, which could be /path/to/your_project/static but then you probably want to put your current static files and folders somewhere else, because everything in STATIC_ROOT will be overwritten when you call manage.py collectstatic. I put all of my static files, such as Bootstrap, Tablesorter, images and icons in a folder called assets, then put assets in my STATICFILES_DIR list.
Use manage.py collectstatic to collect all static files and put them in STATIC_ROOT so that Apache can find them. Static files for the admin site will be automatically copied even if you do not add them to the list of STATICFILES_DIR.
Check out this post I wrote, which has several links to Django documentation on the topic.

Differences between STATICFILES_DIR, STATIC_ROOT and MEDIA_ROOT

What are the differences of these three static url?
I am not sure if I am right, I am using the MEDIA_ROOT to store my uploaded photos (via models.ImageField())
However, I created a JS script to my admin and in admin.py. I defined the media as below:
....
class Media:
js = ('/admin/custom.js', )
and my settings.py:
....
STATIC_ROOT = "/home/user/project/django1/top/listing/static"
and I added the custom.js to STATIC_ROOT/admin/custom.js, but it is not working. Throwing 404 not found error.
And then I change the STATIC_ROOT to STATICFILES_DIRS, and it works!!
....
STATICFILES_DIRS = "/home/user/project/django1/top/listing/static"
So, I am not understand what is going on here. In fact, I just don't understand what is the difference between STATIC_ROOT and STATICFILES_DIRS.
Currently I am testing Django in my machine via virtualenv, not deployed yet, is it the reason STATIC_ROOT not working??

Development
STATIC_ROOT is useless during development, it's only required for deployment.
While in development, STATIC_ROOT does nothing. You don't even need to set it. Django looks for static files inside each app's directory (myProject/appName/static) and serves them automatically.
This is the magic done by manage.py runserver when DEBUG=True.
Deployment
When your project goes live, things differ. Most likely you will serve dynamic content using Django and static files will be served by Nginx. Why? Because Nginx is incredibly efficient and will reduce the workload off Django.
This is where STATIC_ROOT becomes handy, as Nginx doesn't know anything about your Django project and doesn't know where to find static files.
So you set STATIC_ROOT = '/some/folder/' and tell Nginx to look for static files in /some/folder/. Then you run manage.py collectstatic and Django will copy static files from all the apps you have to /some/folder/.
Extra directories for static files
STATICFILES_DIRS is used to include additional directories for collectstatic to look for. For example, by default, Django doesn't recognize /myProject/static/. So you can include it yourself.
Example
STATIC_URL = '/static/'
if not DEBUG:
STATIC_ROOT = '/home/django/www-data/example.com/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'static/'),
]

You can find these settings in the Django documentation. Here are my own definitions and quotations from the documentation:
MEDIA_ROOT is the folder where files uploaded using FileField will go.
Absolute filesystem path to the directory that will hold user-uploaded files.
STATIC_ROOT is the folder where static files will be stored after using manage.py collectstatic
The absolute path to the directory where collectstatic will collect static files for deployment.
If the staticfiles contrib app is enabled (default) the collectstatic management command will collect static files into this directory. See the howto on managing static files for more details about usage.
STATICFILES_DIRS is the list of folders where Django will search for additional static files aside from the static folder of each app installed.
This setting defines the additional locations the staticfiles app will traverse if the FileSystemFinder finder is enabled, e.g. if you use the collectstatic or findstatic management command or use the static file serving view.
In your settings, you should have:
MEDIA_ROOT = os.path.join(BASE_DIR, "media/")
STATIC_ROOT = os.path.join(BASE_DIR, "static/")
# Make a tuple of strings instead of a string
STATICFILES_DIRS = ("/home/user/project/django1/top/listing/static", )
...where:
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
as defined in the default Django settings.py now.

Difference between STATICFILES_DIRS and STATIC_ROOT
The STATICFILES_DIRS can contain other directories (not necessarily app directories) with static files and these static files will be collected into your STATIC_ROOT when you run collectstatic. These static files will then be served by your web server and they will be served from your STATIC_ROOT.
If you have files currently in your STATIC_ROOT that you wish to serve then you need to move these to a different directory and put that other directory in STATICFILES_DIRS. Your STATIC_ROOT directory should be empty and all static files should be collected into that directory.
MEDIA_ROOT where media files ,all uploaded files goes.
Example : Images, Files

class Media:
js = ('/admin/custom.js', )
but it is not working. Throwing 404 not found error.
The 404 error is in part because of the leading slash in the file path.