Global statik fayllar qo‘shish

Global CSS fayl qo‘shish

Biz ilovaning static papkasiga statik faylni qanday qo‘shishni va undan ilovada qanday foydalanishni o‘rgandik.

Ammo loyihangizdagi boshqa ilovalar ham bu fayldan foydalanmoqchi bo‘lsa-chi?

U holda ildiz katalogda papka yaratib, fayl(lar)ni o‘sha yerga joylashtirishimiz kerak.

Ildiz katalogda static papkasini yaratib qo‘yib, qolganini Django o‘zi hal qiladi deb kutish yetarli emas. Biz Django’ga bu statik fayllarni qayerdan qidirish kerakligini aytishimiz kerak.

Avval loyihaning ildiz darajasida papka yarating. Bu papkani xohlagancha nomlash mumkin, men ushbu darslikda uni mystaticfiles deb nomlayman:

my_tennis_club db.sqlite3 manage.py my_tennis_club/ members/ mystaticfiles/

mystaticfiles papkasiga CSS fayl qo‘shing. Nomini o‘zingiz tanlaysiz, bu misolda biz uni myglobal.css deb nomlaymiz:

my_tennis_club db.sqlite3 manage.py my_tennis_club/ members/ mystaticfiles/ myglobal.css

CSS faylni oching va unga quyidagini qo‘shing:

my_tennis_club/mystaticfiles/myglobal.css:

body {
  color: violet;
}

Sozlamalarni o‘zgartirish

Django’ga statik fayllarni ildiz katalogdagi mystaticfiles papkasidan ham qidirishni aytishingiz kerak. Bu settings.py faylida amalga oshiriladi:

STATICFILES_DIRS ro‘yxatini qo‘shing:

my_tennis_club/my_tennis_club/settings.py:

.
.

STATIC_ROOT = BASE_DIR / 'productionfiles'

STATIC_URL = 'static/'

#Add this in your settings.py file:
STATICFILES_DIRS = [
    BASE_DIR / 'mystaticfiles'
]
.
.

STATICFILES_DIRS ro‘yxatida Django statik fayllarni qidirishi kerak bo‘lgan barcha kataloglarni sanab o‘tishingiz mumkin.

BASE_DIR kalit so‘zi loyihaning ildiz katalogini bildiradi va / "mystaticfiles" bilan birgalikda ildiz katalogdagi mystaticfiles papkasini anglatadi.

Qidiruv tartibi

Agar bir xil nomli fayllar bo‘lsa, Django birinchi topilgan fayldan foydalanadi.

Qidiruv STATICFILES_DIRS ro‘yxatida keltirilgan kataloglardan, siz ko‘rsatgan tartibda boshlanadi. So‘ngra, agar fayl topilmasa, qidiruv har bir ilovaning static papkasida davom etadi.

Shablonni o‘zgartirish

Endi sizda butun loyiha uchun global CSS fayl bor va unga barcha ilovalaringizdan murojaat qilish mumkin.

Undan shablonda foydalanish uchun myfirst.css fayli uchun qo‘llagan sintaksisdan foydalaning:

Shablonni quyidagi qator bilan boshlang:

{% load static %}

Faylga esa quyidagicha murojaat qiling:

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

Misol

my_tennis_club/members/templates/template.html:

{% load static %}
<!DOCTYPE html>
<html>
<link rel="stylesheet" href="{% static 'myglobal.css' %}">
<body>

{% for x in fruits %}
  <h1>{{ x }}</h1>
{% endfor %}

</body>
</html>

Misolni ishga tushirish »

Ishlamadimi?

Ha, shunday. Statik fayllarni yana bir marta yig‘ishingiz kerak.

Statik fayllarni yig‘ish

Yangi statik faylni yig‘ish uchun collectstatic buyrug‘ini ishga tushiring:

python manage.py collectstatic

Natija quyidagicha bo‘ladi:

You have requested to collect static files at the destination location as specified in your settings: C:\Users\Your Name\myworld\my_tennis_club\productionfiles This will overwrite existing files! Are you sure you want to do this? Type 'yes' to continue, or 'no' to cancel:

yes deb yozing:

Type 'yes' to continue, or 'no' to cancel: yes

Natija quyidagicha bo‘ladi:

1 static file copied to 'C:\Users\Your Name\myworld\my_tennis_club\productionfiles', 128 unmodified.

Endi misol ishlashi kerak

Serverni ishga tushiring, shunda misol ishlaydi:

python manage.py runserver

Natijani o‘z brauzeringizda ko‘ring: 127.0.0.1:8000/testing/.

Misol

my_tennis_club/members/templates/template.html:

{% load static %}
<!DOCTYPE html>
<html>
<link rel="stylesheet" href="{% static 'myglobal.css' %}">
<body>

{% for x in fruits %}
  <h1>{{ x }}</h1>
{% endfor %}

</body>
</html>

Misolni ishga tushirish »

W3Schools Pathfinder

Yutuqlaringizni kuzating – bu bepul!

Ro'yxatdan o'tish Kirish