So, I'm using Django and pythonanywhere in order to setup an webpage, but I'm facing some issues when retrieving static files.
I've followed the tutorial for static files (which is great btw) and everything works for the index.html page. However, when trying to go to a second page, it throws an error which fits one of the issues described in this other link: https://help.pythonanywhere.com/pages/DebuggingStaticFiles/
The path to the file and the path in the URL don't quite match (eg, there's an extra level of folder hierarchy in one and not the other)
However, I don't know how to fix it... What is happening is that my log info shows that I'm loading:
/static/pgbfiles/medicine.png -- this is working for the index.html
/publicacoes/static/pgbfiles/img.css -- for the second page named publicacoes.html
What I would like to have is all the static files in one single folder. They are already there but I don't know how to tell Django that they are all there for both html files...
I think I could add an additional folder for the "publicacoes" files, but that is not what I would like to do atm.
And this is how I'm loading the info on both index and publicacoes.html:
{% load static %}
And then on the particular places where I need: href="{% static 'pgbfiles/bootstrap.min.css' %}"
Thank you for any help!
EDIT:
index.html is using: {% static 'pgbfiles/bootstrap.min.css' %} and working;
publicacoes.html was using {% static 'pgbfiles/img.css' %} but I changed it to {% static '/pgbfiles/img.css' %} and it is still not working -> still requests for "GET /publicacoes/static/pgbfiles/img.css".
Static info are:
STATIC_URL = 'static'
STATIC_ROOT = '/home/guideo/pgbadvogados/blog/static'
WORKING:
Now I've changed STATIC_URL to '/static' and it worked! So thanks a lot for the two comments and answer down below.
(only had to change it on settings.py, and not on publicacoes.html as I was doing before).
You're specifying a relative path (no preceding forward slash), so the request is going relative to the location of the page that contains it. Add a preceding slash to your href.
Related
When I make the website outside of Django it works perfectly fine. However, when I integrate everything in and put the CSS file in static files, it fails to load. The JavaScript file in the same folder loads perfectly fine. The files being used are: base.html, adminDash.html, admin.js, main.css, and admin.css. The admin.css file is the one specific to adminDash.html and is the one failing to load. Attached are images of all files, what the site should look like, and what it currently looks like.
admin.js
main.css
admin.css
adminDash.html
base.html
What it looks like outside Django:
What it looks like inside Django:
I have tried running it outside of the Django project, changing the file location, getting some friends to have a go at it, and getting chatGPT to try rewriting it.
In settings.py include your static file details:
STATIC_URL = '/static/'`
STATICFILES_DIRS=[os.path.join(BASE_DIR, 'static'),]`
Then run collect the static file.
➜ python manage.py collectstatic
Then load the below statement in base.html file:
{% load static %}
Hope this will help
I am new to GitPages and have successfully built and ran my page. However, the {% include %} and {% static %} methods in my index.html aren't being registered. As you can see here. Additionally, my two static files referenced in this file (circleselfie.png and home.css) have weird characters in their static paths when inspecting the page. Here is my project: https://github.com/jishli113/JSite/tree/master. What is causing this?
Gitpages, unfortunately, doesn't support a django backend. It's primarily for static/clientside sites, so your templates are just being treated as normal HTML.
So, i am literarily one week into learning web development and i'm following this Django tutorial, i got the index page that i swiped from online to compile properly with it's static elements also. Ran the "python3 manage.py collectstatic" command and everything.
So now i'm linking a registration page which i setup up as a new app in the project and when i try and put the css styling file it doesn't work. i've tried just puting in the same directory as the html templates, then i've moved it to styles and rerun the earlier python command so it's also present in assets, also made use of the "{% static 'abcde.css' %}" as well as {% load static %} in the register.html (only did it in the index initially) and i'm still having no luck with styling the page, any help would be appreciated
Edit:
I previously said i moved the css file but i meant the static file and run gatherstatics again so theres a copy in assets as well.
So now i'm linking a registration page which I setup up as a new app in the project and when i try and put the css styling file it doesn't work.
You should not put it in the same directory as the templates, nor in the directories for templates at all. It should be in a directory you use for static files, so the path is relative to the static root.
This thus means that if /static/ is the directory you marked with the STATIC_ROOT setting [Django-doc], and the file is located at /static/foo/bar.css, you use {% static 'foo/bar.css' %}.
I figured it out but I don't think I should be deleting my stack overflow question. It was just a simple syntax problem
what i had: {% static 'styles/style.css' % }
what you need: {% static 'styles/style.css' %}
that gap between the percentage and bracket was the problem
I want to know why static CSS files in Django always don't work as expected? I tried to include CSS styles in HTML style tag, and load static files in HTML. Only adding styles directly in tag attributes worked.
Some CSS code worked well in the static folder, some don't. I can't even style an h1's color through CSS files, which is one of the simplest styling things.
Still can't find a perfect way that can solve this problem.
Please help me with this ><
This is the 'base.html' file, where I extend all stuff from
This is 'index.html', extended from 'base.html'
In the second image, you can see there are no link tags that attach my CSS static files because it's not worked for me, so I took it off. And added a style tag instead.
The thing is, how to include CSS files is the accurate way??
Seems like the range which I extended is from the body tag of 'base.html', so the stuff in the head tag(where link tags should be placed) is also extended. And I guess that's the problem why my CSS files aren't correctly loaded?
If it is, can someone help me with some solutions please>< ?
In firefox and I think in chrome pressing F12 can show console, then we can see if all .css files are loaded properly and what is the problem, if they aren't. Can also pick element and see what css styles are applied to it and where they come from. Django has specific way of managing static files that may be misconfigured, if tags in the template work, then the problem is most likely in the static files.
Django will likely produce error message in the console if it can't provide a static file.
In any case, we may need some code from the template to see what is happening. If configured properly it can load static files, without problems, but there are steps to it. (explained here https://docs.djangoproject.com/en/4.0/howto/static-files/)
Can you use .js static files?Or any static files at all?
2 Important parts that may be missing. One is to use:
python manage.py collectstatic
Command after every change of static files.
https://docs.djangoproject.com/en/4.0/ref/contrib/staticfiles/#django-admin-collectstatic
The other is to start templates using staticfiles with:
{% load static %}
Then to remember the syntax for the files themselves like:
<link href="{% static 'introjs.min.css' %}" type="text/css" rel="stylesheet">
So django knows to load a static file instead.
Reply / Edit 2:
The tags seems ok(load static part). I think you don't need to repeat them in the same template, even if it extends other stuff, can just set it once every template that uses static files.
So there are 3 things you need. One is to have the tags in templates, as you do, the other is to have the static files in your static directory(specified in STATIC_URL in your settings file), and lastly to use collectstatic command after each change.
So lets say we look at
<link rel="stylesheet" href="{% static 'css/index.css' %}">
It looks good. That suggests you have 2 things for it to work. One is in your static files directory(defined in your settings file), you have:
static(or whatever name)/css subdirectory and then you have index.css file in there.
Also after you added the css file in there, to have done python manage.py collectstatic at least once.
The rest seems to be from CDNS(basically other hosting sites) Django should load them by itself, if the hosting there allows it.
Basically that is the idea,yea. All in here seems good. If there are still problems, check the static directory in settings py and make sure you used collectstatic after changes.
Errors will show in the terminal, so you can see if something isn't loading, why. : )
For errors in static files that are the 2 places to check. One is the terminal where python is providing info(or log files on the server if you can't see terminal), the other is the browser itself - it will show why it isn't loading a static file.
One time I spent a ton of time on the same problem. I deleted the !DOCTYPE html from the top of the html page and suddenly it worked as expected.
I have a base.html file extended by the index.html one. In base I load some static files in the section, and other in the bottom of the file.
I am trying to use the template tag for loading static files:
{% load static %}
However, depending where I put it, this works or fails.
When the tag is on the begining of the base (first line), this always does not work.
It works only when it is on the body section of the base.html and on the begining (just after extend tag) of the index.html.
Where is the correct place to put it ? Should it be called only once ?
EDIT:
DEBUG is set to False. There is no problem when it is set to True.