Menu
CoddyTech

קבצים סטטיים

חלק מהיחידה יסודות Django במסלול ה-Django של Coddy. שיעור 20 מתוך 23.

הדפים של בית הקפה שחורים על גבי לבן. גיליון סגנונות ישנה את זה, וגיליונות סגנונות, סקריפטים ותמונות הם קבצים סטטיים: השרת שולח אותם כפי שהם, בלי תצוגה. Django מוצא אותם באותו אופן שבו הוא מוצא תבניות, בתיקיית static/ של כל אפליקציה מותקנת, ושם האפליקציה מופיע שוב בתוכה:

shop/static/shop/cart.js

הם מוגשים תחת STATIC_URL, שמוגדר כ-"static/" בקובץ settings.py, ולכן הנתיב לקובץ הזה הוא /static/shop/cart.js. תבנית בונה את הכתובת באמצעות {% static %}, אחרי {% load static %}:

{% load static %}
<script src="{% static 'shop/cart.js' %}"></script>

את <link rel="stylesheet" href="..."> של גיליון סגנונות שמים בתוך <head>. שימו אותו ב-base.html, וכל דף שמרחיב אותו יקבל אותו.

challenge icon

אתגר

קל
  • צרו את menu/static/menu/style.css עם לפחות body { background: #fdf8f2; }.
  • ב־base.html, טענו את תגיות הקבצים הסטטיים וקשרו את גיליון הסגנונות בתוך <head>, כך שכל עמוד יקשר אל /static/menu/style.css.

לחצו על Run: הדפים יקבלו גוון קרם. פתחו את /static/menu/style.css כדי לראות את הקובץ ש־Django מגיש.

נסו בעצמכם

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>{% block title %}Corner Café{% endblock %}</title>
</head>
<body>
    <nav>
        <a href="{% url 'menu:home' %}">Home</a>
        <a href="{% url 'menu:drinks' %}">Drinks</a>
        <a href="{% url 'menu:about' %}">About</a>
    </nav>
    <main>
        {% block content %}{% endblock %}
    </main>
</body>
</html>
quiz iconבחנו את עצמכם

השיעור הזה כולל חידון קצר. התחילו את השיעור כדי לענות עליו ולעקוב אחרי ההתקדמות.

כל השיעורים ביחידה יסודות Django

תרגלו בעצמכם: Django אונליין