How can I apply bootstrap to my whole django project? - django

I've been looking at a few guides on applying bootsrap to django, and I am as far as having a static file in the root of my site, containing the css and js files within bootstrap, but when it comes to linking the files I am having an issue.
So I am trying to link the stylesheet inside of my base.html file but am not sure how to format it as for some reason using {% %} inside of the href field is being interpreted as part of the directory. In one of the videos I have watched he links it like thisBut I'm not really sure how to interpret this as trying to apply it to my own like so
href = "{% static 'artForAll/css/bootstrap.css' %}"
With the file structure for reference:
\AFA\src\artForAll\static\artForAll\css
I am given an error about a non existent file as it is taking the {%%} as part of the directory
My settings.py
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR,"static"),
]
File structure(blue highlighted file is where BASE_DIR leads:

Related

Django : Page Not Found when trying to access static files

I know there are already several threads on the topic. I've been through most of them (especially all the troubleshooting listed in this one) but I can't figure out my issue.
I am trying to use a Bootstrap template in my Django project, and I'd like to simply start by accessing the files in the /static/ directory. My project directory looks like this :
Whenever I try to load the page http://localhost:8000/static/theme/assets/css/style.css it returns a Page not found error (and obviously no CSS/JS content appears on my index).
Here are my settings:
I have debug = True
ÌNSTALLED_APPS contains django.contrib.staticfiles
settings.py looks like this :
STATIC_URL = "/static/"
STATICFILES_DIRS = (os.path.join(BASE_DIR, "static/"),)
But I still can't access anything from the /static/ directory.
I tried to access the CSS and JS files in base.html this way :
{% load static %}
...
<link href="{% static 'theme/assets/css/style.css' %}" rel="stylesheet">
I really have no clue how I could solve this.
Thanks in advance for your help !
Is base.html properly bound to a URL and to a view function via a URL dispatcher ? Can you access that file from your browser ?
If yes, try to substitute this line
STATICFILES_DIRS = (os.path.join(BASE_DIR, "static/"),)
with this one
STATICFILES_DIRS = (os.path.join(BASE_DIR, "static"),)

Django cannot find images under templates

So I am creating a Django project and put an image on an HTML page. Issue is that the server cannot see it.
This is my folder structure: mysite/app/templates/app/img/pic.png
The HTML page is in: mysite/app/templates
I tried many different scr formats, such as: <img src="../app/img/pic.png"> but it did not work.
You have to set STATICFILES_DIRS to add the folder that you want, or try to put all the static in a folder and reference it in STATICFILES_DIRS, like this:
STATICFILES_DIRS = [
BASE_DIR / "static",
'/var/www/static/',
]
the first url will be <the root of your project>/static
the second url will be that exactly.
For more info you have the docs right here: https://docs.djangoproject.com/en/3.2/howto/static-files/#managing-static-files-e-g-images-javascript-css

Problem while loading static files|| django

iam learning Django i have learned pretty much. I used static method to rendered css and other static files. But changes iam making to css which is in static files are not reflacting on webpage . i have to close all files and restart vscode again to see those changes. I have not added code because im not getting any error at all .
( example :: i have changed font size of all anchors . Normally it should be changes on webpage after saving and refreshing the page. but in this case font size is not changing. i have to close all files and reopen them and after starting the server again i can see those changes which i made to anchor tag. )
Any one who knows why because to see changes restart whole project will never be a good option. thanks in Advance
At the beginning of your code use {% load static %} and where ever you want to use the files from static folder use {% static 'name of your file' %}
Make sure you've not added your static folder in your base directory. In such case update your settings.py
STATIC_URL = '/static/'
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'static')
]
STATIC_ROOT = os.path.join(BASE_DIR, 'assets')
you can use whichever name you like instead of assets

Django - Load static files from another app

In app1 I am trying to load static files from app2. I set no STATICFILES_FINDERS in project settings.py, which means, Django will use default AppDirectoriesFinder when it finds static subdirectory inside app directory.
Problem:
In template files of app1, I can generate urls of static files for app1 very easily. But if I want app1 template files to generate urls for static files of app2, links are not working. How can I in app1 generate static files of app2?
App1 template file:
{% load static %}
<img src="{% static "app1/example.jpg" %}"> <!-- ok -->
<img src="{% static "app2/example.jpg" %}"> <!-- link broken -->
HTML Output:
<img src="http://localhost:8000/static/app1/example.jpg">
<img src="http://localhost:8000/static/app2/example.jpg">
I had the same problem. I handled it setting this var in settings.py
STATICFILES_DIRS = [
os.path.join(BASE_DIR, 'app1/static/'),
os.path.join(BASE_DIR, 'app2/static/'),
]
So, both dirs become avaliable in static template tag regardless from which app you're calling it.
I'm using django 2.1.
Obs:
1 - Maybe this come set by default when you use the startapp command. Idk.
2 - BASE_DIR is the abs path to settings.py.
I found a solution. Please be aware, that directory in your project folder, which is named exactly same as your project folder is not an app. At first thought it is the initial app, that is automatically created by Django, but it isnt.
If you have two apps, and you want to load static files between them, code examples above works.
Just add this to your settings.py (from the Django documentation)
STATICFILES_DIRS = [
BASE_DIR / "static",
'var/www/static/',
]

Cannot get images to display in Django(1.3) project

I'm making a simple Django project but I cannot get any images to display in my pages.
Django documentation at https://docs.djangoproject.com/en/1.3/howto/static-files/#basic-usage states
Basic usage Put your static files somewhere that staticfiles will find
them.
By default, this means within static/ subdirectories of apps in your
INSTALLED_APPS.
Your project will probably also have static assets that aren’t tied to
a particular app. The STATICFILES_DIRS setting is a tuple of
filesystem directories to check when loading static files. It’s a
search path that is by default empty. See the STATICFILES_DIRS docs
how to extend this list of additional paths.
Additionally, see the documentation for the STATICFILES_FINDERS
setting for details on how staticfiles finds your files.
Make sure that django.contrib.staticfiles is included in your
INSTALLED_APPS.
For local development, if you are using runserver or adding
staticfiles_urlpatterns to your URLconf, you’re done with the setup –
your static files will automatically be served at the default (for
newly created projects) STATIC_URL of /static/.
You’ll probably need to refer to these files in your templates. The
easiest method is to use the included context processor which allows
template code like:
See Referring to
static files in templates for more details, including an alternate
method using a template tag.
So I did this in settings.py:
STATICFILES_DIRS = (
'/home/abc/django/project1/media/',
)
and enabled 'django.contrib.staticfiles',
In media, I have a folder img, which has various jpg files.
In my template, I have this as one of the lines:
<img src="{{STATIC_URL}}img/{{var}}.jpg">
When I'm passing var to this template via my view.
The HTML page seems to render this tag as "<img src="img/abc.jpg"> where var="abc".
But my browser refuses to display the image. What have I done wrong?
Did you see ths part in the documentation:
If {{ STATIC_URL }} isn't working in your template, you're probably not using RequestContext when rendering the template.
Do you also use RequestContext in your view to render the template?
Here is an alternative approach:
settings.py:
import os
PROJECT_DIR = os.path.dirname(__file__) + '/../'
STATIC_ROOT = os.path.join(PROJECT_DIR, 'media/')
STATIC_URL = '/media/'
In your template:
{% load staticfiles %}
<img src="{% static img/foo.jpg %}" />
If you need to pass a variable, use the prefix method:
{% load staticfiles %}
<img src="{% get_static_prefix %}img/{{var}}.jpg" />